Merge pull request #90 from MediaComem/store_multiple_projects

Manage multiple projects based on url key in store

src/app/store.ts

@@ -6,22 +6,24 @@ import browserStorage from "../services/browserStorage";
 import recommandationsSlice from "../features/recommandations/recommandationsSlice";
 import { isNewImportSvg } from "../features/figma/components/FetchedSVG";
 
+const url = window.location.href;
+const key = url.match(/key=([^&]*)/)?.[1] ?? 'empty';
 export const store = configureStore({
   reducer: {
     project: projectReducer,
     zonesSlice,
     // zonesFigma: zonesFigmaSlice,
     recommandations: recommandationsSlice,
   },
-  preloadedState: isNewImportSvg() ? {} : browserStorage.loadState(), // load state from local storage
+  preloadedState: isNewImportSvg() ? {} : browserStorage.loadState(key), // load state from local storage
 });
 
 // Subscribe to the store changes to persist to local storage
 store.subscribe(
   // we use debounce to save the state once each 500ms
   // for better performances in case multiple changes occur in a short time
   debounce(() => {
-    browserStorage.saveState(store.getState());
+    browserStorage.saveState(store.getState(), key);
   }, 500)
 );
 

src/services/browserStorage.ts

@@ -1,18 +1,24 @@
 const KEY = 'redux';
 const browserStorage = {
-    loadState: () => {
+    loadState: (projectKey: string) => {
         try {
           const serializedState = localStorage.getItem(KEY);
           if (!serializedState) return undefined;
-          return JSON.parse(serializedState);
+          const projects = JSON.parse(serializedState);
+          return projects[projectKey];
         } catch (e) {
           return undefined;
         }
     },
-    saveState: (state: any) => {
+    saveState: (state: any, projectKey: string) => {
         try {
-          const serializedState = JSON.stringify(state);
-          localStorage.setItem(KEY, serializedState);
+          let bytesimProjects = {} as any;
+          const serializedState = localStorage.getItem(KEY);
+          if (serializedState) {
+            bytesimProjects = JSON.parse(serializedState);
+          };
+          bytesimProjects[projectKey] = state;
+          localStorage.setItem(KEY, JSON.stringify(bytesimProjects));
         } catch (e) {
           // Ignore
           console.error('Failed to save redux store');