[gephi-lite] adding version in keys for local & session storage

packages/gephi-lite/package.json

@@ -93,6 +93,7 @@
     "react-tether": "^3.0.3",
     "react-use-konami": "^1.1.0",
     "seedrandom": "^3.0.5",
+    "semver": "^6.3.1",
     "sigma": "^3.0.0",
     "tlds": "^1.260.0"
   },
@@ -114,6 +115,7 @@
     "@types/react-linkify": "^1.0.4",
     "@types/react-slider": "^1.3.6",
     "@types/seedrandom": "^3.0.8",
+    "@types/semver": "^7.7.1",
     "@types/tether": "^1.4.9",
     "@vitejs/plugin-react-swc": "^3.7.2",
     "http-proxy-middleware": "^3.0.3",

packages/gephi-lite/src/config.ts

@@ -1,7 +1,9 @@
+import { parse } from "semver";
+
 import { version } from "../package.json";
 
 export const config = {
-  version,
+  version: parse(version)!,
   website_url: "https://github.com/gephi/gephi-lite#readme",
   notificationTimeoutMs: 3000,
   github_proxy: import.meta.env.VITE_GITHUB_PROXY || "/_github",

packages/gephi-lite/src/core/Initialize.tsx

@@ -5,6 +5,7 @@ import useKonami from "react-use-konami";
 
 import { WelcomeModal } from "../components/modals/WelcomeModal";
 import { I18n } from "../locales/provider";
+import { sessionStorage } from "../utils/storage";
 import { extractFilename } from "../utils/url";
 import { appearanceAtom } from "./appearance";
 import { useBroadcast } from "./broadcast/useBroadcast";

packages/gephi-lite/src/core/appearance/index.ts

@@ -1,6 +1,7 @@
 import { getEmptyAppearanceState, serializeAppearanceState } from "@gephi/gephi-lite-sdk";
 import { Producer, atom, producerToAction } from "@ouestware/atoms";
 
+import { sessionStorage } from "../../utils/storage";
 import { ItemType } from "../types";
 import {
   AppearanceState,

packages/gephi-lite/src/core/broadcast/client.ts

@@ -39,7 +39,7 @@ const BROADCAST_METHODS: {
     return;
   },
   getVersion: async () => {
-    return config.version;
+    return config.version.toString();
   },
   importGraph: async (data) => {
     if (fileAtom.get().status.type === "loading") throw new Error("A file is already being loaded");

packages/gephi-lite/src/core/file/index.ts

@@ -5,6 +5,7 @@ import { write } from "graphology-gexf";
 import { isEmpty, isEqual } from "lodash";
 
 import { config } from "../../config";
+import { localStorage } from "../../utils/storage";
 import { appearanceActions, appearanceAtom } from "../appearance";
 import { applyVisualProperties, inferAppearanceState } from "../appearance/utils";
 import { resetStates } from "../context/dataContexts";
@@ -132,7 +133,7 @@ export const exportAsGephiLite = asyncAction(async (callback: (data: string) =>
   try {
     const data: GephiLiteFileFormat = {
       type: "gephi-lite",
-      version: config.version,
+      version: config.version.toString(),
       graphDataset: graphDatasetAtom.get(),
       filters: filtersAtom.get(),
       appearance: appearanceAtom.get(),

packages/gephi-lite/src/core/filters/index.ts

@@ -1,6 +1,7 @@
 import { Producer, atom, producerToAction } from "@ouestware/atoms";
 import { dropRight, inRange } from "lodash";
 
+import { sessionStorage } from "../../utils/storage";
 import { FilterType, FiltersState } from "./types";
 import { getEmptyFiltersState, serializeFiltersState } from "./utils";
 

packages/gephi-lite/src/core/graph/index.ts

@@ -23,6 +23,7 @@ import { clamp, forEach, isNil, isString, keyBy, keys, last, map, mapValues, omi
 import { Coordinates } from "sigma/types";
 
 import { getPalette } from "../../components/GraphAppearance/color/utils";
+import { sessionStorage } from "../../utils/storage";
 import { appearanceAtom } from "../appearance";
 import { applyVisualProperties, getAllVisualGetters } from "../appearance/utils";
 import { useGraphDataset } from "../context/dataContexts";

packages/gephi-lite/src/core/layouts/index.ts

@@ -3,6 +3,7 @@ import { connectedCloseness } from "graphology-metrics/layout-quality";
 import { debounce, identity, pick } from "lodash";
 import seedRandom from "seedrandom";
 
+import { localStorage } from "../../utils/storage";
 import { EVENTS, emitter } from "../context/eventsContext";
 import { graphDatasetActions, graphDatasetAtom, sigmaGraphAtom } from "../graph";
 import { dataGraphToFullGraph } from "../graph/utils";

packages/gephi-lite/src/core/preferences/index.ts

@@ -1,5 +1,6 @@
 import { Producer, atom, producerToAction } from "@ouestware/atoms";
 
+import { localStorage } from "../../utils/storage";
 import { Preferences } from "./types";
 import { getAppliedTheme, getCurrentPreferences, serializePreferences } from "./utils";
 

packages/gephi-lite/src/core/preferences/utils.ts

@@ -1,6 +1,7 @@
 import { gephiLiteParse, gephiLiteStringify } from "@gephi/gephi-lite-sdk";
 
 import { i18n } from "../../locales/provider";
+import { localStorage } from "../../utils/storage";
 import { Preferences } from "./types";
 
 export function getEmptyPreferences(): Preferences {

packages/gephi-lite/src/core/session/index.ts

@@ -1,5 +1,6 @@
 import { Producer, atom, producerToAction } from "@ouestware/atoms";
 
+import { sessionStorage } from "../../utils/storage";
 import { Session } from "./types";
 import { getEmptySession, serializeSession } from "./utils";
 

packages/gephi-lite/src/core/user/AuthInit.tsx

@@ -2,6 +2,7 @@ import { isNil } from "lodash";
 import { FC, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 
+import { localStorage } from "../../utils/storage";
 import { ghProviderDeserialize } from "../cloud/github/provider";
 import { useNotifications } from "../notifications";
 import { LS_USER_KEY, useConnectedUser } from "./index";

packages/gephi-lite/src/core/user/index.tsx

@@ -1,6 +1,7 @@
 import { Producer, atom, producerToAction, useAtom } from "@ouestware/atoms";
 import { isNil } from "lodash";
 
+import { localStorage } from "../../utils/storage";
 import { User } from "./types";
 
 export const LS_USER_KEY = "user";

packages/gephi-lite/src/utils/storage.ts

@@ -0,0 +1,16 @@
+import { config } from "../config";
+
+function getPrefixedKey(key: string) {
+  return `${config.version.major}.${config.version.minor}_${key}`;
+}
+export const localStorage = {
+  getItem: (key: string): string | null => window.localStorage.getItem(getPrefixedKey(key)),
+  setItem: (key: string, data: string): void => window.localStorage.setItem(getPrefixedKey(key), data),
+  removeItem: (key: string): void => window.localStorage.removeItem(getPrefixedKey(key)),
+};
+
+export const sessionStorage = {
+  getItem: (key: string): string | null => window.sessionStorage.getItem(getPrefixedKey(key)),
+  setItem: (key: string, data: string): void => window.sessionStorage.setItem(getPrefixedKey(key), data),
+  removeItem: (key: string): void => window.sessionStorage.removeItem(getPrefixedKey(key)),
+};