Merge pull request #52 from Carouan/codex/implement-user-storage-migration-for-settings

Migrate settings and local user profile persistence to IndexedDB

Author: Carouan

src/repositories/storageRepository.js

@@ -15,18 +15,18 @@ export async function savePersistedProjects(projects) {
   await saveProjects(projects);
 }
 
-export function loadPersistedSettings() {
+export async function loadPersistedSettings() {
   return loadSettings();
 }
 
-export function savePersistedSettings(settings) {
-  saveSettings(settings);
+export async function savePersistedSettings(settings) {
+  await saveSettings(settings);
 }
 
-export function loadPersistedUserProfile() {
+export async function loadPersistedUserProfile() {
   return loadUserProfile();
 }
 
-export function savePersistedUserProfile(profile) {
-  saveUserProfile(profile);
+export async function savePersistedUserProfile(profile) {
+  await saveUserProfile(profile);
 }

src/services/storage.js

@@ -3,9 +3,12 @@ const SETTINGS_STORAGE_KEY = "ide-projet-personnel.settings";
 const USER_PROFILE_STORAGE_KEY = "ide-projet-personnel.user-profile";
 
 const PROJECTS_DB_NAME = "ide-projet-personnel";
-const PROJECTS_DB_VERSION = 1;
+const PROJECTS_DB_VERSION = 2;
 const PROJECTS_STORE_NAME = "project_storage";
 const PROJECTS_RECORD_KEY = "projects";
+const APP_STORE_NAME = "app_storage";
+const SETTINGS_RECORD_KEY = "settings";
+const USER_PROFILE_RECORD_KEY = "user-profile";
 
 let projectsDbPromise = null;
 
@@ -35,6 +38,9 @@ function openProjectsDb() {
       if (!db.objectStoreNames.contains(PROJECTS_STORE_NAME)) {
         db.createObjectStore(PROJECTS_STORE_NAME);
       }
+      if (!db.objectStoreNames.contains(APP_STORE_NAME)) {
+        db.createObjectStore(APP_STORE_NAME);
+      }
     };
 
     request.onsuccess = () => resolve(request.result);
@@ -89,6 +95,51 @@ async function writeProjectsToIndexedDb(projects) {
   });
 }
 
+function runAppStore(mode, action) {
+  return openProjectsDb().then(
+    (db) =>
+      new Promise((resolve, reject) => {
+        const tx = db.transaction(APP_STORE_NAME, mode);
+        const store = tx.objectStore(APP_STORE_NAME);
+
+        let settled = false;
+        const resolveOnce = (value) => {
+          if (settled) return;
+          settled = true;
+          resolve(value);
+        };
+
+        const rejectOnce = (error) => {
+          if (settled) return;
+          settled = true;
+          reject(error);
+        };
+
+        tx.oncomplete = () => resolveOnce();
+        tx.onerror = () => rejectOnce(tx.error || new Error("IndexedDB transaction failed"));
+        tx.onabort = () => rejectOnce(tx.error || new Error("IndexedDB transaction aborted"));
+
+        action(store, resolveOnce, rejectOnce);
+      })
+  );
+}
+
+async function readAppValueFromIndexedDb(recordKey) {
+  return runAppStore("readonly", (store, resolve, reject) => {
+    const request = store.get(recordKey);
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error || new Error("Failed to read app record"));
+  });
+}
+
+async function writeAppValueToIndexedDb(recordKey, value) {
+  await runAppStore("readwrite", (store, resolve, reject) => {
+    const request = store.put(value, recordKey);
+    request.onsuccess = () => resolve();
+    request.onerror = () => reject(request.error || new Error("Failed to write app record"));
+  });
+}
+
 export async function loadProjects() {
   try {
     const indexedDbProjects = await readProjectsFromIndexedDb();
@@ -118,8 +169,7 @@ export async function saveProjects(projects) {
   }
 }
 
-export function loadSettings() {
-  const raw = localStorage.getItem(SETTINGS_STORAGE_KEY);
+function parseJsonObject(raw) {
   if (!raw) return null;
 
   try {
@@ -129,21 +179,60 @@ export function loadSettings() {
   }
 }
 
-export function saveSettings(settings) {
-  localStorage.setItem(SETTINGS_STORAGE_KEY, JSON.stringify(settings));
+export async function loadSettings() {
+  try {
+    const indexedDbSettings = await readAppValueFromIndexedDb(SETTINGS_RECORD_KEY);
+
+    if (indexedDbSettings && typeof indexedDbSettings === "object") {
+      return indexedDbSettings;
+    }
+
+    const rawLegacySettings = localStorage.getItem(SETTINGS_STORAGE_KEY);
+    const legacySettings = parseJsonObject(rawLegacySettings);
+
+    if (rawLegacySettings !== null && legacySettings) {
+      await writeAppValueToIndexedDb(SETTINGS_RECORD_KEY, legacySettings);
+    }
+
+    return legacySettings;
+  } catch {
+    return parseJsonObject(localStorage.getItem(SETTINGS_STORAGE_KEY));
+  }
 }
 
-export function loadUserProfile() {
-  const raw = localStorage.getItem(USER_PROFILE_STORAGE_KEY);
-  if (!raw) return null;
+export async function saveSettings(settings) {
+  try {
+    await writeAppValueToIndexedDb(SETTINGS_RECORD_KEY, settings);
+  } catch {
+    localStorage.setItem(SETTINGS_STORAGE_KEY, JSON.stringify(settings));
+  }
+}
 
+export async function loadUserProfile() {
   try {
-    return JSON.parse(raw);
+    const indexedDbUserProfile = await readAppValueFromIndexedDb(USER_PROFILE_RECORD_KEY);
+
+    if (indexedDbUserProfile && typeof indexedDbUserProfile === "object") {
+      return indexedDbUserProfile;
+    }
+
+    const rawLegacyUserProfile = localStorage.getItem(USER_PROFILE_STORAGE_KEY);
+    const legacyUserProfile = parseJsonObject(rawLegacyUserProfile);
+
+    if (rawLegacyUserProfile !== null && legacyUserProfile) {
+      await writeAppValueToIndexedDb(USER_PROFILE_RECORD_KEY, legacyUserProfile);
+    }
+
+    return legacyUserProfile;
   } catch {
-    return null;
+    return parseJsonObject(localStorage.getItem(USER_PROFILE_STORAGE_KEY));
   }
 }
 
-export function saveUserProfile(profile) {
-  localStorage.setItem(USER_PROFILE_STORAGE_KEY, JSON.stringify(profile));
+export async function saveUserProfile(profile) {
+  try {
+    await writeAppValueToIndexedDb(USER_PROFILE_RECORD_KEY, profile);
+  } catch {
+    localStorage.setItem(USER_PROFILE_STORAGE_KEY, JSON.stringify(profile));
+  }
 }

src/store/useAppStore.js

@@ -110,8 +110,8 @@ export function useAppStore() {
 async function hydrateStore() {
   try {
     const storedProjects = await loadPersistedProjects();
-    const storedSettings = loadPersistedSettings();
-    const storedUserProfile = loadPersistedUserProfile();
+    const storedSettings = await loadPersistedSettings();
+    const storedUserProfile = await loadPersistedUserProfile();
 
     const initialUserProfile = normalizeUserProfile(storedUserProfile);
 
@@ -140,12 +140,12 @@ if (loaded.length > 0) {
     console.error("Failed to hydrate store", error);
 
     const fallbackUserProfile = normalizeUserProfile(
-      loadPersistedUserProfile()
+      await loadPersistedUserProfile()
     );
 
     const fallbackSettings = {
       ...DEFAULT_SETTINGS,
-      ...(loadPersistedSettings() || {}),
+      ...((await loadPersistedSettings()) || {}),
     };
 
     if (isCancelled) return;
@@ -174,12 +174,16 @@ if (loaded.length > 0) {
 
   useEffect(() => {
     if (!isHydrated) return;
-    savePersistedSettings(settings);
+    savePersistedSettings(settings).catch((error) => {
+      console.error("Failed to persist settings", error);
+    });
   }, [settings, isHydrated]);
 
   useEffect(() => {
     if (!isHydrated || !userProfile) return;
-    savePersistedUserProfile(userProfile);
+    savePersistedUserProfile(userProfile).catch((error) => {
+      console.error("Failed to persist user profile", error);
+    });
   }, [userProfile, isHydrated]);
 
   function createProject() {