Files
accounted/lib/hooks/use-unsaved-changes.ts
T
Jakob Wennberg 431f385b4b UX optimization
2026-02-23 19:05:16 +01:00

23 lines
611 B
TypeScript

'use client'
import { useEffect } from 'react'
/**
* Attaches a `beforeunload` event listener when the form has unsaved changes.
* This guards against browser close, tab close, and page refresh.
*
* Does NOT guard in-app Next.js navigation (App Router has no supported mechanism).
*/
export function useUnsavedChanges(isDirty: boolean) {
useEffect(() => {
if (!isDirty) return
const handler = (e: BeforeUnloadEvent) => {
e.preventDefault()
}
window.addEventListener('beforeunload', handler)
return () => window.removeEventListener('beforeunload', handler)
}, [isDirty])
}