Function useUnsavedChangesPrompt

site/src/hooks/useUnsavedChangesPrompt.ts:17–43

(
	enabled: boolean,
)

 * the returned state.
 */
export const useUnsavedChangesPrompt = (
	enabled: boolean,
): UnsavedChangesPromptState => {
	useEffect(() => {
		if (!enabled) return;
		const onBeforeUnload = (event: BeforeUnloadEvent) => {
			event.preventDefault();
			// Older browsers also require a return value to trigger the prompt.
			return "";
		};
		window.addEventListener("beforeunload", onBeforeUnload);
		return () => {
			window.removeEventListener("beforeunload", onBeforeUnload);
		};
	}, [enabled]);

	const blocker = useBlocker(
		({ currentLocation, nextLocation }) =>
			enabled && currentLocation.pathname !== nextLocation.pathname,
	);

	return {
		isOpen: blocker.state === "blocked",
		onCancel: () => blocker.reset?.(),
		onConfirm: () => blocker.proceed?.(),
	};
};