2 files changed, 23 insertions, 0 deletions
diff --git a/FrontEnd/src/components/hooks/index.ts b/FrontEnd/src/components/hooks/index.ts
index 3c9859bc..771b0e2a 100644
--- a/FrontEnd/src/components/hooks/index.ts
+++ b/FrontEnd/src/components/hooks/index.ts
@@ -1,3 +1,4 @@
 export { useMobile } from "./responsive";
 export { default as useClickOutside } from "./useClickOutside";
 export { default as useScrollToBottom } from "./useScrollToBottom";
+export { default as useWindowLeave } from "./useWindowLeave";
diff --git a/FrontEnd/src/components/hooks/useWindowLeave.ts b/FrontEnd/src/components/hooks/useWindowLeave.ts
new file mode 100644
index 00000000..08777e30
--- /dev/null
+++ b/FrontEnd/src/components/hooks/useWindowLeave.ts
@@ -0,0 +1,22 @@
+import { useEffect } from "react";
+
+import { useC, Text } from "../common";
+
+export default function useWindowLeave(
+  allow: boolean,
+  message: Text = "timeline.confirmLeave",
+) {
+  const c = useC();
+
+  useEffect(() => {
+    if (!allow) {
+      window.onbeforeunload = () => {
+        return c(message);
+      };
+
+      return () => {
+        window.onbeforeunload = null;
+      };
+    }
+  }, [allow, message]);
+}