use indexdb for storage

Author: joshunrau

apps/playground/package.json

@@ -23,6 +23,7 @@
     "@opendatacapture/schemas": "workspace:*",
     "axios": "catalog:",
     "esbuild-wasm": "catalog:",
+    "idb-keyval": "^6.2.2",
     "immer": "^10.1.1",
     "jszip": "^3.10.1",
     "jwt-decode": "^4.0.0",

apps/playground/src/store/index.ts

@@ -1,8 +1,10 @@
 /* eslint-disable import/exports-last */
+import { del, get, set } from 'idb-keyval';
 import { jwtDecode } from 'jwt-decode';
 import { pick } from 'lodash-es';
 import { create } from 'zustand';
 import { createJSONStorage, devtools, persist, subscribeWithSelector } from 'zustand/middleware';
+import type { StateStorage } from 'zustand/middleware';
 import { immer } from 'zustand/middleware/immer';
 
 import { resolveIndexFilename } from '@/utils/file';
@@ -16,6 +18,18 @@ import { createViewerSlice } from './slices/viewer.slice';
 
 import type { AppStore } from './types';
 
+const storage: StateStorage = {
+  getItem: async (name: string): Promise<null | string> => {
+    return (await get(name)) ?? null;
+  },
+  removeItem: async (name: string): Promise<void> => {
+    await del(name);
+  },
+  setItem: async (name: string, value: string): Promise<void> => {
+    await set(name, value);
+  }
+};
+
 export const useAppStore = create(
   devtools(
     persist(
@@ -64,7 +78,7 @@ export const useAppStore = create(
             _accessToken: state.auth?.accessToken
           };
         },
-        storage: createJSONStorage(() => localStorage),
+        storage: createJSONStorage(() => storage),
         version: 1
       }
     )