@uniqueli/openwork 0.2.0 → 0.2.2

package/out/renderer/assets/{index-wQN5U7g5.js → index-BayYTupF.js}

@@ -12755,6 +12755,12 @@ const Key = createLucideIcon("Key", [
   ["path", { d: "m21 2-9.6 9.6", key: "1j0ho8" }],
   ["circle", { cx: "7.5", cy: "15.5", r: "5.5", key: "yqb3hr" }]
 ]);
+const LayoutGrid = createLucideIcon("LayoutGrid", [
+  ["rect", { width: "7", height: "7", x: "3", y: "3", rx: "1", key: "1g98yp" }],
+  ["rect", { width: "7", height: "7", x: "14", y: "3", rx: "1", key: "6d4xhi" }],
+  ["rect", { width: "7", height: "7", x: "14", y: "14", rx: "1", key: "nxv5o0" }],
+  ["rect", { width: "7", height: "7", x: "3", y: "14", rx: "1", key: "1bb6yr" }]
+]);
 const ListTodo = createLucideIcon("ListTodo", [
   ["rect", { x: "3", y: "5", width: "6", height: "6", rx: "1", key: "1defrl" }],
   ["path", { d: "m3 17 2 2 4-4", key: "1jhpwq" }],
@@ -15579,14 +15585,7 @@ const buttonVariants = cva(
 const Button = reactExports.forwardRef(
   ({ className, variant, size: size2, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot$3 : "button";
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Comp,
-      {
-        className: cn(buttonVariants({ variant, size: size2, className })),
-        ref,
-        ...props
-      }
-    );
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Comp, { className: cn(buttonVariants({ variant, size: size2, className })), ref, ...props });
   }
 );
 Button.displayName = "Button";
@@ -16711,6 +16710,8 @@ const useAppStore = create$1((set, get) => ({
   rightPanelTab: "todos",
   settingsOpen: false,
   sidebarCollapsed: false,
+  showKanbanView: false,
+  showSubagentsInKanban: true,
   // Thread actions
   loadThreads: async () => {
     const threads = await window.api.threads.list();
@@ -16723,12 +16724,13 @@ const useAppStore = create$1((set, get) => ({
     const thread = await window.api.threads.create(metadata);
     set((state) => ({
       threads: [thread, ...state.threads],
-      currentThreadId: thread.thread_id
+      currentThreadId: thread.thread_id,
+      showKanbanView: false
     }));
     return thread;
   },
   selectThread: async (threadId) => {
-    set({ currentThreadId: threadId });
+    set({ currentThreadId: threadId, showKanbanView: false });
   },
   deleteThread: async (threadId) => {
     console.log("[Store] Deleting thread:", threadId);
@@ -16803,6 +16805,17 @@ const useAppStore = create$1((set, get) => ({
   },
   setSidebarCollapsed: (collapsed) => {
     set({ sidebarCollapsed: collapsed });
+  },
+  // Kanban actions
+  setShowKanbanView: (show) => {
+    if (show) {
+      set({ showKanbanView: true, currentThreadId: null });
+    } else {
+      set({ showKanbanView: false });
+    }
+  },
+  setShowSubagentsInKanban: (show) => {
+    set({ showSubagentsInKanban: show });
   }
 }));
 const CR = "\r".charCodeAt(0);
@@ -44595,6 +44608,7 @@ class ElectronIPCTransport {
     this.accumulatedToolCalls.clear();
     this.completedToolCallsByName.clear();
     const threadId = payload.config?.configurable?.thread_id;
+    const modelId = payload.config?.configurable?.model_id;
     if (!threadId) {
       return this.createErrorGenerator("MISSING_THREAD_ID", "Thread ID is required");
     }
@@ -44606,7 +44620,13 @@ class ElectronIPCTransport {
     if (!messageContent && !hasResumeCommand) {
       return this.createErrorGenerator("MISSING_MESSAGE", "Message content is required");
     }
-    return this.createStreamGenerator(threadId, messageContent, payload.command, payload.signal);
+    return this.createStreamGenerator(
+      threadId,
+      messageContent,
+      payload.command,
+      payload.signal,
+      modelId
+    );
   }
   async *createErrorGenerator(code2, message) {
     yield {
@@ -44614,7 +44634,7 @@ class ElectronIPCTransport {
       data: { error: code2, message }
     };
   }
-  async *createStreamGenerator(threadId, message, command, signal) {
+  async *createStreamGenerator(threadId, message, command, signal, modelId) {
     const eventQueue = [];
     let resolveNext = null;
     let isDone = false;
@@ -44627,22 +44647,28 @@ class ElectronIPCTransport {
         thread_id: threadId
       }
     };
-    const cleanup = window.api.agent.streamAgent(threadId, message, command, (ipcEvent) => {
-      const sdkEvents = this.convertToSDKEvents(ipcEvent, threadId);
-      for (const sdkEvent of sdkEvents) {
-        if (sdkEvent.event === "done" || sdkEvent.event === "error") {
-          isDone = true;
-          hasError = sdkEvent.event === "error";
-        }
-        if (resolveNext) {
-          const resolve = resolveNext;
-          resolveNext = null;
-          resolve(sdkEvent);
-        } else {
-          eventQueue.push(sdkEvent);
+    const cleanup = window.api.agent.streamAgent(
+      threadId,
+      message,
+      command,
+      (ipcEvent) => {
+        const sdkEvents = this.convertToSDKEvents(ipcEvent, threadId);
+        for (const sdkEvent of sdkEvents) {
+          if (sdkEvent.event === "done" || sdkEvent.event === "error") {
+            isDone = true;
+            hasError = sdkEvent.event === "error";
+          }
+          if (resolveNext) {
+            const resolve = resolveNext;
+            resolveNext = null;
+            resolve(sdkEvent);
+          } else {
+            eventQueue.push(sdkEvent);
+          }
         }
-      }
-    });
+      },
+      modelId
+    );
     if (signal) {
       signal.addEventListener("abort", () => {
         cleanup();
@@ -45156,7 +45182,8 @@ const createDefaultThreadState = () => ({
   openFiles: [],
   activeTab: "agent",
   fileContents: {},
-  tokenUsage: null
+  tokenUsage: null,
+  draftInput: ""
 });
 const defaultStreamData = {
   messages: [],
@@ -45221,6 +45248,7 @@ function ThreadStreamHolder({
 function ThreadProvider({ children }) {
   const [threadStates, setThreadStates] = reactExports.useState({});
   const [activeThreadIds, setActiveThreadIds] = reactExports.useState(/* @__PURE__ */ new Set());
+  const [loadingStates, setLoadingStates] = reactExports.useState({});
   const initializedThreadsRef = reactExports.useRef(/* @__PURE__ */ new Set());
   const actionsCache = reactExports.useRef({});
   const streamDataRef = reactExports.useRef({});
@@ -45235,6 +45263,10 @@ function ThreadProvider({ children }) {
     (threadId, data) => {
       streamDataRef.current[threadId] = data;
       notifyStreamSubscribers(threadId);
+      setLoadingStates((prev) => {
+        if (prev[threadId] === data.isLoading) return prev;
+        return { ...prev, [threadId]: data.isLoading };
+      });
     },
     [notifyStreamSubscribers]
   );
@@ -45254,12 +45286,26 @@ function ThreadProvider({ children }) {
     (threadId) => {
       const state = threadStates[threadId] || createDefaultThreadState();
       if (state.pendingApproval) {
-        console.log("[ThreadContext] getThreadState returning pendingApproval for:", threadId, state.pendingApproval);
+        console.log(
+          "[ThreadContext] getThreadState returning pendingApproval for:",
+          threadId,
+          state.pendingApproval
+        );
       }
       return state;
     },
     [threadStates]
   );
+  const getAllThreadStates = reactExports.useCallback(() => {
+    return threadStates;
+  }, [threadStates]);
+  const getAllStreamLoadingStates = reactExports.useCallback(() => {
+    return loadingStates;
+  }, [loadingStates]);
+  const subscribeToAllStreams = reactExports.useCallback(() => {
+    return () => {
+    };
+  }, []);
   const updateThreadState = reactExports.useCallback(
     (threadId, updater) => {
       setThreadStates((prev) => {
@@ -45275,7 +45321,9 @@ function ThreadProvider({ children }) {
   );
   const parseErrorMessage = reactExports.useCallback((error) => {
     const errorMessage = typeof error === "string" ? error : error.message;
-    const contextWindowMatch = errorMessage.match(/prompt is too long: (\d+) tokens > (\d+) maximum/i);
+    const contextWindowMatch = errorMessage.match(
+      /prompt is too long: (\d+) tokens > (\d+) maximum/i
+    );
     if (contextWindowMatch) {
       const [, usedTokens, maxTokens] = contextWindowMatch;
       const usedK = Math.round(parseInt(usedTokens) / 1e3);
@@ -45304,7 +45352,11 @@ function ThreadProvider({ children }) {
       switch (data.type) {
         case "interrupt":
           if (data.request) {
-            console.log("[ThreadContext] Setting pendingApproval for thread:", threadId, data.request);
+            console.log(
+              "[ThreadContext] Setting pendingApproval for thread:",
+              threadId,
+              data.request
+            );
             updateThreadState(threadId, () => ({ pendingApproval: data.request }));
           }
           break;
@@ -45431,7 +45483,8 @@ function ThreadProvider({ children }) {
         closeFile: (path2) => {
           updateThreadState(threadId, (state) => {
             const newOpenFiles = state.openFiles.filter((f2) => f2.path !== path2);
-            const { [path2]: _2, ...newFileContents } = state.fileContents;
+            const newFileContents = { ...state.fileContents };
+            delete newFileContents[path2];
             let newActiveTab = state.activeTab;
             if (state.activeTab === path2) {
               const closedIndex = state.openFiles.findIndex((f2) => f2.path === path2);
@@ -45439,7 +45492,11 @@ function ThreadProvider({ children }) {
               else if (closedIndex > 0) newActiveTab = newOpenFiles[closedIndex - 1].path;
               else newActiveTab = newOpenFiles[0].path;
             }
-            return { openFiles: newOpenFiles, activeTab: newActiveTab, fileContents: newFileContents };
+            return {
+              openFiles: newOpenFiles,
+              activeTab: newActiveTab,
+              fileContents: newFileContents
+            };
           });
         },
         setActiveTab: (tab2) => {
@@ -45449,6 +45506,9 @@ function ThreadProvider({ children }) {
           updateThreadState(threadId, (state) => ({
             fileContents: { ...state.fileContents, [path2]: content2 }
           }));
+        },
+        setDraftInput: (input) => {
+          updateThreadState(threadId, () => ({ draftInput: input }));
         }
       };
       actionsCache.current[threadId] = actions;
@@ -45466,21 +45526,16 @@ function ThreadProvider({ children }) {
           if (metadata.currentModel) {
             actions.setCurrentModel(metadata.currentModel);
           }
-        }
-      } catch (error) {
-        console.error("[ThreadContext] Failed to load thread metadata:", error);
-      }
-      try {
-        const path2 = await window.api.workspace.get(threadId);
-        if (path2) {
-          actions.setWorkspacePath(path2);
-          const diskResult = await window.api.workspace.loadFromDisk(threadId);
-          if (diskResult.success) {
-            actions.setWorkspaceFiles(diskResult.files);
+          if (metadata.workspacePath) {
+            actions.setWorkspacePath(metadata.workspacePath);
+            const diskResult = await window.api.workspace.loadFromDisk(threadId);
+            if (diskResult.success) {
+              actions.setWorkspaceFiles(diskResult.files);
+            }
           }
         }
       } catch (error) {
-        console.error("[ThreadContext] Failed to load workspace path:", error);
+        console.error("[ThreadContext] Failed to load thread metadata:", error);
       }
       try {
         const history = await window.api.threads.getHistory(threadId);
@@ -45561,7 +45616,7 @@ function ThreadProvider({ children }) {
         console.error("[ThreadContext] Failed to load thread history:", error);
       }
     },
-    [getThreadActions]
+    [getThreadActions, updateThreadState]
   );
   const initializeThread = reactExports.useCallback(
     (threadId) => {
@@ -45587,7 +45642,7 @@ function ThreadProvider({ children }) {
       return next;
     });
     setThreadStates((prev) => {
-      const { [threadId]: _2, ...rest } = prev;
+      const { [threadId]: _removed, ...rest } = prev;
       return rest;
     });
   }, []);
@@ -45598,9 +45653,22 @@ function ThreadProvider({ children }) {
       initializeThread,
       cleanupThread,
       subscribeToStream,
-      getStreamData
+      getStreamData,
+      getAllThreadStates,
+      getAllStreamLoadingStates,
+      subscribeToAllStreams
     }),
-    [getThreadState, getThreadActions, initializeThread, cleanupThread, subscribeToStream, getStreamData]
+    [
+      getThreadState,
+      getThreadActions,
+      initializeThread,
+      cleanupThread,
+      subscribeToStream,
+      getStreamData,
+      getAllThreadStates,
+      getAllStreamLoadingStates,
+      subscribeToAllStreams
+    ]
   );
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(ThreadContext.Provider, { value: contextValue, children: [
     Array.from(activeThreadIds).map((threadId) => /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -45649,6 +45717,14 @@ function useThreadState(threadId) {
   const actions = context.getThreadActions(threadId);
   return { ...state, ...actions };
 }
+function useAllThreadStates() {
+  const context = useThreadContext();
+  return context.getAllThreadStates();
+}
+function useAllStreamLoadingStates() {
+  const context = useThreadContext();
+  return context.getAllStreamLoadingStates();
+}
 // @__NO_SIDE_EFFECTS__
 function createSlot$3(ownerName) {
   const SlotClone = /* @__PURE__ */ createSlotClone$3(ownerName);
@@ -50610,9 +50686,7 @@ var Portal2 = ContextMenuPortal;
 var Content2$1 = ContextMenuContent$1;
 var Item2 = ContextMenuItem$1;
 var Separator2 = ContextMenuSeparator$1;
-function ContextMenu({
-  ...props
-}) {
+function ContextMenu({ ...props }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(Root2$1, { "data-slot": "context-menu", ...props });
 }
 function ContextMenuTrigger({
@@ -50669,11 +50743,15 @@ function ContextMenuSeparator({
     }
   );
 }
-function ThreadLoadingIcon({ threadId }) {
+function ThreadStatusIcon$1({ threadId }) {
   const { isLoading } = useThreadStream(threadId);
+  const { pendingApproval } = useCurrentThread(threadId);
   if (isLoading) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 shrink-0 text-status-info animate-spin" });
   }
+  if (pendingApproval) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(CircleAlert, { className: "size-4 shrink-0 text-status-warning" });
+  }
   return /* @__PURE__ */ jsxRuntimeExports.jsx(MessageSquare, { className: "size-4 shrink-0 text-muted-foreground" });
 }
 function ThreadListItem({
@@ -50702,7 +50780,7 @@ function ThreadListItem({
           }
         },
         children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(ThreadLoadingIcon, { threadId: thread.thread_id }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(ThreadStatusIcon$1, { threadId: thread.thread_id }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0 overflow-hidden", children: isEditing ? /* @__PURE__ */ jsxRuntimeExports.jsx(
             "input",
             {
@@ -50744,17 +50822,10 @@ function ThreadListItem({
         "Rename"
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenuSeparator, {}),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        ContextMenuItem,
-        {
-          variant: "destructive",
-          onClick: onDelete,
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4 mr-2" }),
-            "Delete"
-          ]
-        }
-      )
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(ContextMenuItem, { variant: "destructive", onClick: onDelete, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4 mr-2" }),
+        "Delete"
+      ] })
     ] })
   ] });
 }
@@ -50765,7 +50836,8 @@ function ThreadSidebar() {
     createThread,
     selectThread,
     deleteThread,
-    updateThread
+    updateThread,
+    setShowKanbanView
   } = useAppStore();
   const [editingThreadId, setEditingThreadId] = reactExports.useState(null);
   const [editingTitle, setEditingTitle] = reactExports.useState("");
@@ -50788,10 +50860,19 @@ function ThreadSidebar() {
     await createThread({ title: `Thread ${(/* @__PURE__ */ new Date()).toLocaleDateString()}` });
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("aside", { className: "flex h-full w-full flex-col border-r border-border bg-sidebar overflow-hidden", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-2", style: { paddingTop: "calc(8px + var(--sidebar-safe-padding, 0px))" }, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "sm", className: "w-full justify-start gap-2", onClick: handleNewThread, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Plus, { className: "size-4" }),
-      "New Thread"
-    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-2", style: { paddingTop: "calc(8px + var(--sidebar-safe-padding, 0px))" }, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        className: "w-full justify-start gap-2",
+        onClick: handleNewThread,
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Plus, { className: "size-4" }),
+          "New Thread"
+        ]
+      }
+    ) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-2 space-y-1 overflow-hidden", children: [
       threads.map((thread) => /* @__PURE__ */ jsxRuntimeExports.jsx(
         ThreadListItem,
@@ -50810,10 +50891,26 @@ function ThreadSidebar() {
         thread.thread_id
       )),
       threads.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 py-8 text-center text-sm text-muted-foreground", children: "No threads yet" })
-    ] }) })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-2 border-t border-border", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        className: "w-full justify-start gap-2",
+        onClick: () => setShowKanbanView(true),
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(LayoutGrid, { className: "size-4" }),
+          "Overview"
+        ]
+      }
+    ) })
   ] });
 }
-function TabBar({ className, threadId: propThreadId }) {
+function TabBar({
+  className,
+  threadId: propThreadId
+}) {
   const { currentThreadId } = useAppStore();
   const threadId = propThreadId ?? currentThreadId;
   const threadState = useThreadState(threadId);
@@ -50821,36 +50918,42 @@ function TabBar({ className, threadId: propThreadId }) {
     return null;
   }
   const { openFiles, activeTab, setActiveTab, closeFile } = threadState;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn(
-    "flex items-center h-9 border-b border-border bg-sidebar overflow-x-auto scrollbar-hide",
-    className
-  ), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "button",
-      {
-        onClick: () => setActiveTab("agent"),
-        className: cn(
-          "flex items-center gap-2 px-4 h-full text-sm font-medium transition-colors shrink-0 border-r border-border",
-          activeTab === "agent" ? "bg-primary/15 text-primary border-b-2 border-b-primary" : "text-muted-foreground hover:text-foreground hover:bg-background-interactive"
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center h-9 border-b border-border bg-sidebar overflow-x-auto scrollbar-hide",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: () => setActiveTab("agent"),
+            className: cn(
+              "flex items-center gap-2 px-4 h-full text-sm font-medium transition-colors shrink-0 border-r border-border",
+              activeTab === "agent" ? "bg-primary/15 text-primary border-b-2 border-b-primary" : "text-muted-foreground hover:text-foreground hover:bg-background-interactive"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "size-4" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Agent" })
+            ]
+          }
         ),
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "size-4" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Agent" })
-        ]
-      }
-    ),
-    openFiles.map((file) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      FileTab,
-      {
-        file,
-        isActive: activeTab === file.path,
-        onSelect: () => setActiveTab(file.path),
-        onClose: () => closeFile(file.path)
-      },
-      file.path
-    )),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0" })
-  ] });
+        openFiles.map((file) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+          FileTab,
+          {
+            file,
+            isActive: activeTab === file.path,
+            onSelect: () => setActiveTab(file.path),
+            onClose: () => closeFile(file.path)
+          },
+          file.path
+        )),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0" })
+      ]
+    }
+  );
 }
 function FileTab({ file, isActive, onSelect, onClose }) {
   const handleClose = (e) => {
@@ -50925,27 +51028,8 @@ const IMAGE_EXTENSIONS = /* @__PURE__ */ new Set([
   "tiff",
   "tif"
 ]);
-const VIDEO_EXTENSIONS = /* @__PURE__ */ new Set([
-  "mp4",
-  "webm",
-  "ogg",
-  "ogv",
-  "mov",
-  "avi",
-  "wmv",
-  "flv",
-  "mkv"
-]);
-const AUDIO_EXTENSIONS = /* @__PURE__ */ new Set([
-  "mp3",
-  "wav",
-  "ogg",
-  "oga",
-  "m4a",
-  "flac",
-  "aac",
-  "weba"
-]);
+const VIDEO_EXTENSIONS = /* @__PURE__ */ new Set(["mp4", "webm", "ogg", "ogv", "mov", "avi", "wmv", "flv", "mkv"]);
+const AUDIO_EXTENSIONS = /* @__PURE__ */ new Set(["mp3", "wav", "ogg", "oga", "m4a", "flac", "aac", "weba"]);
 const PDF_EXTENSIONS = /* @__PURE__ */ new Set(["pdf"]);
 const CODE_EXTENSIONS = /* @__PURE__ */ new Set([
   "ts",
@@ -51057,36 +51141,36 @@ function getFileType(fileName) {
 function getMimeType(ext) {
   const mimeTypes = {
     // Images
-    "png": "image/png",
-    "jpg": "image/jpeg",
-    "jpeg": "image/jpeg",
-    "gif": "image/gif",
-    "svg": "image/svg+xml",
-    "webp": "image/webp",
-    "bmp": "image/bmp",
-    "ico": "image/x-icon",
-    "tiff": "image/tiff",
-    "tif": "image/tiff",
+    png: "image/png",
+    jpg: "image/jpeg",
+    jpeg: "image/jpeg",
+    gif: "image/gif",
+    svg: "image/svg+xml",
+    webp: "image/webp",
+    bmp: "image/bmp",
+    ico: "image/x-icon",
+    tiff: "image/tiff",
+    tif: "image/tiff",
     // Video
-    "mp4": "video/mp4",
-    "webm": "video/webm",
-    "ogg": "video/ogg",
-    "ogv": "video/ogg",
-    "mov": "video/quicktime",
-    "avi": "video/x-msvideo",
-    "wmv": "video/x-ms-wmv",
-    "flv": "video/x-flv",
-    "mkv": "video/x-matroska",
+    mp4: "video/mp4",
+    webm: "video/webm",
+    ogg: "video/ogg",
+    ogv: "video/ogg",
+    mov: "video/quicktime",
+    avi: "video/x-msvideo",
+    wmv: "video/x-ms-wmv",
+    flv: "video/x-flv",
+    mkv: "video/x-matroska",
     // Audio
-    "mp3": "audio/mpeg",
-    "wav": "audio/wav",
-    "oga": "audio/ogg",
-    "m4a": "audio/mp4",
-    "flac": "audio/flac",
-    "aac": "audio/aac",
-    "weba": "audio/webm",
+    mp3: "audio/mpeg",
+    wav: "audio/wav",
+    oga: "audio/ogg",
+    m4a: "audio/mp4",
+    flac: "audio/flac",
+    aac: "audio/aac",
+    weba: "audio/webm",
     // PDF
-    "pdf": "application/pdf"
+    pdf: "application/pdf"
   };
   return mimeTypes[ext] || "application/octet-stream";
 }
@@ -61610,25 +61694,25 @@ const SUPPORTED_LANGS = /* @__PURE__ */ new Set([
 ]);
 function getLanguage(ext) {
   const langMap = {
-    "ts": "typescript",
-    "tsx": "tsx",
-    "js": "javascript",
-    "jsx": "jsx",
-    "mjs": "javascript",
-    "cjs": "javascript",
-    "py": "python",
-    "json": "json",
-    "css": "css",
-    "html": "html",
-    "htm": "html",
-    "md": "markdown",
-    "mdx": "markdown",
-    "yaml": "yaml",
-    "yml": "yaml",
-    "sh": "bash",
-    "bash": "bash",
-    "zsh": "bash",
-    "sql": "sql"
+    ts: "typescript",
+    tsx: "tsx",
+    js: "javascript",
+    jsx: "jsx",
+    mjs: "javascript",
+    cjs: "javascript",
+    py: "python",
+    json: "json",
+    css: "css",
+    html: "html",
+    htm: "html",
+    md: "markdown",
+    mdx: "markdown",
+    yaml: "yaml",
+    yml: "yaml",
+    sh: "bash",
+    bash: "bash",
+    zsh: "bash",
+    sql: "sql"
   };
   const lang2 = ext ? langMap[ext] : null;
   return lang2 && SUPPORTED_LANGS.has(lang2) ? lang2 : null;
@@ -61678,19 +61762,17 @@ function CodeViewer({ filePath, content: content2 }) {
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground/50", children: "•" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground/70", children: language || "plain text" })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "shiki-wrapper", children: highlightedHtml ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "div",
-      {
-        className: "shiki-content",
-        dangerouslySetInnerHTML: { __html: highlightedHtml }
-      }
-    ) : (
+    /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "shiki-wrapper", children: highlightedHtml ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "shiki-content", dangerouslySetInnerHTML: { __html: highlightedHtml } }) : (
       // Fallback plain text rendering
       /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "p-4 text-sm font-mono leading-relaxed whitespace-pre-wrap break-all", children: content2 })
     ) }) })
   ] });
 }
-function ImageViewer({ filePath, base64Content, mimeType }) {
+function ImageViewer({
+  filePath,
+  base64Content,
+  mimeType
+}) {
   const [zoom, setZoom] = reactExports.useState(100);
   const [rotation, setRotation] = reactExports.useState(0);
   const [isPanning, setIsPanning] = reactExports.useState(false);
@@ -61700,10 +61782,18 @@ function ImageViewer({ filePath, base64Content, mimeType }) {
   const fileName = filePath.split("/").pop() || filePath;
   const imageUrl = `data:${mimeType};base64,${base64Content}`;
   const handleZoomIn = () => {
-    setZoom((prev) => Math.min(prev + 25, 400));
+    const newZoom = Math.min(zoom + 25, 400);
+    setZoom(newZoom);
+    if (newZoom <= 100) {
+      setPanOffset({ x: 0, y: 0 });
+    }
   };
   const handleZoomOut = () => {
-    setZoom((prev) => Math.max(prev - 25, 25));
+    const newZoom = Math.max(zoom - 25, 25);
+    setZoom(newZoom);
+    if (newZoom <= 100) {
+      setPanOffset({ x: 0, y: 0 });
+    }
   };
   const handleResetZoom = () => {
     setZoom(100);
@@ -61734,11 +61824,6 @@ function ImageViewer({ filePath, base64Content, mimeType }) {
   const handleMouseLeave = () => {
     setIsPanning(false);
   };
-  reactExports.useEffect(() => {
-    if (zoom <= 100) {
-      setPanOffset({ x: 0, y: 0 });
-    }
-  }, [zoom]);
   const canPan = zoom > 100;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 flex-col min-h-0 overflow-hidden", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 px-4 py-2 border-b border-border bg-background/50 shrink-0", children: [
@@ -61781,26 +61866,8 @@ function ImageViewer({ filePath, base64Content, mimeType }) {
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(ZoomIn, { className: "size-4" })
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "sm",
-            onClick: handleRotate,
-            className: "h-7 px-2",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, { className: "size-4" })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "sm",
-            onClick: handleResetZoom,
-            className: "h-7 px-2",
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Maximize2, { className: "size-4" })
-          }
-        )
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "sm", onClick: handleRotate, className: "h-7 px-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RotateCw, { className: "size-4" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "sm", onClick: handleResetZoom, className: "h-7 px-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Maximize2, { className: "size-4" }) })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -61833,7 +61900,12 @@ function ImageViewer({ filePath, base64Content, mimeType }) {
     ) })
   ] });
 }
-function MediaViewer({ filePath, base64Content, mimeType, mediaType }) {
+function MediaViewer({
+  filePath,
+  base64Content,
+  mimeType,
+  mediaType
+}) {
   const fileName = filePath.split("/").pop() || filePath;
   const mediaUrl = `data:${mimeType};base64,${base64Content}`;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 flex-col min-h-0 overflow-hidden", children: [
@@ -61864,18 +61936,10 @@ function MediaViewer({ filePath, base64Content, mimeType, mediaType }) {
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-muted-foreground", children: "Audio File" })
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "audio",
-        {
-          controls: true,
-          className: "w-full max-w-md",
-          preload: "metadata",
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("source", { src: mediaUrl, type: mimeType }),
-            "Your browser does not support the audio tag."
-          ]
-        }
-      )
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("audio", { controls: true, className: "w-full max-w-md", preload: "metadata", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("source", { src: mediaUrl, type: mimeType }),
+        "Your browser does not support the audio tag."
+      ] })
     ] }) }) })
   ] });
 }
@@ -61895,39 +61959,22 @@ function PDFViewer({ filePath, base64Content }) {
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-muted-foreground/50", children: "•" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "PDF Document" })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        Button,
-        {
-          variant: "ghost",
-          size: "sm",
-          onClick: handleOpenExternal,
-          className: "h-7 px-2 gap-1",
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "size-3" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs", children: "Download" })
-          ]
-        }
-      )
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { variant: "ghost", size: "sm", onClick: handleOpenExternal, className: "h-7 px-2 gap-1", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "size-3" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs", children: "Download" })
+      ] })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center min-h-full bg-muted/30", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "object",
-      {
-        data: pdfUrl,
-        type: "application/pdf",
-        className: "w-full h-full min-h-[600px]",
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center min-h-[600px] gap-4 p-8", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(FileText, { className: "size-16 text-muted-foreground/50" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium text-foreground mb-2", children: fileName }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-muted-foreground mb-4", children: "PDF preview not available in this browser" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { onClick: handleOpenExternal, variant: "outline", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "size-4 mr-2" }),
-              "Download PDF"
-            ] })
-          ] })
+    /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col items-center min-h-full bg-muted/30", children: /* @__PURE__ */ jsxRuntimeExports.jsx("object", { data: pdfUrl, type: "application/pdf", className: "w-full h-full min-h-[600px]", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center min-h-[600px] gap-4 p-8", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(FileText, { className: "size-16 text-muted-foreground/50" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium text-foreground mb-2", children: fileName }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-muted-foreground mb-4", children: "PDF preview not available in this browser" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(Button, { onClick: handleOpenExternal, variant: "outline", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "size-4 mr-2" }),
+          "Download PDF"
         ] })
-      }
-    ) }) })
+      ] })
+    ] }) }) }) })
   ] });
 }
 function BinaryFileViewer({ filePath, size: size2 }) {
@@ -62142,16 +62189,23 @@ function TodosDisplay({ todos }) {
     const config2 = statusConfig[todo.status] || defaultConfig;
     const Icon2 = config2.icon;
     const isDone = todo.status === "completed" || todo.status === "cancelled";
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn(
-      "flex items-start gap-2 text-xs",
-      isDone && "opacity-50"
-    ), children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Icon2, { className: cn("size-3.5 mt-0.5 shrink-0", config2.color) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(isDone && "line-through"), children: todo.content })
-    ] }, todo.id || i2);
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        className: cn("flex items-start gap-2 text-xs", isDone && "opacity-50"),
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Icon2, { className: cn("size-3.5 mt-0.5 shrink-0", config2.color) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(isDone && "line-through"), children: todo.content })
+        ]
+      },
+      todo.id || i2
+    );
   }) });
 }
-function FileListDisplay({ files, isGlob }) {
+function FileListDisplay({
+  files,
+  isGlob
+}) {
   const items = files.slice(0, 15);
   const hasMore = files.length > 15;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-0.5", children: [
@@ -62170,12 +62224,17 @@ function FileListDisplay({ files, isGlob }) {
     ] })
   ] });
 }
-function GrepResultsDisplay({ matches: matches2 }) {
-  const grouped = matches2.reduce((acc, match) => {
-    if (!acc[match.path]) acc[match.path] = [];
-    acc[match.path].push(match);
-    return acc;
-  }, {});
+function GrepResultsDisplay({
+  matches: matches2
+}) {
+  const grouped = matches2.reduce(
+    (acc, match) => {
+      if (!acc[match.path]) acc[match.path] = [];
+      acc[match.path].push(match);
+      return acc;
+    },
+    {}
+  );
   const files = Object.keys(grouped).slice(0, 5);
   const hasMore = Object.keys(grouped).length > 5;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
@@ -62252,7 +62311,10 @@ function FileEditSummary({ args }) {
   }
   return null;
 }
-function CommandDisplay({ command, output }) {
+function CommandDisplay({
+  command,
+  output
+}) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs space-y-2 w-full overflow-hidden", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "font-mono bg-background rounded-sm p-2 flex items-center gap-2 min-w-0", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-status-info shrink-0", children: "$" }),
@@ -62264,7 +62326,10 @@ function CommandDisplay({ command, output }) {
     ] })
   ] });
 }
-function TaskDisplay({ args, isExpanded }) {
+function TaskDisplay({
+  args,
+  isExpanded
+}) {
   const name2 = args.name;
   const description = args.description;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs space-y-1", children: [
@@ -62272,13 +62337,16 @@ function TaskDisplay({ args, isExpanded }) {
       /* @__PURE__ */ jsxRuntimeExports.jsx(GitBranch, { className: "size-3 text-status-info" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium truncate", children: name2 })
     ] }),
-    description && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: cn(
-      "text-muted-foreground pl-5",
-      !isExpanded && "line-clamp-2"
-    ), children: description })
+    description && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: cn("text-muted-foreground pl-5", !isExpanded && "line-clamp-2"), children: description })
   ] });
 }
-function ToolCallRenderer({ toolCall, result, isError: isError2, needsApproval, onApprovalDecision }) {
+function ToolCallRenderer({
+  toolCall,
+  result,
+  isError: isError2,
+  needsApproval,
+  onApprovalDecision
+}) {
   const args = toolCall?.args || {};
   const [isExpanded, setIsExpanded] = reactExports.useState(false);
   if (!toolCall) {
@@ -62358,7 +62426,9 @@ function ToolCallRenderer({ toolCall, result, isError: isError2, needsApproval,
       }
       case "ls": {
         if (Array.isArray(result)) {
-          const dirs = result.filter((f2) => typeof f2 === "object" && f2.is_dir).length;
+          const dirs = result.filter(
+            (f2) => typeof f2 === "object" && f2.is_dir
+          ).length;
           const files = result.length - dirs;
           return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs text-status-nominal flex items-center gap-1.5", children: [
@@ -62491,72 +62561,89 @@ function ToolCallRenderer({ toolCall, result, isError: isError2, needsApproval,
   const formattedContent = renderFormattedContent();
   const formattedResult = renderFormattedResult();
   const hasFormattedDisplay = formattedContent || formattedResult;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn(
-    "rounded-sm border overflow-hidden",
-    needsApproval ? "border-amber-500/50 bg-amber-500/5" : "border-border bg-background-elevated"
-  ), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "button",
-      {
-        onClick: () => setIsExpanded(!isExpanded),
-        className: "flex w-full items-center gap-2 px-3 py-2 hover:bg-background-interactive transition-colors",
-        children: [
-          isExpanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 text-muted-foreground shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 text-muted-foreground shrink-0" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(Icon2, { className: cn("size-4 shrink-0", needsApproval ? "text-amber-500" : "text-status-info") }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-medium shrink-0", children: label }),
-          displayArg && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 truncate text-left text-xs text-muted-foreground font-mono", children: displayArg }),
-          needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "warning", className: "ml-auto shrink-0", children: "APPROVAL" }),
-          !needsApproval && result === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "outline", className: "ml-auto shrink-0 animate-pulse", children: "RUNNING" }),
-          result !== void 0 && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: isError2 ? "critical" : "nominal", className: "ml-auto shrink-0", children: isError2 ? "ERROR" : "OK" }),
-          isPanelSynced && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "outline", className: "shrink-0 text-[9px]", children: "SYNCED" })
-        ]
-      }
-    ),
-    needsApproval ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-amber-500/20 px-3 py-3 space-y-3", children: [
-      formattedContent,
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header text-[10px] mb-1", children: "ARGUMENTS" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "text-xs font-mono bg-background p-2 rounded-sm overflow-auto max-h-24", children: JSON.stringify(args, null, 2) })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: cn(
+        "rounded-sm border overflow-hidden",
+        needsApproval ? "border-amber-500/50 bg-amber-500/5" : "border-border bg-background-elevated"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "button",
           {
-            className: "px-3 py-1.5 text-xs border border-border rounded-sm hover:bg-background-interactive transition-colors",
-            onClick: handleReject,
-            children: "Reject"
+            onClick: () => setIsExpanded(!isExpanded),
+            className: "flex w-full items-center gap-2 px-3 py-2 hover:bg-background-interactive transition-colors",
+            children: [
+              isExpanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-4 text-muted-foreground shrink-0" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-4 text-muted-foreground shrink-0" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                Icon2,
+                {
+                  className: cn("size-4 shrink-0", needsApproval ? "text-amber-500" : "text-status-info")
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-medium shrink-0", children: label }),
+              displayArg && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 truncate text-left text-xs text-muted-foreground font-mono", children: displayArg }),
+              needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "warning", className: "ml-auto shrink-0", children: "APPROVAL" }),
+              !needsApproval && result === void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "outline", className: "ml-auto shrink-0 animate-pulse", children: "RUNNING" }),
+              result !== void 0 && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: isError2 ? "critical" : "nominal", className: "ml-auto shrink-0", children: isError2 ? "ERROR" : "OK" }),
+              isPanelSynced && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "outline", className: "shrink-0 text-[9px]", children: "SYNCED" })
+            ]
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "button",
-          {
-            className: "px-3 py-1.5 text-xs bg-status-nominal text-background rounded-sm hover:bg-status-nominal/90 transition-colors",
-            onClick: handleApprove,
-            children: "Approve & Run"
-          }
-        )
-      ] })
-    ] }) : null,
-    hasFormattedDisplay && !isExpanded && !needsApproval && result !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-border px-3 py-2 space-y-2 overflow-hidden", children: [
-      formattedContent,
-      formattedResult
-    ] }),
-    isExpanded && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-border px-3 py-2 space-y-2 overflow-hidden", children: [
-      formattedContent,
-      formattedResult,
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-hidden w-full", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header mb-1", children: "RAW ARGUMENTS" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "text-xs font-mono bg-background p-2 rounded-sm overflow-auto max-h-48 w-full whitespace-pre-wrap break-all", children: JSON.stringify(args, null, 2) })
-      ] }),
-      result !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-hidden w-full", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header mb-1", children: "RAW RESULT" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: cn(
-          "text-xs font-mono p-2 rounded-sm overflow-auto max-h-48 w-full whitespace-pre-wrap break-all",
-          isError2 ? "bg-status-critical/10 text-status-critical" : "bg-background"
-        ), children: typeof result === "string" ? result : JSON.stringify(result, null, 2) })
-      ] })
-    ] })
-  ] });
+        needsApproval ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-amber-500/20 px-3 py-3 space-y-3", children: [
+          formattedContent,
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header text-[10px] mb-1", children: "ARGUMENTS" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "text-xs font-mono bg-background p-2 rounded-sm overflow-auto max-h-24", children: JSON.stringify(args, null, 2) })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                className: "px-3 py-1.5 text-xs border border-border rounded-sm hover:bg-background-interactive transition-colors",
+                onClick: handleReject,
+                children: "Reject"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                className: "px-3 py-1.5 text-xs bg-status-nominal text-background rounded-sm hover:bg-status-nominal/90 transition-colors",
+                onClick: handleApprove,
+                children: "Approve & Run"
+              }
+            )
+          ] })
+        ] }) : null,
+        hasFormattedDisplay && !isExpanded && !needsApproval && result !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-border px-3 py-2 space-y-2 overflow-hidden", children: [
+          formattedContent,
+          formattedResult
+        ] }),
+        isExpanded && !needsApproval && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "border-t border-border px-3 py-2 space-y-2 overflow-hidden", children: [
+          formattedContent,
+          formattedResult,
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-hidden w-full", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header mb-1", children: "RAW ARGUMENTS" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "text-xs font-mono bg-background p-2 rounded-sm overflow-auto max-h-48 w-full whitespace-pre-wrap break-all", children: JSON.stringify(args, null, 2) })
+          ] }),
+          result !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "overflow-hidden w-full", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-section-header mb-1", children: "RAW RESULT" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "pre",
+              {
+                className: cn(
+                  "text-xs font-mono p-2 rounded-sm overflow-auto max-h-48 w-full whitespace-pre-wrap break-all",
+                  isError2 ? "bg-status-critical/10 text-status-critical" : "bg-background"
+                ),
+                children: typeof result === "string" ? result : JSON.stringify(result, null, 2)
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
 }
 function ok$1() {
 }
@@ -73902,7 +73989,13 @@ const StreamingMarkdown = reactExports.memo(function StreamingMarkdown2({
     isStreaming && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "inline-block w-2 h-4 ml-0.5 bg-foreground/70 animate-pulse" })
   ] });
 });
-function MessageBubble({ message, isStreaming, toolResults, pendingApproval, onApprovalDecision }) {
+function MessageBubble({
+  message,
+  isStreaming,
+  toolResults,
+  pendingApproval,
+  onApprovalDecision
+}) {
   const isUser = message.role === "user";
   const isTool = message.role === "tool";
   if (isTool) {
@@ -73945,14 +74038,14 @@ function MessageBubble({ message, isStreaming, toolResults, pendingApproval, onA
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-3 overflow-hidden", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 shrink-0", children: !isUser && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex size-8 items-center justify-center rounded-sm bg-status-info/10 text-status-info", children: getIcon() }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0 space-y-2 overflow-hidden", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn(
-        "text-section-header",
-        isUser && "text-right"
-      ), children: getLabel() }),
-      content2 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn(
-        "rounded-sm p-3 overflow-hidden",
-        isUser ? "bg-primary/10" : "bg-card"
-      ), children: content2 }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("text-section-header", isUser && "text-right"), children: getLabel() }),
+      content2 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          className: cn("rounded-sm p-3 overflow-hidden", isUser ? "bg-primary/10" : "bg-card"),
+          children: content2
+        }
+      ),
       hasToolCalls && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-2 overflow-hidden", children: message.tool_calls.map((toolCall, index2) => {
         const result = toolResults?.get(toolCall.id);
         const pendingId = pendingApproval?.tool_call?.id;
@@ -74333,14 +74426,10 @@ var Root2 = Popover$1;
 var Trigger = PopoverTrigger$1;
 var Portal$1 = PopoverPortal;
 var Content2 = PopoverContent$1;
-function Popover({
-  ...props
-}) {
+function Popover({ ...props }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(Root2, { "data-slot": "popover", ...props });
 }
-function PopoverTrigger({
-  ...props
-}) {
+function PopoverTrigger({ ...props }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(Trigger, { "data-slot": "popover-trigger", ...props });
 }
 function PopoverContent({
@@ -74782,16 +74871,7 @@ const DialogContent = reactExports.forwardRef(({ className, children, ...props }
   )
 ] }));
 DialogContent.displayName = Content.displayName;
-const DialogHeader = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-  "div",
-  {
-    className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
-    ...props
-  }
-);
+const DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
 DialogHeader.displayName = "DialogHeader";
 const DialogTitle = reactExports.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(
   Title,
@@ -74831,10 +74911,13 @@ Input.displayName = "Input";
 const PROVIDER_INFO = {
   anthropic: { placeholder: "sk-ant-...", envVar: "ANTHROPIC_API_KEY" },
   openai: { placeholder: "sk-...", envVar: "OPENAI_API_KEY" },
-  google: { placeholder: "AIza...", envVar: "GOOGLE_API_KEY" },
-  custom: { placeholder: "your-api-key", envVar: "CUSTOM_API_KEY" }
+  google: { placeholder: "AIza...", envVar: "GOOGLE_API_KEY" }
 };
-function ApiKeyDialog({ open, onOpenChange, provider }) {
+function ApiKeyDialog({
+  open,
+  onOpenChange,
+  provider
+}) {
   const [apiKey, setApiKey] = reactExports.useState("");
   const [showKey, setShowKey] = reactExports.useState(false);
   const [saving, setSaving] = reactExports.useState(false);
@@ -74965,14 +75048,14 @@ function ApiKeyDialog({ open, onOpenChange, provider }) {
         ] })
       ] }),
       provider.id === "custom" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "text-xs text-muted-foreground", children: "Model Name (Optional)" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "text-xs text-muted-foreground", children: "Model Name (optional)" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Input,
           {
             type: "text",
             value: modelName,
             onChange: (e) => setModelName(e.target.value),
-            placeholder: "gpt-4, claude-3-opus, etc."
+            placeholder: "e.g., gpt-4"
           }
         ),
         /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xs text-muted-foreground", children: [
@@ -74981,32 +75064,29 @@ function ApiKeyDialog({ open, onOpenChange, provider }) {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between", children: [
-      hasExistingKey ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        Button,
-        {
-          type: "button",
-          variant: "destructive",
-          size: "sm",
-          onClick: handleDelete2,
-          disabled: deleting || saving,
-          children: [
-            deleting ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin mr-2" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4 mr-2" }),
-            "Remove Key"
-          ]
-        }
-      ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", {}),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: "Cancel" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between gap-2", children: [
+      hasExistingKey && /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "destructive", size: "sm", onClick: handleDelete2, disabled: deleting, children: deleting ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin" }),
+        "Removing..."
+      ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Trash2, { className: "size-4" }),
+        "Remove"
+      ] }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-2 ml-auto", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Button,
           {
-            type: "button",
-            onClick: handleSave,
-            disabled: !apiKey.trim() || saving || provider.id === "custom" && !baseUrl.trim(),
-            children: saving ? /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin" }) : "Save"
+            variant: "outline",
+            size: "sm",
+            onClick: () => onOpenChange(false),
+            disabled: saving,
+            children: "Cancel"
           }
-        )
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { size: "sm", onClick: handleSave, disabled: saving || !apiKey.trim(), children: saving ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin" }),
+          "Saving..."
+        ] }) : "Save" })
       ] })
     ] })
   ] }) });
@@ -75158,26 +75238,11 @@ function AddProviderDialog({ open, onOpenChange, onSuccess }) {
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-end gap-2", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Button,
-        {
-          variant: "outline",
-          onClick: handleCancel,
-          disabled: saving,
-          children: "取消"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Button,
-        {
-          onClick: handleSave,
-          disabled: saving || !id || !name2 || !baseUrl || !apiKey,
-          children: saving ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin mr-2" }),
-            "保存中..."
-          ] }) : "保存"
-        }
-      )
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "outline", onClick: handleCancel, disabled: saving, children: "取消" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { onClick: handleSave, disabled: saving || !id || !name2 || !baseUrl || !apiKey, children: saving ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 animate-spin mr-2" }),
+        "保存中..."
+      ] }) : "保存" })
     ] })
   ] }) });
 }
@@ -75191,11 +75256,21 @@ function GoogleIcon({ className }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M20.616 10.835a14.147 14.147 0 01-4.45-3.001 14.111 14.111 0 01-3.678-6.452.503.503 0 00-.975 0 14.134 14.134 0 01-3.679 6.452 14.155 14.155 0 01-4.45 3.001c-.65.28-1.318.505-2.002.678a.502.502 0 000 .975c.684.172 1.35.397 2.002.677a14.147 14.147 0 014.45 3.001 14.112 14.112 0 013.679 6.453.502.502 0 00.975 0c.172-.685.397-1.351.677-2.003a14.145 14.145 0 013.001-4.45 14.113 14.113 0 016.453-3.678.503.503 0 000-.975 13.245 13.245 0 01-2.003-.678z" }) });
 }
 function CustomIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M2 17l10 5 10-5" }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M2 12l10 5 10-5" })
-  ] });
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "svg",
+    {
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M2 17l10 5 10-5" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M2 12l10 5 10-5" })
+      ]
+    }
+  );
 }
 const PROVIDER_ICONS = {
   anthropic: AnthropicIcon,
@@ -75211,8 +75286,7 @@ function getProviderIcon(providerId) {
 const FALLBACK_PROVIDERS = [
   { id: "anthropic", name: "Anthropic", hasApiKey: false },
   { id: "openai", name: "OpenAI", hasApiKey: false },
-  { id: "google", name: "Google", hasApiKey: false },
-  { id: "custom", name: "Custom API", hasApiKey: false }
+  { id: "google", name: "Google", hasApiKey: false }
 ];
 function ModelSwitcher({ threadId }) {
   const [open, setOpen] = reactExports.useState(false);
@@ -75227,20 +75301,10 @@ function ModelSwitcher({ threadId }) {
     loadProviders();
   }, [loadModels, loadProviders]);
   const displayProviders = providers.length > 0 ? providers : FALLBACK_PROVIDERS;
-  reactExports.useEffect(() => {
-    if (!selectedProviderId && currentModel) {
-      const model = models.find((m2) => m2.id === currentModel);
-      if (model) {
-        setSelectedProviderId(model.provider);
-      }
-    }
-    if (!selectedProviderId && displayProviders.length > 0) {
-      setSelectedProviderId(displayProviders[0].id);
-    }
-  }, [currentModel, models, selectedProviderId, displayProviders]);
+  const effectiveProviderId = selectedProviderId || (currentModel ? models.find((m2) => m2.id === currentModel)?.provider : null) || (displayProviders.length > 0 ? displayProviders[0].id : null);
   const selectedModel = models.find((m2) => m2.id === currentModel);
-  const filteredModels = selectedProviderId ? models.filter((m2) => m2.provider === selectedProviderId) : [];
-  const selectedProvider = displayProviders.find((p2) => p2.id === selectedProviderId);
+  const filteredModels = effectiveProviderId ? models.filter((m2) => m2.provider === effectiveProviderId) : [];
+  const selectedProvider = displayProviders.find((p2) => p2.id === effectiveProviderId);
   function handleProviderClick(provider) {
     setSelectedProviderId(provider.id);
   }
@@ -75301,7 +75365,7 @@ function ModelSwitcher({ threadId }) {
                       onClick: () => handleProviderClick(provider),
                       className: cn(
                         "w-full flex items-center gap-1.5 px-2 py-1 rounded-sm text-xs transition-colors text-left",
-                        selectedProviderId === provider.id ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
+                        effectiveProviderId === provider.id ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
                       ),
                       children: [
                         /* @__PURE__ */ jsxRuntimeExports.jsx(Icon2, { className: "size-3.5 shrink-0" }),
@@ -75321,10 +75385,20 @@ function ModelSwitcher({ threadId }) {
                     },
                     className: "w-full flex items-center justify-center gap-1.5 px-2 py-2 rounded-sm text-xs transition-colors text-muted-foreground hover:text-foreground hover:bg-muted/50 border-t border-border mt-1 pt-2",
                     children: [
-                      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { className: "size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-                        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
-                        /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
-                      ] }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                        "svg",
+                        {
+                          className: "size-4",
+                          viewBox: "0 0 24 24",
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: "2",
+                          children: [
+                            /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
+                            /* @__PURE__ */ jsxRuntimeExports.jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
+                          ]
+                        }
+                      ),
                       /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "添加Provider" })
                     ]
                   }
@@ -75341,14 +75415,7 @@ function ModelSwitcher({ threadId }) {
                     "API key required for ",
                     selectedProvider.name
                   ] }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    Button,
-                    {
-                      size: "sm",
-                      onClick: () => handleConfigureApiKey(selectedProvider),
-                      children: "Configure API Key"
-                    }
-                  )
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { size: "sm", onClick: () => handleConfigureApiKey(selectedProvider), children: "Configure API Key" })
                 ] })
               ) : (
                 // Show models list with scrollable area
@@ -75577,11 +75644,16 @@ const MODEL_CONTEXT_LIMITS = {
   "gpt-4o-mini": 128e3,
   "gpt-4-turbo": 128e3,
   "gpt-4": 8192,
-  "o1": 2e5,
+  o1: 2e5,
   "o1-mini": 128e3,
-  "o3": 2e5,
+  o3: 2e5,
   "o3-mini": 2e5,
   // Google models
+  "gemini-3-pro-preview": 2e6,
+  "gemini-3-flash-preview": 1e6,
+  "gemini-2.5-pro": 2e6,
+  "gemini-2.5-flash": 1e6,
+  "gemini-2.5-flash-lite": 1e6,
   "gemini-2.0-flash": 1e6,
   "gemini-1.5-pro": 2e6,
   "gemini-1.5-flash": 1e6
@@ -75624,9 +75696,9 @@ function ContextUsageIndicator({
   const contextLimit = getContextLimit(modelId);
   const usedTokens = tokenUsage.inputTokens;
   const usagePercent = Math.min(usedTokens / contextLimit * 100, 100);
-  let colorClass = "text-muted-foreground";
-  let bgColorClass = "bg-muted-foreground/20";
-  let barColorClass = "bg-muted-foreground";
+  let colorClass = "text-blue-500";
+  let bgColorClass = "bg-blue-500/20";
+  let barColorClass = "bg-blue-500";
   let statusText = "Normal";
   if (usagePercent >= 90) {
     colorClass = "text-red-500";
@@ -75670,96 +75742,97 @@ function ContextUsageIndicator({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      PopoverContent,
-      {
-        className: "w-72 p-0 bg-background border-border",
-        align: "end",
-        sideOffset: 8,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 space-y-3", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-medium text-foreground", children: "Context Window" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("text-[10px] font-medium px-1.5 py-0.5 rounded", bgColorClass, colorClass), children: statusText })
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-2 bg-muted rounded-full overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "div",
-              {
-                className: cn("h-full rounded-full transition-all", barColorClass),
-                style: { width: `${usagePercent}%` }
-              }
-            ) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between text-[10px] text-muted-foreground", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-                formatTokenCountFull(usedTokens),
-                " tokens"
-              ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-                formatTokenCountFull(contextLimit),
-                " max"
-              ] })
-            ] })
+    /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverContent, { className: "w-72 p-0 bg-background border-border", align: "end", sideOffset: 8, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 space-y-3", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-medium text-foreground", children: "Context Window" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "span",
+          {
+            className: cn(
+              "text-[10px] font-medium px-1.5 py-0.5 rounded",
+              bgColorClass,
+              colorClass
+            ),
+            children: statusText
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "h-2 bg-muted rounded-full overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: cn("h-full rounded-full transition-all", barColorClass),
+            style: { width: `${usagePercent}%` }
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between text-[10px] text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+            formatTokenCountFull(usedTokens),
+            " tokens"
           ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1.5 pt-2 border-t border-border", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider", children: "Token Breakdown" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowUp, { className: "size-3" }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Input" })
-                ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.inputTokens) })
-              ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowDown, { className: "size-3" }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Output" })
-                ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.outputTokens) })
-              ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs pt-1 border-t border-border/50", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(Zap, { className: "size-3" }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Total" })
-                ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.totalTokens) })
-              ] })
-            ] })
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+            formatTokenCountFull(contextLimit),
+            " max"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1.5 pt-2 border-t border-border", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider", children: "Token Breakdown" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowUp, { className: "size-3" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Input" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.inputTokens) })
           ] }),
-          hasCacheData && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1.5 pt-2 border-t border-border", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider", children: "Cache" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1", children: [
-              tokenUsage.cacheReadTokens !== void 0 && tokenUsage.cacheReadTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-green-500", children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(Database, { className: "size-3" }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Cache hits" })
-                ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-green-500", children: formatTokenCountFull(tokenUsage.cacheReadTokens) })
-              ] }),
-              tokenUsage.cacheCreationTokens !== void 0 && tokenUsage.cacheCreationTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-blue-500", children: [
-                  /* @__PURE__ */ jsxRuntimeExports.jsx(Database, { className: "size-3" }),
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Cache created" })
-                ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-blue-500", children: formatTokenCountFull(tokenUsage.cacheCreationTokens) })
-              ] })
-            ] })
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowDown, { className: "size-3" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Output" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.outputTokens) })
           ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "pt-2 border-t border-border", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-[10px] text-muted-foreground", children: [
-            "Last updated: ",
-            tokenUsage.lastUpdated.toLocaleTimeString()
-          ] }) })
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs pt-1 border-t border-border/50", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-muted-foreground", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Zap, { className: "size-3" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Total" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono", children: formatTokenCountFull(tokenUsage.totalTokens) })
+          ] })
         ] })
-      }
-    )
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1.5 pt-2 border-t border-border", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider", children: "Cache" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-1", children: hasCacheData ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+          tokenUsage.cacheReadTokens !== void 0 && tokenUsage.cacheReadTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-green-500", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Database, { className: "size-3" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Cache hits" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-green-500", children: formatTokenCountFull(tokenUsage.cacheReadTokens) })
+          ] }),
+          tokenUsage.cacheCreationTokens !== void 0 && tokenUsage.cacheCreationTokens > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-blue-500", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Database, { className: "size-3" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Cache created" })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-mono text-blue-500", children: formatTokenCountFull(tokenUsage.cacheCreationTokens) })
+          ] })
+        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-muted-foreground", children: "No cached tokens" }) })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "pt-2 border-t border-border", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-[10px] text-muted-foreground", children: [
+        "Last updated: ",
+        tokenUsage.lastUpdated.toLocaleTimeString()
+      ] }) })
+    ] }) })
   ] });
 }
 function ChatContainer({ threadId }) {
-  const [input, setInput] = reactExports.useState("");
   const inputRef = reactExports.useRef(null);
   const scrollRef = reactExports.useRef(null);
   const isAtBottomRef = reactExports.useRef(true);
-  const { loadThreads, generateTitleForFirstMessage } = useAppStore();
+  const { threads, loadThreads, generateTitleForFirstMessage } = useAppStore();
   const {
     messages: threadMessages,
     pendingApproval,
@@ -75768,13 +75841,15 @@ function ChatContainer({ threadId }) {
     workspacePath,
     tokenUsage,
     currentModel,
+    draftInput: input,
     setTodos,
     setWorkspaceFiles,
     setWorkspacePath,
     setPendingApproval,
     appendMessage,
     setError,
-    clearError
+    clearError,
+    setDraftInput: setInput
   } = useCurrentThread(threadId);
   const streamData = useThreadStream(threadId);
   const stream = streamData.stream;
@@ -75784,12 +75859,15 @@ function ChatContainer({ threadId }) {
       if (!pendingApproval || !stream) return;
       setPendingApproval(null);
       try {
-        await stream.submit(null, { command: { resume: { decision } } });
+        await stream.submit(null, {
+          command: { resume: { decision } },
+          config: { configurable: { thread_id: threadId, model_id: currentModel } }
+        });
       } catch (err) {
         console.error("[ChatContainer] Resume command failed:", err);
       }
     },
-    [pendingApproval, setPendingApproval, stream]
+    [pendingApproval, setPendingApproval, stream, threadId, currentModel]
   );
   const agentValues = stream?.values;
   const streamTodos = agentValues?.todos;
@@ -75924,7 +76002,11 @@ function ChatContainer({ threadId }) {
     };
     appendMessage(userMessage);
     if (isFirstMessage) {
-      generateTitleForFirstMessage(threadId, message);
+      const currentThread = threads.find((t) => t.thread_id === threadId);
+      const hasDefaultTitle = currentThread?.title?.startsWith("Thread ");
+      if (hasDefaultTitle) {
+        generateTitleForFirstMessage(threadId, message);
+      }
     }
     await stream.submit(
       {
@@ -75932,7 +76014,7 @@ function ChatContainer({ threadId }) {
       },
       {
         config: {
-          configurable: { thread_id: threadId }
+          configurable: { thread_id: threadId, model_id: currentModel }
         }
       }
     );
@@ -76034,7 +76116,17 @@ function ChatContainer({ threadId }) {
             style: { minHeight: "48px", maxHeight: "200px" }
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center shrink-0 h-12", children: isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: handleCancel, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Square, { className: "size-4" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "submit", variant: "default", size: "icon", disabled: !input.trim(), className: "rounded-md", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Send, { className: "size-4" }) }) })
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center shrink-0 h-12", children: isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { type: "button", variant: "ghost", size: "icon", onClick: handleCancel, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Square, { className: "size-4" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Button,
+          {
+            type: "submit",
+            variant: "default",
+            size: "icon",
+            disabled: !input.trim(),
+            className: "rounded-md",
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(Send, { className: "size-4" })
+          }
+        ) })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
@@ -76585,14 +76677,11 @@ function buildFileTree(files) {
   return root2;
 }
 function FileTree({ files }) {
+  const { currentThreadId } = useAppStore();
+  const threadState = useThreadState(currentThreadId);
+  const openFile = threadState?.openFile;
   const tree = reactExports.useMemo(() => buildFileTree(files), [files]);
-  const [expanded, setExpanded] = reactExports.useState(() => {
-    const dirs = /* @__PURE__ */ new Set();
-    files.forEach((f2) => {
-      if (f2.is_dir ?? false) dirs.add(f2.path);
-    });
-    return dirs;
-  });
+  const [expanded, setExpanded] = reactExports.useState(/* @__PURE__ */ new Set());
   const toggleExpand = reactExports.useCallback((path2) => {
     setExpanded((prev) => {
       const next = new Set(prev);
@@ -76610,59 +76699,64 @@ function FileTree({ files }) {
       node: node2,
       depth: 0,
       expanded,
-      onToggle: toggleExpand
+      onToggle: toggleExpand,
+      openFile
     },
     node2.path
   )) });
 }
-function FileTreeNode({
-  node: node2,
-  depth,
-  expanded,
-  onToggle
-}) {
-  const { currentThreadId } = useAppStore();
-  const threadState = useThreadState(currentThreadId);
-  const openFile = threadState?.openFile;
-  const isExpanded = expanded.has(node2.path);
-  const hasChildren = node2.children.length > 0;
-  const paddingLeft = 8 + depth * 16;
-  const handleClick = () => {
-    if (node2.is_dir) {
-      onToggle(node2.path);
-    } else if (openFile) {
-      openFile(node2.path, node2.name);
-    }
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        onClick: handleClick,
-        className: cn(
-          "flex items-center gap-1.5 py-1 pr-3 text-xs hover:bg-background-interactive cursor-pointer"
-        ),
-        style: { paddingLeft },
-        children: [
-          node2.is_dir ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-3.5 flex items-center justify-center shrink-0", children: hasChildren && (isExpanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3 text-muted-foreground" })) }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-3.5 shrink-0" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(FileIcon, { name: node2.name, isDir: node2.is_dir, isOpen: isExpanded }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate flex-1", children: node2.name }),
-          !node2.is_dir && node2.size !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] text-muted-foreground tabular-nums shrink-0", children: formatSize(node2.size) })
-        ]
+const FileTreeNode = reactExports.memo(
+  function FileTreeNode2({
+    node: node2,
+    depth,
+    expanded,
+    onToggle,
+    openFile
+  }) {
+    const isExpanded = expanded.has(node2.path);
+    const hasChildren = node2.children.length > 0;
+    const paddingLeft = 8 + depth * 16;
+    const handleClick = () => {
+      if (node2.is_dir) {
+        onToggle(node2.path);
+      } else if (openFile) {
+        openFile(node2.path, node2.name);
       }
-    ),
-    node2.is_dir && isExpanded && node2.children.map((child) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      FileTreeNode,
-      {
-        node: child,
-        depth: depth + 1,
-        expanded,
-        onToggle
-      },
-      child.path
-    ))
-  ] });
-}
+    };
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          onClick: handleClick,
+          className: cn(
+            "flex items-center gap-1.5 py-1 pr-3 text-xs hover:bg-background-interactive cursor-pointer"
+          ),
+          style: { paddingLeft },
+          children: [
+            node2.is_dir ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-3.5 flex items-center justify-center shrink-0", children: hasChildren && (isExpanded ? /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "size-3 text-muted-foreground" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronRight, { className: "size-3 text-muted-foreground" })) }) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "w-3.5 shrink-0" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(FileIcon, { name: node2.name, isDir: node2.is_dir, isOpen: isExpanded }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "truncate flex-1", children: node2.name }),
+            !node2.is_dir && node2.size !== void 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-[10px] text-muted-foreground tabular-nums shrink-0", children: formatSize(node2.size) })
+          ]
+        }
+      ),
+      node2.is_dir && isExpanded && node2.children.map((child) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        FileTreeNode2,
+        {
+          node: child,
+          depth: depth + 1,
+          expanded,
+          onToggle,
+          openFile
+        },
+        child.path
+      ))
+    ] });
+  },
+  (prevProps, nextProps) => {
+    return prevProps.node === nextProps.node && prevProps.expanded.has(prevProps.node.path) === nextProps.expanded.has(nextProps.node.path) && prevProps.openFile === nextProps.openFile && prevProps.onToggle === nextProps.onToggle && prevProps.depth === nextProps.depth;
+  }
+);
 function FileIcon({
   name: name2,
   isDir,
@@ -76743,27 +76837,321 @@ function formatSize(bytes) {
   if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)}KB`;
   return `${(bytes / (1024 * 1024)).toFixed(1)}MB`;
 }
+const columnConfig = {
+  pending: { badge: "outline", borderColor: "border-t-border" },
+  in_progress: { badge: "info", borderColor: "border-t-status-info" },
+  interrupted: { badge: "warning", borderColor: "border-t-status-warning" },
+  done: { badge: "nominal", borderColor: "border-t-status-nominal" }
+};
+function KanbanColumn({
+  title,
+  status,
+  count: count2,
+  children
+}) {
+  const config2 = columnConfig[status];
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col min-w-[200px] w-[200px] flex-1 bg-muted/30 rounded-sm border border-border border-t-2",
+        config2.borderColor
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-section-header", children: title }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: config2.badge, children: count2 })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollArea, { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-2 space-y-2", children }) })
+      ]
+    }
+  );
+}
+const Card = reactExports.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      ref,
+      className: cn("rounded-sm border border-border bg-card text-card-foreground", className),
+      ...props
+    }
+  )
+);
+Card.displayName = "Card";
+const CardHeader = reactExports.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref, className: cn("flex flex-col space-y-1.5 p-4", className), ...props })
+);
+CardHeader.displayName = "CardHeader";
+const CardTitle = reactExports.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { ref, className: cn("text-section-header", className), ...props })
+);
+CardTitle.displayName = "CardTitle";
+const CardDescription = reactExports.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx("p", { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
+CardDescription.displayName = "CardDescription";
+const CardContent = reactExports.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref, className: cn("p-4 pt-0", className), ...props })
+);
+CardContent.displayName = "CardContent";
+const CardFooter = reactExports.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref, className: cn("flex items-center p-4 pt-0", className), ...props })
+);
+CardFooter.displayName = "CardFooter";
+function ThreadStatusIcon({ threadId }) {
+  const { isLoading } = useThreadStream(threadId);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(LoaderCircle, { className: "size-4 shrink-0 text-status-info animate-spin" });
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(MessageSquare, { className: "size-4 shrink-0 text-muted-foreground" });
+}
+function ThreadKanbanCard({ thread, status, onClick }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Card,
+    {
+      className: cn(
+        "cursor-pointer transition-all hover:border-border-emphasis hover:bg-background-interactive",
+        status === "in_progress" && "border-status-info/50",
+        status === "interrupted" && "!border-amber-500/50 !bg-amber-500/5"
+      ),
+      onClick,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(CardContent, { className: "p-3", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start gap-2", children: [
+        status === "interrupted" ? /* @__PURE__ */ jsxRuntimeExports.jsx(MessageSquare, { className: "size-4 shrink-0 text-amber-500" }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ThreadStatusIcon, { threadId: thread.thread_id }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm font-medium truncate", children: thread.title || truncate(thread.thread_id, 20) }),
+            status === "done" && /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { variant: "nominal", className: "shrink-0 text-[9px]", children: "DONE" })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 mt-1 text-[10px] text-muted-foreground", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Clock, { className: "size-3" }),
+            formatRelativeTime(thread.updated_at)
+          ] })
+        ] })
+      ] }) })
+    }
+  );
+}
+function SubagentKanbanCard({
+  subagent,
+  parentThread,
+  onClick
+}) {
+  const isDone = subagent.status === "completed" || subagent.status === "failed";
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    Card,
+    {
+      className: cn(
+        "cursor-pointer transition-all hover:border-border-emphasis hover:bg-background-interactive border-dashed",
+        subagent.status === "running" && "border-status-info/50"
+      ),
+      onClick,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(CardContent, { className: "p-3 overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start gap-2 min-w-0", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Bot,
+          {
+            className: cn(
+              "size-4 shrink-0",
+              subagent.status === "running" ? "text-status-info" : "text-muted-foreground"
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0 overflow-hidden", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm font-medium truncate", children: subagent.name }),
+            isDone && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Badge,
+              {
+                variant: subagent.status === "failed" ? "critical" : "nominal",
+                className: "shrink-0 text-[9px]",
+                children: subagent.status === "failed" ? "FAILED" : "DONE"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-[10px] text-muted-foreground line-clamp-2 mt-0.5 break-words", children: subagent.description }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center gap-1 mt-1 text-[10px] text-muted-foreground", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "truncate", children: [
+            "↳ ",
+            parentThread.title || truncate(parentThread.thread_id, 15)
+          ] }) })
+        ] })
+      ] }) })
+    }
+  );
+}
+function getThreadKanbanStatus(thread, isLoading, hasDraft, hasPendingApproval) {
+  if (hasPendingApproval || thread.status === "interrupted") return "interrupted";
+  if (thread.status === "busy" || isLoading) return "in_progress";
+  if (hasDraft) return "pending";
+  return "done";
+}
+function KanbanView() {
+  const { threads, selectThread, showSubagentsInKanban } = useAppStore();
+  const allThreadStates = useAllThreadStates();
+  const loadingStates = useAllStreamLoadingStates();
+  const handleCardClick = (threadId) => {
+    selectThread(threadId);
+  };
+  const categorizedThreads = reactExports.useMemo(() => {
+    const result = {
+      pending: [],
+      in_progress: [],
+      interrupted: [],
+      done: []
+    };
+    for (const thread of threads) {
+      const isLoading = loadingStates[thread.thread_id] ?? false;
+      const threadState = allThreadStates[thread.thread_id];
+      const hasDraft = Boolean(threadState?.draftInput?.trim());
+      const hasPendingApproval = Boolean(threadState?.pendingApproval);
+      const status = getThreadKanbanStatus(thread, isLoading, hasDraft, hasPendingApproval);
+      result[status].push({ thread, status });
+    }
+    return result;
+  }, [threads, loadingStates, allThreadStates]);
+  const categorizedSubagents = reactExports.useMemo(() => {
+    if (!showSubagentsInKanban) {
+      return { pending: [], in_progress: [], interrupted: [], done: [] };
+    }
+    const result = {
+      pending: [],
+      in_progress: [],
+      interrupted: [],
+      done: []
+    };
+    const threadMap = new Map(threads.map((t) => [t.thread_id, t]));
+    for (const [threadId, state] of Object.entries(allThreadStates)) {
+      const parentThread = threadMap.get(threadId);
+      if (!parentThread || !state.subagents) continue;
+      for (const subagent of state.subagents) {
+        let status;
+        switch (subagent.status) {
+          case "pending":
+            status = "pending";
+            break;
+          case "running":
+            status = "in_progress";
+            break;
+          case "completed":
+            status = "done";
+            break;
+          case "failed":
+            status = "done";
+            break;
+          default:
+            status = "pending";
+        }
+        result[status].push({ subagent, parentThread, status });
+      }
+    }
+    return result;
+  }, [threads, allThreadStates, showSubagentsInKanban]);
+  const columnData = [
+    { status: "pending", title: "PENDING" },
+    { status: "in_progress", title: "IN PROGRESS" },
+    { status: "interrupted", title: "BLOCKED" },
+    { status: "done", title: "DONE" }
+  ];
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col h-full bg-background", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-x-auto p-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex h-full min-w-max gap-2", children: columnData.map(({ status, title }) => {
+    const threadItems = categorizedThreads[status];
+    const subagentItems = categorizedSubagents[status];
+    const totalCount = threadItems.length + subagentItems.length;
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(KanbanColumn, { title, status, count: totalCount, children: [
+      threadItems.map(({ thread, status: threadStatus }) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        ThreadKanbanCard,
+        {
+          thread,
+          status: threadStatus,
+          onClick: () => handleCardClick(thread.thread_id)
+        },
+        thread.thread_id
+      )),
+      subagentItems.map(({ subagent, parentThread }) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        SubagentKanbanCard,
+        {
+          subagent,
+          parentThread,
+          onClick: () => handleCardClick(parentThread.thread_id)
+        },
+        subagent.id
+      )),
+      totalCount === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center text-sm text-muted-foreground py-8", children: "No items" })
+    ] }, status);
+  }) }) }) });
+}
+function KanbanHeader({ className }) {
+  const { showSubagentsInKanban, setShowSubagentsInKanban, threads } = useAppStore();
+  const activeCount = threads.filter(
+    (t) => t.status === "busy" || t.status === "interrupted"
+  ).length;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center justify-between px-3 app-no-drag relative overflow-hidden",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 pointer-events-none opacity-[0.03]", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            className: "absolute inset-0",
+            style: {
+              backgroundImage: "repeating-linear-gradient(0deg, transparent, transparent 2px, currentColor 2px, currentColor 3px)",
+              backgroundSize: "100% 3px"
+            }
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-1.5 text-[10px] font-mono uppercase tracking-wider text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: cn(
+                "size-1.5 rounded-full",
+                activeCount > 0 ? "bg-status-nominal animate-tactical-pulse" : "bg-muted-foreground"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "tabular-nums", children: activeCount > 0 ? `${activeCount} ACTIVE` : "IDLE" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          Button,
+          {
+            variant: showSubagentsInKanban ? "secondary" : "ghost",
+            size: "sm",
+            onClick: () => setShowSubagentsInKanban(!showSubagentsInKanban),
+            className: "gap-2 h-7 relative",
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(Bot, { className: "size-3.5" }),
+              showSubagentsInKanban ? "Hide" : "Show",
+              " Subagents"
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
 const HANDLE_WIDTH = 6;
 function ResizeHandle({ onDrag }) {
   const startXRef = reactExports.useRef(0);
-  const handleMouseDown = reactExports.useCallback((e) => {
-    e.preventDefault();
-    startXRef.current = e.clientX;
-    const handleMouseMove = (e2) => {
-      const totalDelta = e2.clientX - startXRef.current;
-      onDrag(totalDelta);
-    };
-    const handleMouseUp = () => {
-      document.removeEventListener("mousemove", handleMouseMove);
-      document.removeEventListener("mouseup", handleMouseUp);
-      document.body.style.cursor = "";
-      document.body.style.userSelect = "";
-    };
-    document.addEventListener("mousemove", handleMouseMove);
-    document.addEventListener("mouseup", handleMouseUp);
-    document.body.style.cursor = "col-resize";
-    document.body.style.userSelect = "none";
-  }, [onDrag]);
+  const handleMouseDown = reactExports.useCallback(
+    (e) => {
+      e.preventDefault();
+      startXRef.current = e.clientX;
+      const handleMouseMove = (e2) => {
+        const totalDelta = e2.clientX - startXRef.current;
+        onDrag(totalDelta);
+      };
+      const handleMouseUp = () => {
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+        document.body.style.cursor = "";
+        document.body.style.userSelect = "";
+      };
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.body.style.cursor = "col-resize";
+      document.body.style.userSelect = "none";
+    },
+    [onDrag]
+  );
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "div",
     {
@@ -76781,7 +77169,7 @@ const RIGHT_MIN = 250;
 const RIGHT_MAX = 450;
 const RIGHT_DEFAULT = 320;
 function App() {
-  const { currentThreadId, loadThreads, createThread } = useAppStore();
+  const { currentThreadId, loadThreads, createThread, showKanbanView } = useAppStore();
   const [isLoading, setIsLoading] = reactExports.useState(true);
   const [leftWidth, setLeftWidth] = reactExports.useState(LEFT_DEFAULT);
   const [rightWidth, setRightWidth] = reactExports.useState(RIGHT_DEFAULT);
@@ -76871,24 +77259,29 @@ function App() {
         },
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-name", children: "OPENWORK" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.2.0" })
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.2.2" })
         ]
       }
     ),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col flex-1 min-w-0", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-9 w-full shrink-0 app-drag-region bg-sidebar", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: leftWidth }, className: "shrink-0" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex h-9 w-full shrink-0 app-drag-region", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: leftWidth }, className: "shrink-0 bg-sidebar" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-[1px] shrink-0" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0", children: currentThreadId && /* @__PURE__ */ jsxRuntimeExports.jsx(TabBar, { className: "h-full border-b-0" }) })
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0 bg-background border-b border-border", children: showKanbanView ? /* @__PURE__ */ jsxRuntimeExports.jsx(KanbanHeader, { className: "h-full" }) : currentThreadId && /* @__PURE__ */ jsxRuntimeExports.jsx(TabBar, { className: "h-full border-b-0" }) })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 overflow-hidden", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: leftWidth }, className: "shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ThreadSidebar, {}) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle, { onDrag: handleLeftResize }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: "flex flex-1 flex-col min-w-0 overflow-hidden", children: currentThreadId ? /* @__PURE__ */ jsxRuntimeExports.jsx(TabbedPanel, { threadId: currentThreadId, showTabBar: false }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center text-muted-foreground", children: "Select or create a thread to begin" }) })
+        showKanbanView ? (
+          /* Kanban View - replaces center and right panels */
+          /* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: "flex flex-1 flex-col min-w-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntimeExports.jsx(KanbanView, {}) })
+        ) : /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: "flex flex-1 flex-col min-w-0 overflow-hidden", children: currentThreadId ? /* @__PURE__ */ jsxRuntimeExports.jsx(TabbedPanel, { threadId: currentThreadId, showTabBar: false }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center text-muted-foreground", children: "Select or create a thread to begin" }) }) })
       ] })
     ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle, { onDrag: handleRightResize }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: rightWidth }, className: "shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RightPanel, {}) })
+    !showKanbanView && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(ResizeHandle, { onDrag: handleRightResize }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: rightWidth }, className: "shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RightPanel, {}) })
+    ] })
   ] }) });
 }
 ReactDOM$1.createRoot(document.getElementById("root")).render(