Cache settings

src/context/SettingsContext.jsx

@@ -1,7 +1,7 @@
-import { createContext, useState } from "react";
+import { createContext, useEffect, useState } from "react";
 import { tableWidth } from "../data/constants";
 
-export const SettingsContext = createContext({
+const defaultSettings = {
   strictMode: false,
   showFieldSummary: true,
   showGrid: true,
@@ -11,20 +11,23 @@ export const SettingsContext = createContext({
   showCardinality: true,
   tableWidth: tableWidth,
   showDebugCoordinates: false,
-});
+};
+
+export const SettingsContext = createContext(defaultSettings);
 
 export default function SettingsContextProvider({ children }) {
-  const [settings, setSettings] = useState({
-    strictMode: false,
-    showFieldSummary: true,
-    showGrid: true,
-    mode: "light",
-    autosave: true,
-    panning: true,
-    showCardinality: true,
-    tableWidth: tableWidth,
-    showDebugCoordinates: false,
-  });
+  const [settings, setSettings] = useState(defaultSettings);
+
+  useEffect(() => {
+    const settings = localStorage.getItem("settings");
+    if (settings) {
+      setSettings(JSON.parse(settings));
+    }
+  }, []);
+
+  useEffect(() => {
+    localStorage.setItem("settings", JSON.stringify(settings));
+  }, [settings]);
 
   return (
     <SettingsContext.Provider value={{ settings, setSettings }}>