diff --git a/src/GraphWorkspace.jsx b/src/GraphWorkspace.jsx index a6f0689..1565287 100644 --- a/src/GraphWorkspace.jsx +++ b/src/GraphWorkspace.jsx @@ -4,26 +4,23 @@ import ConfirmModal from './component/modals/ConfirmModal'; import SearchPanel from './component/SearchPanel'; import { actionType as T } from './reducer'; import './graphWorkspace.css'; -// import localStorageManager from './graph-builder/local-storage-manager'; +import localStorageManager from './graph-builder/local-storage-manager'; import TabBar from './component/TabBar'; import Graph from './GraphArea'; const GraphComp = (props) => { const graphContainerRef = React.useRef(); const { dispatcher, superState } = props; - // const [loadedFromStorage, setLoadedFromStorage] = React.useState(false); - // The functionality for loading graphs from previous sessions is currently on hold. - // useEffect(() => { - // const allSavedGs = localStorageManager.getAllGraphs().map((graphID) => ({ - // graphID, - // })); - // dispatcher({ - // type: T.ADD_GRAPH_BULK, - // payload: allSavedGs, - // }); - // // setLoadedFromStorage(true); - // }, []); + React.useEffect(() => { + const allIDs = localStorageManager.getAllGraphs(); + const validIDs = allIDs.filter((id) => typeof id === 'string' && id && localStorageManager.get(id) !== null); + if (validIDs.length !== allIDs.length) { + allIDs.filter((id) => !validIDs.includes(id)).forEach((id) => localStorageManager.remove(id)); + } + if (validIDs.length === 0) return; + dispatcher({ type: T.ADD_GRAPH_BULK, payload: validIDs.map((graphID) => ({ graphID })) }); + }, []); // Remote server implementation - Not being used. // useEffect(() => { diff --git a/src/component/modals/ProjectDetails.jsx b/src/component/modals/ProjectDetails.jsx index 9db231a..e700147 100644 --- a/src/component/modals/ProjectDetails.jsx +++ b/src/component/modals/ProjectDetails.jsx @@ -39,7 +39,6 @@ const ProjectDetails = ({ superState, dispatcher }) => { superState.curGraphInstance.setProjectAuthor(authorName); dispatcher({ type: T.SET_EDIT_DETAILS_MODAL, payload: false }); } - localStorageManager.saveAllgs(); localStorageManager.setAuthorName(authorName); }; diff --git a/src/graph-builder/local-storage-manager.js b/src/graph-builder/local-storage-manager.js index 46e7292..666865f 100644 --- a/src/graph-builder/local-storage-manager.js +++ b/src/graph-builder/local-storage-manager.js @@ -50,36 +50,10 @@ const localStorageRemove = (key) => { } }; -const getSet = (ALL_GRAPHS) => { - if (!localStorageGet(ALL_GRAPHS)) { - localStorageSet(ALL_GRAPHS, encodeBase64(JSON.stringify([]))); - } - const raw = localStorageGet(ALL_GRAPHS); - if (!raw) return new Set(); - const parsed = parseStoredJson(raw); - if (!Array.isArray(parsed)) { - localStorageSet(ALL_GRAPHS, encodeBase64(JSON.stringify([]))); - return new Set(); - } - return new Set(parsed); -}; - const localStorageManager = { ALL_GRAPHS: window.btoa('ALL_GRAPHS'), AUTHOR_NAME: window.btoa('AUTHOR_NAME'), - allgs: getSet(window.btoa('ALL_GRAPHS')), - - saveAllgs() { - localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify(Array.from(this.allgs)))); - }, - - addEmptyIfNot() { - if (!localStorageGet(this.ALL_GRAPHS)) { - localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify([]))); - } - }, - get(id) { const raw = localStorageGet(id); if (raw === null) return null; @@ -100,13 +74,15 @@ const localStorageManager = { } }, remove(id) { - if (this.allgs.delete(id)) this.saveAllgs(); + const list = this.getAllGraphs().filter((g) => g !== id); + localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify(list))); localStorageRemove(id); }, addGraph(id) { - if (this.allgs.has(id)) return; - this.allgs.add(id); - this.saveAllgs(); + const list = this.getAllGraphs(); + if (list.includes(id)) return; + list.push(id); + localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify(list))); }, getAllGraphs() { const raw = localStorageGet(this.ALL_GRAPHS); @@ -119,17 +95,10 @@ const localStorageManager = { return parsed; }, addToFront(id) { - if (this.allgs.has(id)) return; - this.allgs.add(id); - const raw = localStorageGet(this.ALL_GRAPHS); - if (!raw) return; - const Garr = parseStoredJson(raw); - if (!Array.isArray(Garr)) { - this.saveAllgs(); - return; - } - Garr.unshift(id); - localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify(Garr))); + const list = this.getAllGraphs(); + if (list.includes(id)) return; + list.unshift(id); + localStorageSet(this.ALL_GRAPHS, encodeBase64(JSON.stringify(list))); }, getAuthorName() { return localStorageGet(this.AUTHOR_NAME) || ''; diff --git a/src/reducer/reducer.js b/src/reducer/reducer.js index b1e629a..ca244e3 100644 --- a/src/reducer/reducer.js +++ b/src/reducer/reducer.js @@ -109,7 +109,8 @@ const reducer = (state, action) => { }; } case T.ADD_GRAPH_BULK: { - return { ...state, graphs: [...state.graphs, ...action.payload] }; + const newGraphs = action.payload.map((g) => ({ ...initialGraphState, ...g })); + return { ...state, graphs: [...state.graphs, ...newGraphs], curGraphIndex: 0 }; } case T.SET_CUR_INSTANCE: { return { ...state, curGraphInstance: action.payload };