dstpabuaran.com/resources/js/components/notifications/notification-permission-prompt.tsx

32 lines
923 B
TypeScript

import { usePage } from '@inertiajs/react';
import { useEffect, useRef } from 'react';
import { usePushNotification } from '@/hooks/use-push-notification';
export function NotificationPermissionPrompt() {
const { vapidPublicKey } = usePage().props as { vapidPublicKey?: string };
const hasRequested = useRef(false);
const { isSupported, requestPermission, subscribe } =
usePushNotification();
useEffect(() => {
if (!isSupported || hasRequested.current) {
return;
}
if (Notification.permission !== 'default') {
return;
}
hasRequested.current = true;
void requestPermission().then(async (result) => {
if (result === 'granted' && vapidPublicKey) {
await subscribe(vapidPublicKey);
}
});
}, [isSupported, requestPermission, subscribe, vapidPublicKey]);
return null;
}