import { router } from '@inertiajs/react'; import { useEffect, useRef } from 'react'; export function usePagePreparationGuard(dirty: boolean, message: string) { const guard = useRef({ dirty, message }); guard.current = { dirty, message }; useEffect(() => { const remove = router.on('before', (event) => { if ( guard.current.dirty && event.detail.visit.method === 'get' && !event.detail.visit.preserveState && !window.confirm(guard.current.message) ) event.preventDefault(); }); const unload = (event: BeforeUnloadEvent) => { if (guard.current.dirty) { event.preventDefault(); event.returnValue = ''; } }; window.addEventListener('beforeunload', unload); return () => { remove(); window.removeEventListener('beforeunload', unload); }; }, []); }