mirror of
https://github.com/DayuanJiang/next-ai-draw-io.git
synced 2026-01-02 22:32:27 +08:00
feat: add confirmation dialog to prevent accidental back navigation (#99)
Addresses conflict between right-click drag and browser back gesture in Chromium-based browsers. Shows browser confirmation dialog when user tries to navigate away, preventing accidental page exits. Closes #80
This commit is contained in:
12
app/page.tsx
12
app/page.tsx
@@ -32,6 +32,18 @@ export default function Home() {
|
|||||||
return () => window.removeEventListener('keydown', handleKeyDown);
|
return () => window.removeEventListener('keydown', handleKeyDown);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
// Show confirmation dialog when user tries to leave the page
|
||||||
|
// This helps prevent accidental navigation from browser back gestures
|
||||||
|
useEffect(() => {
|
||||||
|
const handleBeforeUnload = (event: BeforeUnloadEvent) => {
|
||||||
|
event.preventDefault();
|
||||||
|
return '';
|
||||||
|
};
|
||||||
|
|
||||||
|
window.addEventListener('beforeunload', handleBeforeUnload);
|
||||||
|
return () => window.removeEventListener('beforeunload', handleBeforeUnload);
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex h-screen bg-background relative overflow-hidden">
|
<div className="flex h-screen bg-background relative overflow-hidden">
|
||||||
{/* Mobile warning overlay */}
|
{/* Mobile warning overlay */}
|
||||||
|
|||||||
Reference in New Issue
Block a user