Safer fold and crush section

src/stores/settings.ts

@@ -1,15 +1,34 @@
-import { persistentMap } from '@nanostores/persistent'
+import { map } from 'nanostores'
 import { getDefaultEngineValues, getDefaultEffectValues } from '../config/effects'
 
-export const engineSettings = persistentMap('engine:', getDefaultEngineValues(), {
-  encode: JSON.stringify,
-  decode: JSON.parse
-})
+const STORAGE_KEY_ENGINE = 'engine:'
+const STORAGE_KEY_EFFECTS = 'effects:'
 
-export const effectSettings = persistentMap('effects:', {
+function loadFromStorage<T>(key: string, defaults: T): T {
+  try {
+    const stored = localStorage.getItem(key)
+    return stored ? { ...defaults, ...JSON.parse(stored) } : defaults
+  } catch {
+    return defaults
+  }
+}
+
+export const engineSettings = map(loadFromStorage(STORAGE_KEY_ENGINE, getDefaultEngineValues()))
+
+export const effectSettings = map(loadFromStorage(STORAGE_KEY_EFFECTS, {
   ...getDefaultEffectValues(),
   masterVolume: 75
-}, {
-  encode: JSON.stringify,
-  decode: JSON.parse
-})
+}))
+
+function saveToStorage() {
+  try {
+    localStorage.setItem(STORAGE_KEY_ENGINE, JSON.stringify(engineSettings.get()))
+    localStorage.setItem(STORAGE_KEY_EFFECTS, JSON.stringify(effectSettings.get()))
+  } catch (e) {
+    console.error('Failed to save settings:', e)
+  }
+}
+
+if (typeof window !== 'undefined') {
+  window.addEventListener('beforeunload', saveToStorage)
+}