From 36fccd25ca651d8a968a0bf640e377ce0d1650a1 Mon Sep 17 00:00:00 2001
From: Palanikannan M <akashmalinimurugu@gmail.com>
Date: Mon, 24 Jun 2024 20:25:00 +0530
Subject: [PATCH] fix: updated the auto save hook to run every 10s instead of
 10s after the user stops typing!!

---
 web/core/hooks/use-auto-save.tsx | 25 +++++++++++++++++--------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/web/core/hooks/use-auto-save.tsx b/web/core/hooks/use-auto-save.tsx
index 41ccf9103a..96b8546a7c 100644
--- a/web/core/hooks/use-auto-save.tsx
+++ b/web/core/hooks/use-auto-save.tsx
@@ -5,27 +5,36 @@ const AUTO_SAVE_TIME = 10000;
 
 const useAutoSave = (handleSaveDescription: () => void) => {
   const intervalIdRef = useRef<NodeJS.Timeout | null>(null);
+  const handleSaveDescriptionRef = useRef(handleSaveDescription);
 
+  // Update the ref to always point to the latest handleSaveDescription
   useEffect(() => {
-    intervalIdRef.current = setInterval(handleSaveDescription, AUTO_SAVE_TIME);
+    handleSaveDescriptionRef.current = handleSaveDescription;
+  }, [handleSaveDescription]);
+
+  // Set up the interval to run every 10 seconds
+  useEffect(() => {
+    intervalIdRef.current = setInterval(() => {
+      handleSaveDescriptionRef.current();
+    }, AUTO_SAVE_TIME);
 
     return () => {
       if (intervalIdRef.current) {
         clearInterval(intervalIdRef.current);
       }
     };
-  }, [handleSaveDescription]);
+  }, []);
 
+  // Debounced save function for manual save (Ctrl+S or Cmd+S)
   useEffect(() => {
-    // debounce the function so that excesive calls to handleSaveDescription don't cause multiple calls to the server
     const debouncedSave = debounce(() => {
-      handleSaveDescription();
+      handleSaveDescriptionRef.current();
 
       if (intervalIdRef.current) {
-        // clear the interval after saving manually
         clearInterval(intervalIdRef.current);
-        // then reset the interval for auto-save to keep working
-        intervalIdRef.current = setInterval(handleSaveDescription, AUTO_SAVE_TIME);
+        intervalIdRef.current = setInterval(() => {
+          handleSaveDescriptionRef.current();
+        }, AUTO_SAVE_TIME);
       }
     }, 500);
 
@@ -45,7 +54,7 @@ const useAutoSave = (handleSaveDescription: () => void) => {
     return () => {
       window.removeEventListener("keydown", handleSave);
     };
-  }, [handleSaveDescription]);
+  }, []);
 };
 
 export default useAutoSave;