From 242780e42a8c43ab24a94992a37ef90155c13707 Mon Sep 17 00:00:00 2001
From: arunachalam <aelango@acvauctions.com>
Date: Fri, 14 Jun 2024 10:20:17 +0530
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Prevent=20exit=20from=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/demo-app/src/index.tsx                         |  2 ++
 .../src/components/PreventExit/PreventExit.tsx      | 13 +++++++++++++
 .../src/components/PreventExit/index.tsx            |  1 +
 packages/common-ui-web/src/components/index.ts      |  1 +
 4 files changed, 17 insertions(+)
 create mode 100644 packages/common-ui-web/src/components/PreventExit/PreventExit.tsx
 create mode 100644 packages/common-ui-web/src/components/PreventExit/index.tsx

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',
         }}
       >
+        <PreventExit />
         <AppRouter />
       </Auth0Provider>
     </AnalyticsProvider>
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';