feat(webui): add model settings runtime refresh

webui/src/App.tsx

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { DeleteConfirm } from "@/components/DeleteConfirm";
 import { Sidebar } from "@/components/Sidebar";
+import { SettingsView } from "@/components/settings/SettingsView";
 import { ThreadShell } from "@/components/thread/ThreadShell";
 import { Sheet, SheetContent } from "@/components/ui/sheet";
 import { preloadMarkdownText } from "@/components/MarkdownText";
@@ -25,6 +26,7 @@ type BootState =
 
 const SIDEBAR_STORAGE_KEY = "nanobot-webui.sidebar";
 const SIDEBAR_WIDTH = 279;
+type ShellView = "chat" | "settings";
 
 function readSidebarOpen(): boolean {
   if (typeof window === "undefined") return true;
@@ -136,22 +138,29 @@ export default function App() {
     );
   }
 
+  const handleModelNameChange = (modelName: string | null) => {
+    setState((current) =>
+      current.status === "ready" ? { ...current, modelName } : current,
+    );
+  };
+
   return (
     <ClientProvider
       client={state.client}
       token={state.token}
       modelName={state.modelName}
     >
-      <Shell />
+      <Shell onModelNameChange={handleModelNameChange} />
     </ClientProvider>
   );
 }
 
-function Shell() {
+function Shell({ onModelNameChange }: { onModelNameChange: (modelName: string | null) => void }) {
   const { t, i18n } = useTranslation();
   const { theme, toggle } = useTheme();
   const { sessions, loading, refresh, createChat, deleteChat } = useSessions();
   const [activeKey, setActiveKey] = useState<string | null>(null);
+  const [view, setView] = useState<ShellView>("chat");
   const [desktopSidebarOpen, setDesktopSidebarOpen] =
     useState<boolean>(readSidebarOpen);
   const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);
@@ -208,6 +217,7 @@ function Shell() {
     try {
       const chatId = await createChat();
       setActiveKey(`websocket:${chatId}`);
+      setView("chat");
       setMobileSidebarOpen(false);
       return chatId;
     } catch (e) {
@@ -219,6 +229,7 @@ function Shell() {
   const onSelectChat = useCallback(
     (key: string) => {
       setActiveKey(key);
+      setView("chat");
       setMobileSidebarOpen(false);
     },
     [],
@@ -266,6 +277,11 @@ function Shell() {
     onRefresh: () => void refresh(),
     onRequestDelete: (key: string, label: string) =>
       setPendingDelete({ key, label }),
+    activeView: view,
+    onOpenSettings: () => {
+      setView("settings" as const);
+      setMobileSidebarOpen(false);
+    },
   };
 
   return (
@@ -303,14 +319,23 @@ function Shell() {
       </Sheet>
 
       <main className="flex h-full min-w-0 flex-1 flex-col">
-        <ThreadShell
-          session={activeSession}
-          title={headerTitle}
-          onToggleSidebar={toggleSidebar}
-          onGoHome={() => setActiveKey(null)}
-          onNewChat={onNewChat}
-          hideSidebarToggleOnDesktop={desktopSidebarOpen}
-        />
+        {view === "settings" ? (
+          <SettingsView
+            theme={theme}
+            onToggleTheme={toggle}
+            onBackToChat={() => setView("chat")}
+            onModelNameChange={onModelNameChange}
+          />
+        ) : (
+          <ThreadShell
+            session={activeSession}
+            title={headerTitle}
+            onToggleSidebar={toggleSidebar}
+            onGoHome={() => setActiveKey(null)}
+            onNewChat={onNewChat}
+            hideSidebarToggleOnDesktop={desktopSidebarOpen}
+          />
+        )}
       </main>
 
       <DeleteConfirm