mirror of
https://github.com/librenms/librenms.git
synced 2024-10-07 16:52:45 +00:00
Push Notifications (Mobile and PC) (#13277)
* Update manifest and add service worker cleanup icons a bit * Push notifications WIP * navigate working * cleanup * acknowledge wired up * Set VAPID keys on composer install * Component to control notification permissions. * Allow all user option to validate * Enable on browser load if transport exists. * Check for transport before showing user permissions translations * Documentation * style fixes * access via the attribute model * fix alerting test * update schema * cleanup subscription on disable * non-configurable db and table for webpush subscriptions (respect system connection) * revert AlertTransport change hopefully phpstan can figure it out * phpstan fixes * Support custom details display * Match transport names to brand's preferred display * less duplicate id errors * Tests are done in Laravel code now so remove legacy function usage... could be better, but ok * Style fixes * Style fixes 2 * Fix alert test * Doc updates requires HTTPS and GMP * unregister subscription when permission is set to denied * cleanup after user deletion * delete the right thing * fix whitespace * update install docs to include php-gmp * suggest ext-gmp * update javascript * Update functions.php Co-authored-by: Jellyfrog <Jellyfrog@users.noreply.github.com>
This commit is contained in:
@@ -0,0 +1,64 @@
|
||||
<div<div x-data="notificationSubscriptionStatus()">
|
||||
<div x-show="! supported">@lang('components.notification-subscription-status.no-support')</div>
|
||||
@if($userHasTransport)
|
||||
<div x-show="supported">
|
||||
<div>
|
||||
<span x-text="enabled ? '@lang('components.notification-subscription-status.enabled')' : '@lang('components.notification-subscription-status.disabled')'"></span>
|
||||
<button x-on:click="toggle()" type="button" class="tw-float-right tw-border tw-border-gray-500 tw-text-gray-500 hover:tw-bg-gray-500 hover:tw-text-gray-100 tw-rounded tw-px-4 tw-py-2" x-text="enabled ? '@lang('components.notification-subscription-status.disable')' : '@lang('components.notification-subscription-status.enable')'"></button>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<div x-show="supported">
|
||||
@admin
|
||||
<a href="{{ url('alert-transports') }}">
|
||||
@lang('components.notification-subscription-status.no-transport')
|
||||
</a>
|
||||
@else
|
||||
@lang('components.notification-subscription-status.no-transport')
|
||||
@endadmin
|
||||
</div>
|
||||
@endif
|
||||
<script>
|
||||
function notificationSubscriptionStatus() {
|
||||
return {
|
||||
supported: 'Notification' in window,
|
||||
enabled: 'Notification' in window && Notification.permission === 'granted' && localStorage.getItem('notifications') !== 'disabled',
|
||||
toggle() {
|
||||
if (this.enabled) {
|
||||
localStorage.setItem('notifications', 'disabled');
|
||||
this.enabled = false;
|
||||
navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
|
||||
serviceWorkerRegistration.pushManager.getSubscription()
|
||||
.then(function(subscription) {
|
||||
if (subscription) {
|
||||
subscription.unsubscribe().then(function(success) {
|
||||
if (success) {
|
||||
fetch('./push/unregister', {
|
||||
method: 'post',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRF-Token': '{{ csrf_token() }}'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
endpoint: subscription.endpoint
|
||||
}),
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
} else if (Notification.permission === 'granted') {
|
||||
localStorage.setItem('notifications', 'enabled');
|
||||
this.enabled = true;
|
||||
} else {
|
||||
Notification.requestPermission().then((permission) => {
|
||||
localStorage.setItem('notifications', 'enabled');
|
||||
this.enabled = permission === 'granted';
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</di</div>
|
Reference in New Issue
Block a user