frontend/src/lib/notifications.ts
MuslemRahimi 5f30f48c5d bugfixing
2025-02-02 22:26:56 +01:00

117 lines
3.4 KiB
TypeScript

import { goto } from '$app/navigation';
export async function requestNotificationPermission() {
// Check if the browser supports notifications
if (!('Notification' in window)) {
console.warn('This browser does not support desktop notification');
return false;
}
// Check the current permission status
if (Notification.permission === 'granted') {
return true;
}
// Request permission
try {
const permission = await Notification.requestPermission();
return permission === 'granted';
} catch (error) {
console.error('Error requesting notification permission:', error);
return false;
}
}
export function sendNotification(
title: string,
options?: NotificationOptions & { iconSize?: number; url?: string }
) {
// Only send if permission is granted
if (Notification.permission === 'granted') {
// Extract custom properties and remaining NotificationOptions
const { iconSize, url, ...notificationOptions } = options || {};
const notification = new Notification(title, {
icon: "/pwa-192x192.png",
...notificationOptions // Spread only valid NotificationOptions
});
// Navigate when the notification is clicked
if (url) {
notification.onclick = () => {
window.focus(); // Ensure the window is focused
goto(url); // Client-side navigation
};
}
}
}
export async function unsubscribe() {
if ('serviceWorker' in navigator) {
const registration = await navigator.serviceWorker.ready;
const subscription = await registration.pushManager.getSubscription();
if (subscription) {
const res = await fetch('/api/deletePushSubscription', {
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
});
await subscription.unsubscribe();
}
}
}
async function sendSubscriptionToServer(subscription) {
try {
const response = await fetch('/api/addPushSubscription', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ subscription })
});
const output = await response?.json()
return output;
} catch (error) {
console.error('Error saving subscription on server:', error);
unsubscribe();
}
}
export async function subscribeUser() {
if ('serviceWorker' in navigator) {
try {
const registration = await navigator.serviceWorker.ready;
const subscription = await registration.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: import.meta.env.VITE_VAPID_PUBLIC_KEY
});
const output = sendSubscriptionToServer(subscription);
return output;
} catch (err) {
console.error('Error subscribing:', err);
return {'success': false}
}
}
}
export async function checkSubscriptionStatus() {
if ('serviceWorker' in navigator) {
const registration = await navigator.serviceWorker.ready;
const subscription = await registration.pushManager.getSubscription();
//console.log('check Subscription:', subscription);
const exists = subscription !== null;
//this can be optional
if (exists) {
// just to make sure the subscription is saved on the server
//sendSubscriptionToServer(subscription);
}
return exists;
}
return false;
}