openwork 0.1.4 → 0.2.0

package/README.md

@@ -44,7 +44,7 @@ Or configure them in-app via the settings panel.
 | --------- | -------------------------------------------------------------------------------------- |
 | Anthropic | Claude Opus 4.5, Claude Sonnet 4.5, Claude Haiku 4.5, Claude Opus 4.1, Claude Sonnet 4 |
 | OpenAI    | GPT-5.2, GPT-5.1, o3, o3 Mini, o4 Mini, o1, GPT-4.1, GPT-4o                            |
-| Google    | Gemini 3 Pro Preview, Gemini 2.5 Pro, Gemini 2.5 Flash, Gemini 2.5 Flash Lite          |
+| Google    | Gemini 3 Pro Preview, Gemini 3 Flash Preview, Gemini 2.5 Pro, Gemini 2.5 Flash, Gemini 2.5 Flash Lite |
 
 ## Contributing
 

package/out/renderer/assets/{index-DaPTMBd5.css → index-CeMSVFwO.css}

@@ -541,6 +541,11 @@
     display: inline-flex;
   }
 
+  .size-1\.5 {
+    width: calc(var(--spacing) * 1.5);
+    height: calc(var(--spacing) * 1.5);
+  }
+
   .size-2 {
     width: calc(var(--spacing) * 2);
     height: calc(var(--spacing) * 2);
@@ -760,6 +765,10 @@
     width: 140px;
   }
 
+  .w-\[200px\] {
+    width: 200px;
+  }
+
   .w-\[420px\] {
     width: 420px;
   }
@@ -816,6 +825,14 @@
     min-width: 8rem;
   }
 
+  .min-w-\[200px\] {
+    min-width: 200px;
+  }
+
+  .min-w-max {
+    min-width: max-content;
+  }
+
   .flex-1 {
     flex: 1;
   }
@@ -1043,6 +1060,11 @@
     border-top-width: 1px;
   }
 
+  .border-t-2 {
+    border-top-style: var(--tw-border-style);
+    border-top-width: 2px;
+  }
+
   .border-r {
     border-right-style: var(--tw-border-style);
     border-right-width: 1px;
@@ -1068,6 +1090,21 @@
     border-left-width: 1px;
   }
 
+  .border-dashed {
+    --tw-border-style: dashed;
+    border-style: dashed;
+  }
+
+  .\!border-amber-500\/50 {
+    border-color: #f99c0080 !important;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .\!border-amber-500\/50 {
+      border-color: color-mix(in oklab, var(--color-amber-500) 50%, transparent) !important;
+    }
+  }
+
   .border-amber-500\/20 {
     border-color: #f99c0033;
   }
@@ -1166,6 +1203,22 @@
     border-color: #0000;
   }
 
+  .border-t-border {
+    border-top-color: var(--border);
+  }
+
+  .border-t-status-info {
+    border-top-color: var(--status-info);
+  }
+
+  .border-t-status-nominal {
+    border-top-color: var(--status-nominal);
+  }
+
+  .border-t-status-warning {
+    border-top-color: var(--status-warning);
+  }
+
   .border-t-transparent {
     border-top-color: #0000;
   }
@@ -1178,6 +1231,16 @@
     border-left-color: #0000;
   }
 
+  .\!bg-amber-500\/5 {
+    background-color: #f99c000d !important;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .\!bg-amber-500\/5 {
+      background-color: color-mix(in oklab, var(--color-amber-500) 5%, transparent) !important;
+    }
+  }
+
   .bg-accent\/10 {
     background-color: var(--accent);
   }
@@ -1284,7 +1347,15 @@
     }
   }
 
-  .bg-muted, .bg-muted\/30 {
+  .bg-muted {
+    background-color: var(--muted);
+  }
+
+  .bg-muted-foreground {
+    background-color: var(--muted-foreground);
+  }
+
+  .bg-muted\/30 {
     background-color: var(--muted);
   }
 
@@ -1921,6 +1992,10 @@
     opacity: 1;
   }
 
+  .opacity-\[0\.03\] {
+    opacity: .03;
+  }
+
   .shadow-lg {
     --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2024,6 +2099,10 @@
   }
 
   @media (hover: hover) {
+    .hover\:border-border-emphasis:hover {
+      border-color: var(--border-emphasis);
+    }
+
     .hover\:bg-accent\/50:hover {
       background-color: var(--accent);
     }

package/out/renderer/assets/{index-u31WTlh3.js → index-D1IgUk4g.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" }],
@@ -16704,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();
@@ -16716,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);
@@ -16796,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);
@@ -17944,6 +17964,13 @@ function convertToV1FromResponses(message) {
         };
         continue;
       } else if (_isContentBlock(toolOutput, "image_generation_call")) {
+        if (_isString(toolOutput.result)) yield {
+          type: "image",
+          mimeType: "image/png",
+          data: toolOutput.result,
+          id: _isString(toolOutput.id) ? toolOutput.id : void 0,
+          metadata: { status: _isString(toolOutput.status) ? toolOutput.status : void 0 }
+        };
         yield {
           type: "non_standard",
           value: toolOutput
@@ -18187,8 +18214,8 @@ const DEFAULT_MERGE_IGNORE_KEYS = [
 ];
 function _mergeDicts(left, right, options) {
   const ignoreKeys = options?.ignoreKeys ?? DEFAULT_MERGE_IGNORE_KEYS;
-  if (left === void 0 && right === void 0) return void 0;
-  if (left === void 0 || right === void 0) return left ?? right;
+  if (left == null && right == null) return void 0;
+  if (left == null || right == null) return left ?? right;
   const merged = { ...left };
   for (const [key2, value] of Object.entries(right)) if (merged[key2] == null) merged[key2] = value;
   else if (value == null) continue;
@@ -18213,8 +18240,8 @@ function _mergeDicts(left, right, options) {
   return merged;
 }
 function _mergeLists(left, right, options) {
-  if (left === void 0 && right === void 0) return void 0;
-  else if (left === void 0 || right === void 0) return left || right;
+  if (left == null && right == null) return void 0;
+  else if (left == null || right == null) return left || right;
   else {
     const merged = [...left];
     for (const item of right) if (typeof item === "object" && item !== null && "index" in item && typeof item.index === "number") {
@@ -18233,8 +18260,8 @@ function _mergeLists(left, right, options) {
   }
 }
 function _mergeObj(left, right, options) {
-  if (left === void 0 && right === void 0) return void 0;
-  if (left === void 0 || right === void 0) return left ?? right;
+  if (left == null && right == null) return void 0;
+  if (left == null || right == null) return left ?? right;
   else if (typeof left !== typeof right) throw new Error(`Cannot merge objects of different types.
 Left ${typeof left}
 Right ${typeof right}`);
@@ -30324,7 +30351,7 @@ var CallbackManager = class CallbackManager2 extends BaseCallbackManager {
       callbackManager = callbackManager.copy(Array.isArray(localHandlers) ? localHandlers.map(ensureHandler) : localHandlers?.handlers, false);
     }
     const verboseEnabled = getEnvironmentVariable$2("LANGCHAIN_VERBOSE") === "true" || options?.verbose;
-    const tracingV2Enabled = LangChainTracer.getTraceableRunTree()?.tracingEnabled || isTracingEnabled();
+    const tracingV2Enabled = LangChainTracer.getTraceableRunTree()?.tracingEnabled ?? isTracingEnabled();
     const tracingEnabled = tracingV2Enabled || (getEnvironmentVariable$2("LANGCHAIN_TRACING") ?? false);
     if (verboseEnabled || tracingEnabled) {
       if (!callbackManager) callbackManager = new CallbackManager2();
@@ -31899,7 +31926,9 @@ const defaultFailedAttemptHandler = (error) => {
   if (typeof error !== "object" || error === null) return;
   if ("message" in error && typeof error.message === "string" && (error.message.startsWith("Cancel") || error.message.startsWith("AbortError")) || "name" in error && typeof error.name === "string" && error.name === "AbortError") throw error;
   if ("code" in error && typeof error.code === "string" && error.code === "ECONNABORTED") throw error;
-  const status = "response" in error && typeof error.response === "object" && error.response !== null && "status" in error.response && typeof error.response.status === "number" ? error.response.status : void 0;
+  const responseStatus = "response" in error && typeof error.response === "object" && error.response !== null && "status" in error.response && typeof error.response.status === "number" ? error.response.status : void 0;
+  const directStatus = "status" in error && typeof error.status === "number" ? error.status : void 0;
+  const status = responseStatus ?? directStatus;
   if (status && STATUS_NO_RETRY$1.includes(+status)) throw error;
   const code2 = "error" in error && typeof error.error === "object" && error.error !== null && "code" in error.error && typeof error.error.code === "string" ? error.error.code : void 0;
   if (code2 === "insufficient_quota") {
@@ -41300,14 +41329,15 @@ var StreamManager = class {
   };
   getMutateFn = (kind, historyValues) => {
     return (update) => {
+      const stateValues = (this.state.values ?? [null, "stream"])[0];
       const prev = {
         ...historyValues,
-        ...(this.state.values ?? [null, "stream"])[0]
+        ...stateValues ?? {}
       };
       const next = typeof update === "function" ? update(prev) : update;
       this.setStreamValues({
         ...prev,
-        ...next
+        ...next ?? {}
       }, kind);
     };
   };
@@ -41344,8 +41374,8 @@ var StreamManager = class {
         if (this.matchEventType("checkpoints", event, data)) options.callbacks.onCheckpointEvent?.(data, { namespace });
         if (this.matchEventType("tasks", event, data)) options.callbacks.onTaskEvent?.(data, { namespace });
         if (this.matchEventType("debug", event, data)) options.callbacks.onDebugEvent?.(data, { namespace });
-        if (event === "values") if ("__interrupt__" in data) this.setStreamValues((prev) => ({
-          ...prev,
+        if (event === "values") if (data != null && typeof data === "object" && "__interrupt__" in data) this.setStreamValues((prev) => ({
+          ...prev ?? {},
           ...data
         }));
         else this.setStreamValues(data);
@@ -41359,7 +41389,7 @@ var StreamManager = class {
           this.setStreamValues((streamValues) => {
             const values$1 = {
               ...options.initialValues,
-              ...streamValues
+              ...streamValues ?? {}
             };
             let messages = options.getMessages(values$1).slice();
             const { chunk, index: index2 } = this.messages.get(messageId, messages.length) ?? {};
@@ -42925,7 +42955,7 @@ var BaseClient = class {
     const [url, init] = this.prepareFetchOptions(path2, options);
     let finalInit = init;
     if (this.onRequest) finalInit = await this.onRequest(url, init);
-    const response = await this.asyncCaller.fetch(url, finalInit);
+    const response = await this.asyncCaller.fetch(url.toString(), finalInit);
     const body2 = (() => {
       if (response.status === 202 || response.status === 204) return;
       return response.json();
@@ -42955,7 +42985,7 @@ var BaseClient = class {
         json: isReconnect ? void 0 : config2.json
       });
       if (this.onRequest != null) init = await this.onRequest(url, init);
-      const response = await this.asyncCaller.fetch(url, init);
+      const response = await this.asyncCaller.fetch(url.toString(), init);
       if (!isReconnect && config2.onInitialResponse) await config2.onInitialResponse(response);
       return {
         response,
@@ -43922,7 +43952,7 @@ var UiClient = class UiClient2 extends BaseClient {
         json: { name: agentName }
       });
       if (this.onRequest != null) init = await this.onRequest(url, init);
-      return (await this.asyncCaller.fetch(url, init)).text();
+      return (await this.asyncCaller.fetch(url.toString(), init)).text();
     });
   }
 };
@@ -43987,6 +44017,13 @@ function unique(array) {
 function findLast(array, predicate) {
   for (let i2 = array.length - 1; i2 >= 0; i2 -= 1) if (predicate(array[i2])) return array[i2];
 }
+async function* filterStream(stream, filter) {
+  while (true) {
+    const { value, done } = await stream.next();
+    if (done) return value;
+    if (filter(value)) yield value;
+  }
+}
 function getBranchSequence(history) {
   const nodeIds = /* @__PURE__ */ new Set();
   const childrenMap = {};
@@ -44446,11 +44483,12 @@ function useStreamLGP(options) {
     };
     await stream.start(async (signal) => {
       threadIdStreamingRef.current = threadId;
-      return client2.runs.joinStream(threadId, runId, {
+      const stream$1 = client2.runs.joinStream(threadId, runId, {
         signal,
         lastEventId,
         streamMode: joinOptions?.streamMode
       });
+      return joinOptions?.filter != null ? filterStream(stream$1, joinOptions.filter) : stream$1;
     }, {
       getMessages,
       setMessages,
@@ -45162,7 +45200,8 @@ const createDefaultThreadState = () => ({
   openFiles: [],
   activeTab: "agent",
   fileContents: {},
-  tokenUsage: null
+  tokenUsage: null,
+  draftInput: ""
 });
 const defaultStreamData = {
   messages: [],
@@ -45227,6 +45266,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({});
@@ -45241,6 +45281,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]
   );
@@ -45270,6 +45314,16 @@ function ThreadProvider({ children }) {
     },
     [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) => {
@@ -45469,6 +45523,9 @@ function ThreadProvider({ children }) {
           updateThreadState(threadId, (state) => ({
             fileContents: { ...state.fileContents, [path2]: content2 }
           }));
+        },
+        setDraftInput: (input) => {
+          updateThreadState(threadId, () => ({ draftInput: input }));
         }
       };
       actionsCache.current[threadId] = actions;
@@ -45613,7 +45670,10 @@ function ThreadProvider({ children }) {
       initializeThread,
       cleanupThread,
       subscribeToStream,
-      getStreamData
+      getStreamData,
+      getAllThreadStates,
+      getAllStreamLoadingStates,
+      subscribeToAllStreams
     }),
     [
       getThreadState,
@@ -45621,7 +45681,10 @@ function ThreadProvider({ children }) {
       initializeThread,
       cleanupThread,
       subscribeToStream,
-      getStreamData
+      getStreamData,
+      getAllThreadStates,
+      getAllStreamLoadingStates,
+      subscribeToAllStreams
     ]
   );
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(ThreadContext.Provider, { value: contextValue, children: [
@@ -45671,6 +45734,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);
@@ -50772,7 +50843,15 @@ function ThreadListItem({
   ] });
 }
 function ThreadSidebar() {
-  const { threads, currentThreadId, createThread, selectThread, deleteThread, updateThread } = useAppStore();
+  const {
+    threads,
+    currentThreadId,
+    createThread,
+    selectThread,
+    deleteThread,
+    updateThread,
+    setShowKanbanView
+  } = useAppStore();
   const [editingThreadId, setEditingThreadId] = reactExports.useState(null);
   const [editingTitle, setEditingTitle] = reactExports.useState("");
   const startEditing = (threadId, currentTitle) => {
@@ -50825,7 +50904,20 @@ 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({
@@ -75453,7 +75545,6 @@ function ContextUsageIndicator({
   ] });
 }
 function ChatContainer({ threadId }) {
-  const [input, setInput] = reactExports.useState("");
   const inputRef = reactExports.useRef(null);
   const scrollRef = reactExports.useRef(null);
   const isAtBottomRef = reactExports.useRef(true);
@@ -75466,13 +75557,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;
@@ -76454,6 +76547,297 @@ 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);
@@ -76495,7 +76879,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);
@@ -76585,24 +76969,29 @@ function App() {
         },
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-name", children: "OPENWORK" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.1.4" })
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "app-badge-version", children: "0.2.0" })
         ]
       }
     ),
     /* @__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(

package/out/renderer/index.html

@@ -7,8 +7,8 @@
       http-equiv="Content-Security-Policy"
       content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:"
     />
-    <script type="module" crossorigin src="./assets/index-u31WTlh3.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-DaPTMBd5.css">
+    <script type="module" crossorigin src="./assets/index-D1IgUk4g.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/index-CeMSVFwO.css">
   </head>
   <body>
     <div id="root"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "openwork",
-  "version": "0.1.4",
+  "version": "0.2.0",
   "description": "A tactical agent interface for deepagentsjs",
   "main": "./out/main/index.js",
   "files": [
@@ -46,14 +46,13 @@
     "build": "npm run typecheck && electron-vite build"
   },
   "dependencies": {
-    "electron": "^39.2.6",
-    "@langchain/anthropic": "^1.3.10",
-    "@langchain/core": "1.1.15",
+    "@langchain/anthropic": "^1.3.11",
+    "@langchain/core": "1.1.16",
+    "@langchain/google-genai": "^2.1.12",
     "@langchain/langgraph": "^1.0.15",
     "@langchain/langgraph-checkpoint": "^1.0.0",
     "@langchain/langgraph-sdk": "^1.5.3",
-    "@langchain/openai": "^1.2.2",
-    "@langchain/google-genai": "^2.1.10",
+    "@langchain/openai": "^1.2.3",
     "@radix-ui/react-context-menu": "^2.2.16",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
@@ -69,8 +68,10 @@
     "@radix-ui/react-tooltip": "^1.2.8",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "deepagents": "^1.5.0",
+    "deepagents": "^1.5.1",
+    "electron": "^39.2.6",
     "electron-store": "^8.2.0",
+    "langchain": "^1.2.12",
     "lucide-react": "^0.469.0",
     "react-markdown": "^10.1.0",
     "react-resizable-panels": "^4.4.0",