fix: dispose cy instance and autosave timer on tab close (#338)

Author: avinxshKD

src/GraphArea.jsx

@@ -57,12 +57,17 @@ function Graph({
 
     useEffect(() => {
         const handleResize = () => setContainerDim(ref.current);
+        let graph = null;
         if (ref.current) {
             setContainerDim(ref.current);
             window.addEventListener('resize', handleResize);
-            setInstance(initialiseNewGraph());
+            graph = initialiseNewGraph();
+            setInstance(graph);
         }
-        return () => window.removeEventListener('resize', handleResize);
+        return () => {
+            window.removeEventListener('resize', handleResize);
+            if (graph) graph.dispose();
+        };
     }, [ref]);
 
     // Update theme when darkMode changes

src/component/TabBar.jsx

@@ -15,7 +15,9 @@ const TabBar = ({ superState, dispatcher }) => {
     const [tabToClose, setTabToClose] = useState(null);
 
     const closeTab = (i) => {
-        localStorageManager.remove(superState.graphs[i] ? superState.graphs[i].graphID : null);
+        const graph = superState.graphs[i];
+        if (graph && graph.instance) graph.instance.dispose();
+        localStorageManager.remove(graph ? graph.graphID : null);
         dispatcher({ type: T.REMOVE_GRAPH, payload: i });
         if (!superState.curGraphIndex && superState.graphs.length === 1) {
             dispatcher({ type: T.SET_CUR_INSTANCE, payload: null });

src/graph-builder/graph-core/1-core.js

@@ -372,6 +372,15 @@ class CoreGraph {
         }
     }
 
+    dispose() {
+        if (!this.cy) return;
+        if (this.autoSaveIntervalId !== null) clearTimeout(this.autoSaveIntervalId);
+        this.autoSaveIntervalId = null;
+        this.cy.destroy();
+        this.cy = null;
+        this.dispatcher = null;
+    }
+
     reset() {
         this.resetAllComp();
         this.resetAllAction();