From 3ec456fff58b76fa588b973f23a21e7ec89849b8 Mon Sep 17 00:00:00 2001
From: zhichaona <1255628593@qq.com>
Date: Wed, 26 Mar 2025 10:25:36 +0800
Subject: [PATCH] time-base saving & toastTips (#7662)

* time-base saving & toastTips

* refactor hasChanged

---------

Co-authored-by: First <first@FirstdeMacBook-Pro.local>
---
 frontend/src/pages/excalidraw-editor/index.js    | 10 ++++++++++
 .../src/pages/excalidraw-editor/simple-editor.js | 16 ++++++++++++++--
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/excalidraw-editor/index.js b/frontend/src/pages/excalidraw-editor/index.js
index 10c0f457e2..02b34740a8 100644
--- a/frontend/src/pages/excalidraw-editor/index.js
+++ b/frontend/src/pages/excalidraw-editor/index.js
@@ -59,8 +59,18 @@ const ExcaliEditor = () => {
       }
     }, SAVE_INTERVAL_TIME);
 
+    const handleBeforeUnload = (event) => {
+      if (isChangedRef.current) {
+        event.preventDefault();
+        event.returnValue = '';
+      }
+    };
+
+    window.addEventListener('beforeunload', handleBeforeUnload);
+
     return () => {
       clearInterval(saveInterval);
+      window.removeEventListener('beforeunload', handleBeforeUnload);
     };
   }, [saveSceneContent]);
 
diff --git a/frontend/src/pages/excalidraw-editor/simple-editor.js b/frontend/src/pages/excalidraw-editor/simple-editor.js
index ce6a0e5c03..827f287478 100644
--- a/frontend/src/pages/excalidraw-editor/simple-editor.js
+++ b/frontend/src/pages/excalidraw-editor/simple-editor.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { Excalidraw, MainMenu } from '@excalidraw/excalidraw';
 import isHotkey from 'is-hotkey';
 import CodeMirrorLoading from '../../components/code-mirror-loading';
@@ -13,6 +13,7 @@ const SimpleEditor = ({
   isFetching
 }) => {
   const [excalidrawAPI, setExcalidrawAPI] = useState(null);
+  const prevElementsRef = useRef([]);
   const UIOptions = {
     canvasActions: {
       saveToActiveFile: false,
@@ -23,7 +24,10 @@ const SimpleEditor = ({
 
   const handleChange = () => {
     const elements = excalidrawAPI.getSceneElements();
-    onChangeContent(elements);
+    if (hasChanged(elements, prevElementsRef.current)) {
+      onChangeContent(elements);
+    }
+    prevElementsRef.current = elements;
   };
 
   useEffect(() => {
@@ -40,6 +44,14 @@ const SimpleEditor = ({
     };
   }, [excalidrawAPI, onSaveContent]);
 
+  const hasChanged = (prev, current) => {
+    if (prev.length !== current.length) return true;
+
+    return current.some((element, index) => {
+      return element.version !== prev[index]?.version;
+    });
+  };
+
   if (isFetching) {
     return (
       <div className='excali-container'>