Browser notification using FilamentNotifications?

There is any way to implement push browser notification using the Notification package? I have already pusher realtime notifications working, but they are not showing as browser notification. Just inside the app. thanks in advance, i would be enough to have docs that i can read trough.
8 Replies
Dan Harrin
Dan Harrin2y ago
no, we dont have anything in filament like that but there is nothing stopping you building push notifications in the same way you would build them in a normal Laravel app
Hurruwa
HurruwaOP2y ago
Already working on that im using https://github.com/Nickersoft/push.js to do it. Thanks do
GitHub
GitHub - Nickersoft/push.js: The world's most versatile desktop not...
The world's most versatile desktop notifications framework :earth_americas: - GitHub - Nickersoft/push.js: The world's most versatile desktop notifications framework
Hurruwa
HurruwaOP2y ago
But one think, how can i get the event that its been launch from the notifications in filament?
buzkall
buzkall2y ago
were you able to figure out this?
Hurruwa
HurruwaOP2y ago
Not completetly, i had to pivot due to the deadline but i got good results with the laravel-notification-channels-webpush package
buzkall
buzkall2y ago
I'm using Pusher and Laravel echo and if I add this code to a new route (outside Filament) this works and I see a browser notification
window.Echo.private('App.Models.FilamentUser.1')
.listen('.database-notifications.sent', (event) => {
console.log(event);

if (! ('Notification' in window)) {
alert('Web Notification is not supported');
return;
}

Notification.requestPermission( permission => {
let notification = new Notification('New message from ' + event.user.email);
});
});
window.Echo.private('App.Models.FilamentUser.1')
.listen('.database-notifications.sent', (event) => {
console.log(event);

if (! ('Notification' in window)) {
alert('Web Notification is not supported');
return;
}

Notification.requestPermission( permission => {
let notification = new Notification('New message from ' + event.user.email);
});
});
But if I I register a new script with Filament::registerScripts in my AppServiceProvider and try run the same code, the console.log works, but I get an error in the Notification.requestPermission line saying that requestPermission is not a function I don't understand why 😦
Sjoerd24
Sjoerd249mo ago
Did anyone solve this problem and has some instructions for me how to proceed? 🤓 I would love to be able to send some (important) filament notifications via webpush to the users. Would be golden idea for a (paid) plugin i think, i lack the skills to make it sadly. 🥲
Kouakou Axel
Kouakou Axel7mo ago
It's because the Notification in filament is the filament object and not the native of th e browser. Someone find a solution ? i want to send webpush notification but i can't requestPermission's user.

Did you find this page helpful?