How can I integrate Laravel Notifications with my website? - php

Question

I have recently completed the task of setting up database notifications with Laravel. I am now able to send notifications. What I want to do now, however, is: when I send a notification, I want an icon (such as a bell) to appear on my website, where users can hover over this icon and see the notification header, or click on it to read the full content. Is this possible?
Also, is there a way that I can get a database to see all notifications that I have sent? Perhaps using MySQL.

Answer 1

For the first question:
Yes, you can fetch the notification for every user like this:
In controller that you want to pass the result of notification for every user
$user = App\User::find(1);
foreach ($user->unreadNotifications as $notification) {
echo $notification->type;
}
For the second question you should add a value to toArray function like th
And you can count the notification and show the message on header on anywhere you want with helping Ajax call or by every refresh html page,
In notification file
public function toArray($notifiable)
{
return [
'sender_id' => $this->user->id,
];
}
After that when you want to fetch this data (query on notification table to find notifications that you send) you can use JSON Where Clauses
I hope it will help you,

Answer 2

It's super easy get the latest notification and count .. Though the only differentiating factor here is how do you know there is a new notification from all your notifications. So I would suggest this design on your database.
Database
[id, name, latest]
Note: latest colunm is an integer type .eg. 0 or 1, where 0 is not latest and 1 is latest.
Inserting a Notification
So when you insert data save new notification in the db as latest e.g
$notification = new Notification();
$notification->name = 'whatever';
$notification->latest = 1; // important part
$notification->save()
Retrieving latest notification and Displaying a Bell
$latest_notification = Notification::where('latest', 1)->first(); // latest
//before responding to view - save notification as 0
$latest_notification->latest = 0;
$latest_notification->save();
if(latest_notification->isNotNull) {
return["latest" => latest_notification]
}else{
return["latest" => 0];
}
Front End Displaying Bell
<span id="notifier"></span>
Javascript -- Jquery
// if your response is not 0 then you have notification
// After post request to the server post or axios whatever you use
if(response.latest !== 0) {
$('#notifier').html('<i class="fas fa-bell"></i>' + '1')
} else {
$('#notifier').html('0')
}
Sorry have not had time to test this but this sure point you somewhere, all the best.