feat: persist custom settings

.eslintrc.json

@@ -23,6 +23,7 @@
     "@typescript-eslint/no-unsafe-member-access": "off",
     "@typescript-eslint/no-unsafe-call": "off",
     "@typescript-eslint/no-unsafe-assignment": "off",
-    "@typescript-eslint/no-unsafe-argument": "off"
+    "@typescript-eslint/no-unsafe-argument": "off",
+    "@typescript-eslint/ban-ts-comment": "off"
   }
 }

src/hooks/useSettings.ts

@@ -21,10 +21,15 @@ const loadSettings = () => {
   }
 
   const data = localStorage.getItem(SETTINGS_KEY);
+  if (!data) {
+    return DEFAULT_SETTINGS;
+  }
+
   try {
     const obj = JSON.parse(data) as ModelSettings;
     Object.entries(obj).forEach(([key, value]) => {
       if (DEFAULT_SETTINGS.hasOwnProperty(key)) {
+        // @ts-ignore
         DEFAULT_SETTINGS[key] = value;
       }
     });
@@ -48,5 +53,8 @@ export function useSettings() {
     localStorage.setItem(SETTINGS_KEY, JSON.stringify(settings));
   };
 
-  return [settings, saveSettings];
+  return {
+    settings,
+    saveSettings,
+  };
 }

src/pages/index.tsx

@@ -25,7 +25,7 @@ const Home: NextPage = () => {
   const [name, setName] = React.useState<string>("");
   const [goalInput, setGoalInput] = React.useState<string>("");
   const [agent, setAgent] = React.useState<AutonomousAgent | null>(null);
-  const [customSettings, setCustomSettings] = useSettings();
+  const { settings, saveSettings } = useSettings();
   const [shouldAgentStop, setShouldAgentStop] = React.useState(false);
   const [messages, setMessages] = React.useState<Message[]>([]);
   const [showHelpDialog, setShowHelpDialog] = React.useState(false);
@@ -73,7 +73,7 @@ const Home: NextPage = () => {
       goalInput.trim(),
       handleAddMessage,
       () => setAgent(null),
-      customSettings,
+      settings,
       session ?? undefined
     );
     setAgent(agent);
@@ -119,7 +119,7 @@ const Home: NextPage = () => {
         close={() => setShowHelpDialog(false)}
       />
       <SettingsDialog
-        customSettings={[customSettings, setCustomSettings]}
+        customSettings={[settings, saveSettings]}
         show={showSettingsDialog}
         close={() => setShowSettingsDialog(false)}
       />
@@ -246,7 +246,7 @@ const Home: NextPage = () => {
                     <span className="ml-2">Stopping</span>
                   </>
                 ) : (
-                  <span>"Stop agent"</span>
+                  <span>Stop agent</span>
                 )}
               </Button>
             </Expand>