fix: sync sessions state

j4k0xb · May 20, 2024 · 5f8835e · 5f8835e
1 parent 9c190fe
commit 5f8835e
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 12 deletions.
diff --git a/apps/playground/src/App.tsx b/apps/playground/src/App.tsx
@@ -16,7 +16,7 @@ import ProgressBar from './components/ProgressBar';
 import Sidebar from './components/Sidebar';
 import Tab from './components/Tab';
 import { DeobfuscateContextProvider } from './context/DeobfuscateContext';
-import { saveModels, type SavedModel } from './indexeddb';
+import { useSessions, type SavedModel } from './indexeddb';
 import { debounce } from './utils/debounce';
 import type { DeobfuscateResult } from './webcrack.worker';
 
@@ -29,6 +29,7 @@ export const [settings, setSettings] = createStore({
 });
 
 function App() {
+  const { saveModels } = useSessions();
   const [untitledCounter, setUntitledCounter] = createSignal(1);
   const [models, setModels] = createSignal<monaco.editor.ITextModel[]>([
     monaco.editor.createModel(

diff --git a/apps/playground/src/components/Menu.tsx b/apps/playground/src/components/Menu.tsx
@@ -1,15 +1,15 @@
-import { For, createResource } from 'solid-js';
+import { For } from 'solid-js';
 import { useTheme } from '../hooks/useTheme';
-import { loadSessions, type SavedModel } from '../indexeddb';
+import { useSessions, type SavedModel } from '../indexeddb';
 
 interface Props {
   onFileOpen?: (content: string) => void;
   onRestore?: (models: SavedModel[]) => void;
 }
 
 export default function Menu(props: Props) {
+  const { sessions } = useSessions();
   const [theme, setTheme] = useTheme();
-  const [sessions] = createResource(loadSessions);
 
   function openFile() {
     const input = document.createElement('input');

diff --git a/apps/playground/src/indexeddb.ts b/apps/playground/src/indexeddb.ts
@@ -1,5 +1,6 @@
 import { openDB, type DBSchema } from 'idb';
 import type * as monaco from 'monaco-editor';
+import { createSignal } from 'solid-js';
 
 const SESSION_ID = Math.random().toString(36).slice(2);
 const MAX_SESSIONS = 10;
@@ -31,8 +32,14 @@ async function initDB() {
   });
 }
 
-export async function saveModels(models: monaco.editor.ITextModel[]) {
-  console.log('Saving models...', models.length);
+const [sessions, setSessions] = createSignal<Session[]>([]);
+loadSessions().then(setSessions).catch(console.error);
+
+export function useSessions() {
+  return { sessions, saveModels };
+}
+
+async function saveModels(models: monaco.editor.ITextModel[]) {
   const db = await initDB();
   await db.put('sessions', {
     id: SESSION_ID,
@@ -48,14 +55,10 @@ export async function saveModels(models: monaco.editor.ITextModel[]) {
   if (sessions.length > MAX_SESSIONS) {
     await db.delete('sessions', sessions[0].id);
   }
+  setSessions(sessions.slice(0, 10));
 }
 
-export async function clearSavedModels() {
-  const db = await initDB();
-  await db.clear('sessions');
-}
-
-export async function loadSessions(): Promise<Session[]> {
+async function loadSessions(): Promise<Session[]> {
   const db = await initDB();
   const sessions = await db.getAll('sessions');
   sessions.sort((a, b) => b.timestamp - a.timestamp);