From c7d75bf318a204c898253d6a221fcba6177b8c18 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Wed, 21 Aug 2024 07:48:14 -0600
Subject: [PATCH] Add support for changes dialog when leaving without saving
 config editor

---
 web/src/pages/ConfigEditor.tsx | 37 ++++++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)

diff --git a/web/src/pages/ConfigEditor.tsx b/web/src/pages/ConfigEditor.tsx
index 55df04e34..dc351e7f7 100644
--- a/web/src/pages/ConfigEditor.tsx
+++ b/web/src/pages/ConfigEditor.tsx
@@ -124,12 +124,49 @@ function ConfigEditor() {
     };
   });
 
+  // monitoring state
+
+  const [hasChanges, setHasChanges] = useState(false);
+
+  useEffect(() => {
+    if (!config || !modelRef.current) {
+      return;
+    }
+
+    modelRef.current.onDidChangeContent(() => {
+      if (modelRef.current?.getValue() != config) {
+        setHasChanges(true);
+      } else {
+        setHasChanges(false);
+      }
+    });
+  }, [config]);
+
   useEffect(() => {
     if (config && modelRef.current) {
       modelRef.current.setValue(config);
+      setHasChanges(false);
     }
   }, [config]);
 
+  useEffect(() => {
+    let listener: ((e: BeforeUnloadEvent) => void) | undefined;
+    if (hasChanges) {
+      listener = (e) => {
+        e.preventDefault();
+        e.returnValue = true;
+        return "Exit without saving?";
+      };
+      window.addEventListener("beforeunload", listener);
+    }
+
+    return () => {
+      if (listener) {
+        window.removeEventListener("beforeunload", listener);
+      }
+    };
+  }, [hasChanges]);
+
   if (!config) {
     return <ActivityIndicator />;
   }