diff --git a/apps/demo-app/src/index.tsx b/apps/demo-app/src/index.tsx index 9a5832da1..fd375374c 100644 --- a/apps/demo-app/src/index.tsx +++ b/apps/demo-app/src/index.tsx @@ -3,6 +3,7 @@ import { MonitoringProvider } from '@monkvision/monitoring'; import { AnalyticsProvider } from '@monkvision/analytics'; import { Auth0Provider } from '@auth0/auth0-react'; import { getEnvOrThrow } from '@monkvision/common'; +import { PreventExit } from '@monkvision/common-ui-web'; import { sentryMonitoringAdapter } from './sentry'; import { posthogAnalyticsAdapter } from './posthog'; import { AppRouter } from './components'; @@ -21,6 +22,7 @@ ReactDOM.render( prompt: 'login', }} > + diff --git a/packages/common-ui-web/src/components/PreventExit/PreventExit.tsx b/packages/common-ui-web/src/components/PreventExit/PreventExit.tsx new file mode 100644 index 000000000..01e2e9007 --- /dev/null +++ b/packages/common-ui-web/src/components/PreventExit/PreventExit.tsx @@ -0,0 +1,13 @@ +import { useEffect } from 'react'; + +export function PreventExit() { + useEffect(() => { + window.onbeforeunload = () => { + return 'Are you sure you want to leave?'; + }; + return () => { + window.onbeforeunload = null; + }; + }, []); + return null; +} diff --git a/packages/common-ui-web/src/components/PreventExit/index.tsx b/packages/common-ui-web/src/components/PreventExit/index.tsx new file mode 100644 index 000000000..e4e33c4ba --- /dev/null +++ b/packages/common-ui-web/src/components/PreventExit/index.tsx @@ -0,0 +1 @@ +export { PreventExit } from './PreventExit'; diff --git a/packages/common-ui-web/src/components/index.ts b/packages/common-ui-web/src/components/index.ts index c3b6a9e10..19b3e74fa 100644 --- a/packages/common-ui-web/src/components/index.ts +++ b/packages/common-ui-web/src/components/index.ts @@ -16,3 +16,4 @@ export * from './TakePictureButton'; export * from './TextField'; export * from './VehicleTypeAsset'; export * from './VehicleTypeSelection'; +export * from './PreventExit';