@invergent/agent-chat-react 2.5.8 → 2.6.0

package/dist/index.cjs

@@ -18,7 +18,7 @@ var streamdown = require('streamdown');
 var reactUseControllableState = require('@radix-ui/react-use-controllable-state');
 var shiki = require('shiki');
 var diff = require('diff');
-var Ansi = require('ansi-to-react');
+var AnsiImport = require('ansi-to-react');
 var cmdk = require('cmdk');
 var nanoid = require('nanoid');
 var tokenlens = require('tokenlens');
@@ -28,7 +28,7 @@ var dateFns = require('date-fns');
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var Ansi__default = /*#__PURE__*/_interopDefault(Ansi);
+var AnsiImport__default = /*#__PURE__*/_interopDefault(AnsiImport);
 
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -1025,6 +1025,11 @@ var MessageResponse = react.memo(
     {
       className: cn(
         "size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
+        // Streamdown emits ``list-inside`` lists and preflight strips
+        // the UA list padding, so bullet markers hug the container
+        // edge and wrapped lines slide under them. Hanging-indent
+        // lists instead, everywhere markdown renders.
+        "[&_ol]:list-outside [&_ol]:pl-5 [&_ul]:list-outside [&_ul]:pl-5",
         className
       ),
       plugins: streamdownPlugins,
@@ -1215,7 +1220,14 @@ var ReasoningContent = react.memo(
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(streamdown.Streamdown, { plugins: streamdownPlugins2, children })
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        streamdown.Streamdown,
+        {
+          className: "[&_ol]:list-outside [&_ol]:pl-5 [&_ul]:list-outside [&_ul]:pl-5",
+          plugins: streamdownPlugins2,
+          children
+        }
+      )
     }
   )
 );
@@ -3309,7 +3321,7 @@ var TerminalContent = ({
       ref: containerRef,
       ...props,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsxs("pre", { className: "whitespace-pre-wrap break-words", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Ansi__default.default, { children: output }),
+        /* @__PURE__ */ jsxRuntime.jsx(AnsiImport__default.default, { children: output }),
         isStreaming && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 inline-block h-4 w-2 animate-pulse bg-foreground" })
       ] })
     }
@@ -4573,6 +4585,108 @@ function ResearchOutlineBlock({ tc }) {
     outline ? /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-48 overflow-auto whitespace-pre-wrap font-mono text-[11px] leading-snug", children: outline }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "updated" })
   ] });
 }
+init_utils();
+var Ansi2 = AnsiImport__default.default.default ?? AnsiImport__default.default;
+function parseCodeRun(result, args) {
+  const fallback = {
+    agent: "",
+    provider: "",
+    prompt: "",
+    output: "",
+    finalMessage: "",
+    error: null,
+    inputTokens: 0,
+    outputTokens: 0
+  };
+  if (result) {
+    try {
+      const parsed = JSON.parse(result);
+      return { ...fallback, ...parsed, error: parsed.error ?? null };
+    } catch {
+    }
+  }
+  try {
+    const parsedArgs = JSON.parse(args);
+    return { ...fallback, ...parsedArgs, error: null };
+  } catch {
+    return fallback;
+  }
+}
+function agentLabel(state) {
+  if (state.agent) return state.agent;
+  if (state.provider === "anthropic") return "claude";
+  if (state.provider === "openai") return "codex";
+  return "coding agent";
+}
+function CodeRunToolBlock({
+  tc,
+  defaultOpen = false
+}) {
+  const [isOpen, setIsOpen] = react.useState(defaultOpen);
+  const isRunning = tc.status === "running";
+  const state = parseCodeRun(tc.result, tc.args);
+  const label = agentLabel(state);
+  const hasError = tc.status === "error" || Boolean(state.error);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Collapsible,
+    {
+      open: isOpen,
+      onOpenChange: setIsOpen,
+      className: "not-prose w-full",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(CollapsibleTrigger, { className: "group/trigger flex w-fit items-center gap-2 text-sm transition-colors", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-left", children: isRunning ? /* @__PURE__ */ jsxRuntime.jsx(Shimmer, { as: "span", duration: 1, children: `Running ${label}...` }) : hasError ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-destructive", children: `${label} failed` }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-foreground", children: `Ran ${label}` }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            lucideReact.ChevronDownIcon,
+            {
+              className: cn(
+                "size-4 shrink-0 transition-transform",
+                isOpen ? "rotate-180" : "rotate-0"
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          CollapsibleContent,
+          {
+            className: cn(
+              "mt-2 overflow-hidden",
+              "data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 outline-none data-[state=closed]:animate-out data-[state=open]:animate-in"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg border border-border overflow-hidden", children: [
+              state.prompt && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2 bg-background text-muted-foreground px-3 py-2 font-mono text-sm leading-relaxed", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 select-none text-emerald-600", children: "IN" }),
+                /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "whitespace-pre-wrap wrap-break-word text-foreground/90 flex-1", children: state.prompt })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  className: cn(
+                    "px-3 py-2 bg-background font-mono text-sm leading-relaxed max-h-96 overflow-auto",
+                    state.prompt && "border-t border-border"
+                  ),
+                  children: [
+                    (state.output || !isRunning) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 text-foreground/90", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 select-none text-sky-600", children: "OUT" }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("pre", { className: "whitespace-pre-wrap wrap-break-word flex-1", children: [
+                        state.output ? /* @__PURE__ */ jsxRuntime.jsx(Ansi2, { children: state.output }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground/60", children: "(no output)" }),
+                        isRunning && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 inline-block h-3.5 w-1.5 animate-pulse bg-foreground" })
+                      ] })
+                    ] }),
+                    isRunning && !state.output && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 inline-block h-3.5 w-1.5 animate-pulse bg-foreground" })
+                  ]
+                }
+              ),
+              !isRunning && hasError && state.error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-border bg-destructive/5 px-3 py-2 text-sm text-destructive", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "whitespace-pre-wrap wrap-break-word", children: state.error }) }),
+              !isRunning && !hasError && state.finalMessage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-border bg-background px-3 py-2 text-sm text-foreground/90", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "whitespace-pre-wrap wrap-break-word", children: state.finalMessage }) }),
+              !isRunning && (state.inputTokens > 0 || state.outputTokens > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-border bg-background px-3 py-1.5 text-xs text-muted-foreground", children: `${state.inputTokens.toLocaleString()} in \xB7 ${state.outputTokens.toLocaleString()} out tokens` })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
 function ToolCallBlock({
   tc,
   resolvedArtifactName,
@@ -4629,6 +4743,8 @@ function ToolCallBlock({
       return /* @__PURE__ */ jsxRuntime.jsx(ResearchOutlineBlock, { tc });
     case "research_memory":
       return /* @__PURE__ */ jsxRuntime.jsx(ResearchMemoryBlock, { tc });
+    case "code_run":
+      return /* @__PURE__ */ jsxRuntime.jsx(CodeRunToolBlock, { tc });
     case "spawn_worker":
     case "send_worker_message":
     case "stop_worker":
@@ -6222,6 +6338,7 @@ function ChatComposerInner({
   canShowBrowser = false,
   canShowWorkspace = false,
   deepResearchEnabled = false,
+  codeAgentsEnabled = false,
   viewMode = "simple",
   onViewModeChange
 }) {
@@ -6276,9 +6393,18 @@ function ChatComposerInner({
           description: "Delegate a topic to the deep-research workflow"
         });
       }
+      if (codeAgentsEnabled) {
+        base.push(
+          { value: "/code claude ", label: "/code claude", description: "Run Claude Code on the workspace (your plan)" },
+          { value: "/code codex ", label: "/code codex", description: "Run Codex on the workspace (your plan)" },
+          { value: "/code status", label: "/code status", description: "Show connected coding agents" },
+          { value: "/code login claude", label: "/code login claude", description: "Connect your Claude plan" },
+          { value: "/code login codex", label: "/code login codex", description: "Connect your ChatGPT plan" }
+        );
+      }
       return base;
     },
-    [deepResearchEnabled]
+    [deepResearchEnabled, codeAgentsEnabled]
   );
   const scheduledExamples = react.useMemo(
     () => [
@@ -7503,6 +7629,54 @@ function ArtifactSvg({ spec }) {
     spec.caption && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: spec.caption })
   ] });
 }
+init_utils();
+function useMediaSrc(sessionId, path) {
+  const { adapter } = useAgentChatAdapterContext();
+  return react.useMemo(
+    () => adapter.getWorkspaceDownloadUrl({ sessionId, path }),
+    [adapter, sessionId, path]
+  );
+}
+function MediaCaption({ caption }) {
+  if (!caption) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("figcaption", { className: "border-t border-border px-3 py-2 text-xs leading-snug text-muted-foreground", children: caption });
+}
+function ArtifactImage({ sessionId, spec, fill = false }) {
+  const src = useMediaSrc(sessionId, spec.path);
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: "m-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "img",
+      {
+        src,
+        alt: spec.caption ?? spec.path,
+        loading: "lazy",
+        className: cn(
+          "block w-full bg-muted/30 object-contain",
+          fill ? "max-h-full" : "max-h-[480px]"
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(MediaCaption, { caption: spec.caption })
+  ] });
+}
+function ArtifactVideo({ sessionId, spec, fill = false }) {
+  const src = useMediaSrc(sessionId, spec.path);
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: "m-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "video",
+      {
+        src,
+        controls: true,
+        preload: "metadata",
+        className: cn(
+          "block w-full bg-black object-contain",
+          fill ? "max-h-full" : "max-h-[480px]"
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(MediaCaption, { caption: spec.caption })
+  ] });
+}
 
 // src/components/chat/artifacts/artifact-export.ts
 function exportArtifact(payload) {
@@ -7537,6 +7711,17 @@ function exportArtifact(payload) {
         mime: "image/svg+xml",
         extension: "svg"
       };
+    // Media artifacts are file references — the bytes live in the
+    // workspace.  Copy yields the path; the download action in
+    // ArtifactBlock bypasses this serialisation and uses the
+    // authenticated workspace download URL directly.
+    case "image":
+    case "video":
+      return {
+        text: payload.spec.path,
+        mime: "text/plain",
+        extension: "txt"
+      };
   }
 }
 function tableToCsv(columns, rows) {
@@ -7589,7 +7774,9 @@ var KIND_LABEL = {
   table: "Table",
   chart: "Chart",
   html: "HTML preview",
-  svg: "SVG"
+  svg: "SVG",
+  image: "Generated image",
+  video: "Generated video"
 };
 var COPY_FEEDBACK_MS = 1500;
 function ArtifactBlock({
@@ -7630,6 +7817,18 @@ function ArtifactBlock({
   };
   const handleDownload = () => {
     if (!payload) return;
+    if (payload.kind === "image" || payload.kind === "video") {
+      const a = document.createElement("a");
+      a.href = adapter.getWorkspaceDownloadUrl({
+        sessionId,
+        path: payload.spec.path
+      });
+      a.download = "";
+      document.body.appendChild(a);
+      a.click();
+      document.body.removeChild(a);
+      return;
+    }
     const { text, mime, extension } = exportArtifact(payload);
     downloadText(`${safeFilename(name)}.${extension}`, text, mime);
   };
@@ -7675,20 +7874,21 @@ function ArtifactBlock({
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(ArtifactContent, { className: "p-0 overflow-visible", children: /* @__PURE__ */ jsxRuntime.jsx(ArtifactBody, { error, payload }) })
+      /* @__PURE__ */ jsxRuntime.jsx(ArtifactContent, { className: "p-0 overflow-visible", children: /* @__PURE__ */ jsxRuntime.jsx(ArtifactBody, { error, payload, sessionId }) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: expanded, onOpenChange: setExpanded, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "flex h-[95vh] w-[95vw] max-w-[95vw] flex-col gap-4 overflow-hidden p-6 sm:max-w-[95vw]", children: [
       /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "truncate pr-10", children: name }),
         /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: description })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-0 flex-1 flex-col overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(ArtifactBody, { error, payload, fill: true }) })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-0 flex-1 flex-col overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(ArtifactBody, { error, payload, sessionId, fill: true }) })
     ] }) })
   ] });
 }
 function ArtifactBody({
   error,
   payload,
+  sessionId,
   fill = false
 }) {
   if (error) {
@@ -7714,6 +7914,10 @@ function ArtifactBody({
       return /* @__PURE__ */ jsxRuntime.jsx(ArtifactHtml, { spec: payload.spec, fill });
     case "svg":
       return /* @__PURE__ */ jsxRuntime.jsx(ArtifactSvg, { spec: payload.spec });
+    case "image":
+      return /* @__PURE__ */ jsxRuntime.jsx(ArtifactImage, { sessionId, spec: payload.spec, fill });
+    case "video":
+      return /* @__PURE__ */ jsxRuntime.jsx(ArtifactVideo, { sessionId, spec: payload.spec, fill });
   }
 }
 init_utils();
@@ -8820,13 +9024,17 @@ function cancelledToolLabel(toolName) {
     ask_user_question: "Ask User Question",
     process: "Process",
     create_artifact: "Create artifact",
+    run_coding_agent: "Coding agent",
+    code_run: "Coding agent",
     // ``Research memory`` reads as a noun ("memory of research") and
     // makes the shimmer awkward ("Running Research memory…").  The
     // one-liner renderer shows just ``Research`` as the label, so
     // mirror that here so the live shimmer matches the row that
     // replaces it on completion.
     research_memory: "Research",
-    research_outline: "Research"
+    research_outline: "Research",
+    generate_image: "image generation",
+    generate_video: "video generation"
   };
   if (map[toolName]) return map[toolName];
   if (toolName.startsWith("mcp__")) return formatMcpToolLabel(toolName);
@@ -9114,6 +9322,11 @@ function extractToolDetail(tc) {
     case "consult_expert":
     case "delegate_task":
       return stringArg("name") ?? stringArg("task") ?? stringArg("title");
+    case "run_coding_agent":
+    case "code_run": {
+      const prompt = stringArg("prompt");
+      return prompt ? truncate3(prompt, 60) : null;
+    }
     case "memory":
       return stringArg("action") ?? stringArg("key");
     case "research_memory": {
@@ -9237,7 +9450,9 @@ var _TOOL_ROW_ICON = {
   memory: lucideReact.PenLineIcon,
   todo: lucideReact.ListIcon,
   research_memory: lucideReact.BookOpenIcon,
-  research_outline: lucideReact.ListIcon
+  research_outline: lucideReact.ListIcon,
+  run_coding_agent: lucideReact.BotIcon,
+  code_run: lucideReact.BotIcon
 };
 function _toolRowIcon(toolName) {
   return _TOOL_ROW_ICON[toolName] ?? lucideReact.WrenchIcon;
@@ -9283,6 +9498,13 @@ function _toolRowLabel(tc) {
       return detail ? `Memory ${detail}` : "Updated memory";
     case "todo":
       return detail ? `Todo ${detail}` : "Updated todo list";
+    case "run_coding_agent":
+    case "code_run": {
+      const a = parseArgs(tc.args);
+      const agent = a?.agent ?? (a?.provider === "openai" ? "codex" : a?.provider === "anthropic" ? "claude" : void 0);
+      const name = agent === "codex" ? "Codex" : agent === "claude" ? "Claude Code" : "coding agent";
+      return detail ? `${name}: ${detail}` : `Ran ${name}`;
+    }
     case "research_memory": {
       const args = parseArgs(tc.args);
       const action = args?.action;
@@ -9366,6 +9588,9 @@ function IterationExpanded({
       if (tc.toolName === "todo") {
         return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pr-1", children: /* @__PURE__ */ jsxRuntime.jsx(TodoToolBlock, { tc }) }, tc.id);
       }
+      if (tc.toolName === "code_run") {
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pr-1", children: /* @__PURE__ */ jsxRuntime.jsx(CodeRunToolBlock, { tc, defaultOpen: true }) }, tc.id);
+      }
       return /* @__PURE__ */ jsxRuntime.jsx(SimpleDetailRow, { icon: _toolRowIcon(tc.toolName), children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: _toolRowLabel(tc) }) }, tc.id);
     }),
     showDone && /* @__PURE__ */ jsxRuntime.jsx(SimpleDetailRow, { icon: lucideReact.CircleCheckIcon, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground", children: "Done" }) })
@@ -9692,6 +9917,7 @@ function ChatThread({
   viewMode = "simple",
   onViewModeChange,
   deepResearchEnabled = false,
+  codeAgentsEnabled = false,
   researchSources = [],
   hideTurnSummary = false,
   agentId,
@@ -9756,7 +9982,8 @@ function ChatThread({
         canShowWorkspace,
         viewMode,
         onViewModeChange,
-        deepResearchEnabled
+        deepResearchEnabled,
+        codeAgentsEnabled
       }
     ),
     onOpenIntegrations && /* @__PURE__ */ jsxRuntime.jsx(
@@ -10585,6 +10812,9 @@ var AGENT_CHAT_LISTENED_EVENTS = [
   "expert.failure",
   "expert.endorse",
   "expert.override",
+  "code.run_started",
+  "code.run_progress",
+  "code.run_result",
   "user.feedback",
   "artifact.created",
   "artifact.updated",
@@ -10764,6 +10994,21 @@ function applyAgentChatEvent(state, event) {
         nextState,
         applyExpertFeedback(nextState.messages, event.type, event.data)
       );
+    case "code.run_started":
+      return applyCodeRunStarted(nextState, event);
+    case "code.run_progress":
+      return withMessages(
+        nextState,
+        applyCodeRunProgress(nextState.messages, event.data)
+      );
+    case "code.run_result":
+      return {
+        ...withMessages(
+          nextState,
+          applyCodeRunResult(nextState.messages, event.data)
+        ),
+        isRunning: false
+      };
     case "user.feedback":
       return withMessages(
         nextState,
@@ -11314,6 +11559,141 @@ function applyExpertDelegation(state, event) {
     isRunning: true
   };
 }
+var CODE_RUN_TOOL = "code_run";
+function codeRunFrameId(runId) {
+  return `code-run-${runId}`;
+}
+function parseCodeRunState(raw) {
+  if (raw) {
+    try {
+      const parsed = JSON.parse(raw);
+      return {
+        agent: parsed.agent ?? "",
+        provider: parsed.provider ?? "",
+        prompt: parsed.prompt ?? "",
+        output: parsed.output ?? "",
+        finalMessage: parsed.finalMessage ?? "",
+        error: parsed.error ?? null,
+        inputTokens: parsed.inputTokens ?? 0,
+        outputTokens: parsed.outputTokens ?? 0
+      };
+    } catch {
+    }
+  }
+  return {
+    agent: "",
+    provider: "",
+    prompt: "",
+    output: "",
+    finalMessage: "",
+    error: null,
+    inputTokens: 0,
+    outputTokens: 0
+  };
+}
+function findCodeRunFrame(messages, runId) {
+  const toolId = codeRunFrameId(runId);
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const tc = messages[i]?.toolCalls?.find((c) => c.id === toolId);
+    if (tc) return { msgIdx: i, toolId };
+  }
+  return null;
+}
+function applyCodeRunStarted(state, event) {
+  const runId = stringValue2(event.data.run_id);
+  if (!runId) return state;
+  if (findCodeRunFrame(state.messages, runId)) {
+    return { ...state, terminal: false, isRunning: true };
+  }
+  const agent = stringValue2(event.data.agent);
+  const provider = stringValue2(event.data.provider);
+  const prompt = stringValue2(event.data.prompt);
+  const messages = [...state.messages];
+  const assistantIdx = findLastAssistantIndex(messages);
+  let assistant = assistantIdx >= 0 ? messages[assistantIdx] : null;
+  const userAfterAssistant = assistantIdx >= 0 && hasUserAfterIndex(messages, assistantIdx);
+  if (!assistant || assistant.status === "complete" || userAfterAssistant) {
+    assistant = {
+      id: `evt-${event.eventId}-code-run`,
+      role: "assistant",
+      content: "",
+      createdAt: /* @__PURE__ */ new Date(),
+      status: "streaming"
+    };
+    messages.push(assistant);
+  } else {
+    assistant = { ...assistant };
+    messages[assistantIdx] = assistant;
+  }
+  const frameState = {
+    agent,
+    provider,
+    prompt,
+    output: "",
+    finalMessage: "",
+    error: null,
+    inputTokens: 0,
+    outputTokens: 0
+  };
+  const toolCall = {
+    id: codeRunFrameId(runId),
+    toolName: CODE_RUN_TOOL,
+    args: JSON.stringify({ agent, provider, prompt }),
+    status: "running",
+    result: JSON.stringify(frameState)
+  };
+  assistant.toolCalls = [...assistant.toolCalls ?? [], toolCall];
+  return { ...state, messages, terminal: false, isRunning: true };
+}
+function applyCodeRunProgress(messages, data) {
+  const runId = stringValue2(data.run_id);
+  if (!runId) return messages;
+  const match = findCodeRunFrame(messages, runId);
+  if (!match) return messages;
+  const chunk = stringValue2(data.chunk);
+  if (!chunk) return messages;
+  const next = [...messages];
+  const msg = next[match.msgIdx];
+  next[match.msgIdx] = {
+    ...msg,
+    toolCalls: msg.toolCalls?.map((tc) => {
+      if (tc.id !== match.toolId) return tc;
+      const frame = parseCodeRunState(tc.result);
+      frame.output += chunk;
+      return { ...tc, result: JSON.stringify(frame) };
+    })
+  };
+  return next;
+}
+function applyCodeRunResult(messages, data) {
+  const runId = stringValue2(data.run_id);
+  if (!runId) return messages;
+  const match = findCodeRunFrame(messages, runId);
+  if (!match) return messages;
+  const error = optionalStringValue(data.error) ?? null;
+  const finalMessage = stringValue2(data.final_message);
+  const inputTokens = numberValue(data.input_tokens);
+  const outputTokens = numberValue(data.output_tokens);
+  const next = [...messages];
+  const msg = next[match.msgIdx];
+  next[match.msgIdx] = {
+    ...msg,
+    toolCalls: msg.toolCalls?.map((tc) => {
+      if (tc.id !== match.toolId) return tc;
+      const frame = parseCodeRunState(tc.result);
+      frame.finalMessage = finalMessage;
+      frame.error = error;
+      frame.inputTokens = inputTokens;
+      frame.outputTokens = outputTokens;
+      return {
+        ...tc,
+        status: error ? "error" : "complete",
+        result: JSON.stringify(frame)
+      };
+    })
+  };
+  return next;
+}
 function applyExpertFailure(messages, eventId, data) {
   const match = findLatestConsultExpertCall(messages);
   if (!match) return messages;
@@ -11987,6 +12367,7 @@ function AgentChat({
   disabled,
   onComposerError,
   deepResearchEnabled = false,
+  codeAgentsEnabled = false,
   onOpenIntegrations
 }) {
   const [workspacePath, setWorkspacePath] = react.useState(null);
@@ -12136,6 +12517,7 @@ function AgentChat({
                     viewMode: runtime.viewMode,
                     onViewModeChange: runtime.setViewMode,
                     deepResearchEnabled,
+                    codeAgentsEnabled,
                     researchSources: runtime.researchSources,
                     hideTurnSummary,
                     agentId,
@@ -12422,74 +12804,297 @@ function ToolkitRow({
     ] })
   ] });
 }
-init_utils();
-var DEFAULT_LIMIT = 50;
-function requireInboxAdapter(adapter) {
-  if (!adapter.listInbox || !adapter.getInboxItem || !adapter.markInboxItemRead || !adapter.acknowledgeInboxItem || !adapter.respondGovernanceInboxItem || !adapter.openInboxStream) {
-    throw new Error("Inbox is not supported by this adapter.");
+var PROVIDERS = [
+  {
+    key: "claude",
+    provider: "anthropic",
+    name: "Claude Code",
+    oauthInstructions: "Run `claude setup-token` locally, then paste the `sk-ant-oat...` token it prints to connect your Claude subscription.",
+    apiKeyInstructions: "Paste an Anthropic API key (`sk-ant-...`) to bill usage to your API account instead of a subscription.",
+    oauthPlaceholder: "sk-ant-oat...",
+    apiKeyPlaceholder: "sk-ant-...",
+    validateOauth: (value) => value.startsWith("sk-ant-oat") ? null : "That doesn't look like a setup token \u2014 it should start with `sk-ant-oat`."
+  },
+  {
+    key: "codex",
+    provider: "openai",
+    name: "Codex",
+    oauthInstructions: "Run `codex login` locally, then paste the contents of `~/.codex/auth.json` to connect your ChatGPT plan.",
+    apiKeyInstructions: "Paste an OpenAI API key (`sk-...`) to bill usage to your API account instead of a ChatGPT plan.",
+    oauthPlaceholder: '{"OPENAI_API_KEY": ..., "tokens": { ... }}',
+    apiKeyPlaceholder: "sk-...",
+    validateOauth: (value) => {
+      try {
+        JSON.parse(value);
+        return null;
+      } catch {
+        return "That doesn't look like valid JSON \u2014 paste the whole `~/.codex/auth.json` file.";
+      }
+    }
   }
-  return adapter;
-}
-var KIND_LABEL2 = {
-  input_required: "Input needed",
-  action_required: "Action needed",
-  task_complete: "Task complete",
-  governance_gate: "Approval",
-  progress_checkin: "Progress"
-};
-function kindLabel(kind) {
-  return KIND_LABEL2[kind] ?? kind.replace(/[_-]+/g, " ");
-}
-function statusLabel(status) {
-  return status.split(/[_-]+/).filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
-}
-function formatRelative(value) {
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return "";
-  return dateFns.formatDistanceToNow(date, { addSuffix: true });
-}
-function kindIcon(kind) {
-  if (kind === "input_required") return lucideReact.MessageSquareIcon;
-  if (kind === "action_required") return lucideReact.ExternalLinkIcon;
-  if (kind === "task_complete") return lucideReact.ClipboardCheckIcon;
-  if (kind === "governance_gate") return lucideReact.ShieldAlertIcon;
-  if (kind === "progress_checkin") return lucideReact.TimerIcon;
-  return lucideReact.CircleDotIcon;
-}
-function sortItems(items) {
-  return [...items].sort((a, b) => {
-    if (a.createdAt !== b.createdAt) return a.createdAt > b.createdAt ? -1 : 1;
-    return b.id - a.id;
-  });
-}
-function QuestionInput({
-  prompt,
-  choices,
-  disabled,
-  value,
-  onChange
-}) {
-  if (choices && choices.length > 0) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "select",
+];
+function CodingAgentsPanel({ agentId, adapter, onBack }) {
+  const supported = !!adapter.listCodingAgentConnections && !!adapter.submitCodingAgentCredential && !!adapter.disconnectCodingAgentProvider;
+  const [connections, setConnections] = react.useState([]);
+  const refresh = react.useCallback(async () => {
+    if (!adapter.listCodingAgentConnections) return;
+    const res = await adapter.listCodingAgentConnections({ agentId });
+    setConnections(res.connections);
+  }, [adapter, agentId]);
+  react.useEffect(() => {
+    if (!supported) return;
+    void refresh();
+  }, [supported, refresh]);
+  const byProvider = react.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const c of connections) map.set(c.provider, c);
+    return map;
+  }, [connections]);
+  if (!supported) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-6 p-6", children: [
+    onBack && /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
       {
-        "aria-label": prompt,
-        className: "h-9 w-full border border-line bg-background px-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50",
-        disabled,
-        value,
-        onChange: (event) => onChange(event.target.value),
+        type: "button",
+        onClick: onBack,
+        className: "flex w-fit items-center gap-1.5 text-sm text-muted-foreground hover:text-foreground",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Select" }),
-          choices.map((choice) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: choice.label, children: choice.label }, choice.label))
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeftIcon, { className: "h-4 w-4" }),
+          "Back"
         ]
       }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
-    {
-      "aria-label": prompt,
-      className: "h-9 w-full border border-line bg-background px-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50",
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold text-foreground", children: "Coding agents" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Connect your Claude or ChatGPT plan so the agent can run `/code` on your behalf without separate API billing." })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: PROVIDERS.map((meta) => /* @__PURE__ */ jsxRuntime.jsx(
+      ProviderCard,
+      {
+        meta,
+        connection: byProvider.get(meta.provider) ?? null,
+        adapter,
+        agentId,
+        onChanged: refresh
+      },
+      meta.key
+    )) })
+  ] });
+}
+function ProviderCard({
+  meta,
+  connection,
+  adapter,
+  agentId,
+  onChanged
+}) {
+  const [mode, setMode] = react.useState("oauth");
+  const [value, setValue] = react.useState("");
+  const [busy, setBusy] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const connected = connection?.connected ?? false;
+  const instructions = mode === "oauth" ? meta.oauthInstructions : meta.apiKeyInstructions;
+  const placeholder = mode === "oauth" ? meta.oauthPlaceholder : meta.apiKeyPlaceholder;
+  const submit = async () => {
+    if (!adapter.submitCodingAgentCredential) return;
+    const trimmed = value.trim();
+    setError(null);
+    if (!trimmed) {
+      setError("Paste a value first.");
+      return;
+    }
+    if (mode === "oauth") {
+      const hint = meta.validateOauth(trimmed);
+      if (hint) {
+        setError(hint);
+        return;
+      }
+    }
+    setBusy(true);
+    try {
+      await adapter.submitCodingAgentCredential({
+        agentId,
+        provider: meta.provider,
+        mode,
+        value: trimmed
+      });
+      setValue("");
+      await onChanged();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to save the credential");
+    } finally {
+      setBusy(false);
+    }
+  };
+  const disconnect = async () => {
+    if (!adapter.disconnectCodingAgentProvider) return;
+    setBusy(true);
+    setError(null);
+    try {
+      await adapter.disconnectCodingAgentProvider({ agentId, provider: meta.provider });
+      await onChanged();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to disconnect");
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "flex flex-col gap-3 rounded-lg border border-border p-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-base font-semibold text-foreground", children: meta.name }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: `inline-flex items-center rounded px-1.5 py-0.5 text-xs font-semibold ${connected ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"}`,
+          children: connected ? `Connected${connection?.auth_mode === "api_key" ? " (API key)" : ""}` : "Not connected"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1 text-xs", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setMode("oauth");
+            setError(null);
+          },
+          className: `rounded-md border px-2 py-1 ${mode === "oauth" ? "border-primary bg-primary/10 text-primary" : "border-border text-muted-foreground hover:bg-accent"}`,
+          children: "Subscription"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setMode("api_key");
+            setError(null);
+          },
+          className: `rounded-md border px-2 py-1 ${mode === "api_key" ? "border-primary bg-primary/10 text-primary" : "border-border text-muted-foreground hover:bg-accent"}`,
+          children: "API key"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: instructions }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        value,
+        onChange: (e) => setValue(e.target.value),
+        placeholder,
+        spellCheck: false,
+        autoComplete: "off",
+        rows: mode === "oauth" && meta.provider === "openai" ? 4 : 2,
+        "aria-label": `${meta.name} credential`,
+        className: "w-full resize-y rounded-md border border-border bg-background px-3 py-2 font-mono text-xs [-webkit-text-security:disc]"
+      }
+    ),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "alert", className: "text-xs text-red-500", children: error }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          disabled: busy,
+          onClick: submit,
+          className: "inline-flex items-center justify-center gap-1.5 rounded-md border border-border px-3 py-1.5 text-xs text-foreground hover:bg-accent disabled:opacity-60",
+          children: [
+            busy && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2Icon, { className: "h-3.5 w-3.5 animate-spin" }),
+            connected ? "Update" : "Connect"
+          ]
+        }
+      ),
+      connected && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          disabled: busy,
+          onClick: disconnect,
+          className: "inline-flex items-center justify-center rounded-md border border-border px-3 py-1.5 text-xs text-muted-foreground hover:bg-accent disabled:opacity-60",
+          children: "Disconnect"
+        }
+      )
+    ] })
+  ] });
+}
+init_utils();
+var DEFAULT_LIMIT = 50;
+function requireInboxAdapter(adapter) {
+  if (!adapter.listInbox || !adapter.getInboxItem || !adapter.markInboxItemRead || !adapter.acknowledgeInboxItem || !adapter.respondGovernanceInboxItem || !adapter.openInboxStream) {
+    throw new Error("Inbox is not supported by this adapter.");
+  }
+  return adapter;
+}
+var KIND_LABEL2 = {
+  input_required: "Input needed",
+  action_required: "Action needed",
+  task_complete: "Task complete",
+  governance_gate: "Approval",
+  progress_checkin: "Progress"
+};
+function kindLabel(kind) {
+  return KIND_LABEL2[kind] ?? kind.replace(/[_-]+/g, " ");
+}
+function statusLabel(status) {
+  return status.split(/[_-]+/).filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
+}
+function formatRelative(value) {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return "";
+  return dateFns.formatDistanceToNow(date, { addSuffix: true });
+}
+function kindIcon(kind) {
+  if (kind === "input_required") return lucideReact.MessageSquareIcon;
+  if (kind === "action_required") return lucideReact.ExternalLinkIcon;
+  if (kind === "task_complete") return lucideReact.ClipboardCheckIcon;
+  if (kind === "governance_gate") return lucideReact.ShieldAlertIcon;
+  if (kind === "progress_checkin") return lucideReact.TimerIcon;
+  return lucideReact.CircleDotIcon;
+}
+function sortItems(items) {
+  return [...items].sort((a, b) => {
+    if (a.createdAt !== b.createdAt) return a.createdAt > b.createdAt ? -1 : 1;
+    return b.id - a.id;
+  });
+}
+function InboxBody({ body, muted }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    MessageResponse,
+    {
+      className: cn("text-sm", muted && "text-muted-foreground"),
+      children: body
+    }
+  );
+}
+function QuestionInput({
+  prompt,
+  choices,
+  disabled,
+  value,
+  onChange
+}) {
+  if (choices && choices.length > 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "select",
+      {
+        "aria-label": prompt,
+        className: "h-9 w-full border border-line bg-background px-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50",
+        disabled,
+        value,
+        onChange: (event) => onChange(event.target.value),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Select" }),
+          choices.map((choice) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: choice.label, children: choice.label }, choice.label))
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "input",
+    {
+      "aria-label": prompt,
+      className: "h-9 w-full border border-line bg-background px-2 text-sm text-foreground outline-none focus:border-primary disabled:opacity-50",
       disabled,
       value,
       onChange: (event) => onChange(event.target.value)
@@ -12585,7 +13190,7 @@ function InputRequiredDetail({
     }
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-    item.body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm text-muted-foreground", children: item.body }),
+    item.body && /* @__PURE__ */ jsxRuntime.jsx(InboxBody, { body: item.body, muted: true }),
     questions.map((question) => /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "block space-y-1.5", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: question.prompt }),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -12638,7 +13243,7 @@ function AckDetail({
   const duration = typeof item.payload.duration_seconds === "number" ? item.payload.duration_seconds : null;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
     outcome && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: outcome }),
-    item.body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm", children: item.body }),
+    item.body && /* @__PURE__ */ jsxRuntime.jsx(InboxBody, { body: item.body }),
     typeof item.payload.error === "string" && /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "overflow-x-auto bg-destructive/10 p-3 text-xs text-destructive", children: item.payload.error }),
     duration !== null && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
       "Duration: ",
@@ -12752,7 +13357,7 @@ function ActionRequiredDetail({
     }
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-    item.body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm", children: item.body }),
+    item.body && /* @__PURE__ */ jsxRuntime.jsx(InboxBody, { body: item.body }),
     context && context !== item.body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm text-muted-foreground", children: context }),
     actionType && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: actionType }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -12801,7 +13406,7 @@ function ProgressDetail({
     }
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
-    item.body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm", children: item.body }),
+    item.body && /* @__PURE__ */ jsxRuntime.jsx(InboxBody, { body: item.body }),
     rows.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "space-y-1 text-xs text-muted-foreground", children: rows.map(([label, value]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "w-20 shrink-0", children: String(label) }),
       /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "min-w-0", children: String(value) })
@@ -13122,6 +13727,45 @@ function Card({
     }
   );
 }
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-header",
+      className: cn(
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1.5 rounded-none px-8 group-data-[size=sm]/card:px-5 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-8 group-data-[size=sm]/card:[.border-b]:pb-5",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-title",
+      className: cn(
+        "font-heading text-lg font-semibold tracking-wider uppercase",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardAction({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "card-action",
+      className: cn(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
 function CardContent({ className, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -13178,111 +13822,793 @@ function truncate4(s, max) {
   if (s.length <= max) return s;
   return `${s.slice(0, max - 1)}\u2026`;
 }
-var DEFAULT_POLL_INTERVAL_MS = 5e3;
-var MISSION_WORKER_KIND_BADGE_CLASS = {
-  task: "border-primary/40 bg-primary/10 text-primary uppercase tracking-wide text-[10px]",
-  worker: "border-foreground/30 bg-foreground/5 text-foreground/80 uppercase tracking-wide text-[10px]",
-  delegation: "border-foreground/20 bg-foreground/[0.03] text-foreground/60 uppercase tracking-wide text-[10px]"
-};
-var MISSION_WORKER_KIND_TOOLTIP = {
-  task: "Durable Task row created by spawn_task. Retried by the dispatcher; survives across coordinator wakes.",
-  worker: "Async one-shot session spawned by spawn_worker. Durable session, no retry/DAG.",
-  delegation: "Sync fork-join child spawned by delegate_task. Coordinator's wake blocked until it finished."
-};
-function CountBadge({ n }) {
-  if (n === 0) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 rounded bg-muted px-1 py-px text-[9px] text-muted-foreground/70", children: n });
-}
-function firstLine3(text, max = 140) {
-  const trimmed = text.replace(/\s+/g, " ").trim();
-  if (trimmed.length <= max) return trimmed;
-  return `${trimmed.slice(0, max).trimEnd()}\u2026`;
-}
-var ACTIVITY_KIND_TONE = {
-  "mission.defined": "bg-primary/10 text-primary border-primary/30",
-  "mission.paused": "bg-amber-500/10 text-amber-600 border-amber-500/30",
-  "mission.cancelled": "bg-destructive/10 text-destructive border-destructive/30",
-  "task.spawned": "bg-foreground/5 text-foreground/80 border-foreground/20",
-  "task.completed": "bg-emerald-500/10 text-emerald-600 border-emerald-500/30",
-  "task.failed": "bg-destructive/10 text-destructive border-destructive/30",
-  "task.cancelled": "bg-muted text-muted-foreground border-border",
-  "worker.latest": "bg-foreground/5 text-foreground/70 border-foreground/15",
-  "evaluator.verdict": "bg-primary/10 text-primary border-primary/30"
-};
-function buildMissionActivity(mission, tasks, workers) {
-  const entries = [];
-  entries.push({
-    at: mission.createdAt,
-    kind: "mission.defined",
-    label: "Mission defined",
-    detail: mission.description
-  });
-  if (mission.status === "paused" && mission.pausedReason) {
-    entries.push({
-      at: mission.updatedAt,
-      kind: "mission.paused",
-      label: "Paused",
-      detail: mission.pausedReason
-    });
-  }
-  if (mission.status === "cancelled" && mission.cancelledReason) {
-    entries.push({
-      at: mission.updatedAt,
-      kind: "mission.cancelled",
-      label: "Cancelled",
-      detail: mission.cancelledReason
-    });
+var MISSION_EVENT_CATEGORIES = [
+  "spawn",
+  "output",
+  "done",
+  "verdict",
+  "system"
+];
+function missionEventCategory(type) {
+  switch (type) {
+    case "worker.spawned":
+      return "spawn";
+    case "iteration.summary":
+      return "output";
+    case "worker.complete":
+      return "done";
+    case "mission.evaluation.end":
+      return "verdict";
+    default:
+      return "system";
   }
-  for (const task of tasks) {
-    if (task.createdAt) {
-      entries.push({
-        at: task.createdAt,
-        kind: "task.spawned",
-        label: `Spawn \xB7 ${task.agentDefName ?? "task"}`,
-        detail: firstLine3(task.goal, 200)
-      });
-    }
-    if (task.completedAt) {
-      const kind = task.status === "done" ? "task.completed" : task.status === "failed" ? "task.failed" : task.status === "cancelled" ? "task.cancelled" : "task.completed";
-      entries.push({
-        at: task.completedAt,
-        kind,
-        label: `${task.status} \xB7 ${task.agentDefName ?? "task"}`,
-        detail: task.result ? firstLine3(task.result, 200) : void 0
-      });
+}
+function dataString(data, key) {
+  const v = data?.[key];
+  return typeof v === "string" && v.trim().length > 0 ? v.trim() : null;
+}
+var CONTROL_MARKUP_RE = /<next_action\b[^>]*(?:\/>|>[\s\S]*?<\/next_action>)/gi;
+function stripMissionControlMarkup(text) {
+  return text.replace(CONTROL_MARKUP_RE, "").trim();
+}
+function missionEventSummary(event) {
+  return stripMissionControlMarkup(rawMissionEventSummary(event));
+}
+function rawMissionEventSummary(event) {
+  const d = event.data ?? null;
+  switch (event.type) {
+    case "worker.spawned":
+      return dataString(d, "goal") ?? "Task spawned";
+    case "worker.complete":
+      return dataString(d, "result") ?? "Worker complete";
+    case "iteration.summary":
+      return dataString(d, "summary") ?? "";
+    case "mission.evaluation.end": {
+      const result = dataString(d, "result");
+      const feedback = dataString(d, "feedback") ?? dataString(d, "explanation");
+      if (result && feedback) return `${result} \u2014 ${feedback}`;
+      return result ?? feedback ?? "Evaluation finished";
+    }
+    case "task.blocked":
+      return dataString(d, "reason") ?? "Task blocked";
+    case "task.failed":
+      return "Task failed";
+    default: {
+      const text = dataString(d, "summary") ?? dataString(d, "text") ?? dataString(d, "message") ?? dataString(d, "reason");
+      if (text) return text;
+      if (!d) return "";
+      try {
+        return truncate4(JSON.stringify(d), 160);
+      } catch {
+        return "";
+      }
     }
   }
-  for (const worker of workers) {
-    if (worker.latestEventAt && worker.latestEventKind) {
-      entries.push({
-        at: worker.latestEventAt,
-        kind: "worker.latest",
-        label: `${worker.kind} \xB7 ${worker.latestEventKind}`,
-        detail: deriveMissionWorkerActivityLabel(worker)
-      });
+}
+function missionEventTaskId(event, sessions) {
+  return dataString(event.data ?? null, "task_id") ?? sessions[event.sessionId]?.taskId ?? null;
+}
+function missionEventActorLabel(event, sessions) {
+  const meta = sessions[event.sessionId];
+  if (!meta) return event.sessionId.slice(0, 8);
+  if (meta.kind === "coordinator") return "orchestrator";
+  return meta.agentDefName ?? "worker";
+}
+function missionTaskBlocks(tasks) {
+  const blocks = {};
+  for (const t of tasks) {
+    for (const parent of t.parentIds) {
+      (blocks[parent] ?? (blocks[parent] = [])).push(t.id);
     }
   }
-  if (mission.lastEvaluationAt && mission.lastEvaluationResult) {
-    entries.push({
-      at: mission.lastEvaluationAt,
-      kind: "evaluator.verdict",
-      label: `Verdict \xB7 ${mission.lastEvaluationResult}`,
-      detail: mission.lastEvaluationFeedback ?? void 0
-    });
-  }
-  entries.sort((a, b) => b.at.localeCompare(a.at));
-  return entries;
+  return blocks;
 }
-function formatTimestamp(iso) {
-  try {
-    return new Date(iso).toLocaleTimeString();
-  } catch {
-    return iso;
+function missionTaskTitle(goal, max = 80) {
+  const line = goal.split("\n").find((l) => l.trim().length > 0)?.trim() ?? goal.trim();
+  return truncate4(line.replace(/\s+/g, " "), max);
+}
+var RAIL_GROUP_DEFS = [
+  { key: "running", label: "Running", match: (s) => s === "running" },
+  { key: "blocked", label: "Blocked", match: (s) => s === "blocked" },
+  {
+    key: "queued",
+    label: "Queued",
+    match: (s) => s === "ready" || s === "todo"
+  },
+  { key: "done", label: "Done", match: (s) => s === "done" },
+  {
+    key: "failed",
+    label: "Failed / cancelled",
+    match: (s) => s === "failed" || s === "cancelled"
+  }
+];
+function missionTaskRailGroups(tasks) {
+  const grouped = /* @__PURE__ */ new Set();
+  const groups = RAIL_GROUP_DEFS.map((def) => ({
+    key: def.key,
+    label: def.label,
+    tasks: tasks.filter((t) => {
+      const hit = def.match(t.status);
+      if (hit) grouped.add(t.id);
+      return hit;
+    })
+  }));
+  const stray = tasks.filter((t) => !grouped.has(t.id));
+  if (stray.length > 0) {
+    const queued = groups.find((g) => g.key === "queued");
+    if (queued) queued.tasks.push(...stray);
   }
+  return groups.filter((g) => g.tasks.length > 0);
 }
-var INITIAL_STATE = {
-  mission: null,
-  tasks: [],
+var TERMINAL_TASK_STATUSES = /* @__PURE__ */ new Set(["done", "failed", "cancelled"]);
+function defaultSelectedMissionTaskId(tasks) {
+  if (tasks.length === 0) return null;
+  const ordered = missionTaskRailGroups(tasks).flatMap((g) => g.tasks);
+  const firstLive = ordered.find(
+    (t) => !TERMINAL_TASK_STATUSES.has(t.status)
+  );
+  return (firstLive ?? ordered[0] ?? tasks[0]).id;
+}
+function mergeMissionEvents(existing, incoming) {
+  if (incoming.length === 0) return existing;
+  const byId = /* @__PURE__ */ new Map();
+  for (const e of existing) byId.set(e.id, e);
+  for (const e of incoming) byId.set(e.id, e);
+  return [...byId.values()].sort((a, b) => a.id - b.id);
+}
+function missionTaskStatusDotClass(status) {
+  switch (status) {
+    case "running":
+      return "bg-primary";
+    case "blocked":
+      return "bg-amber-500";
+    case "done":
+      return "bg-emerald-500";
+    case "failed":
+      return "bg-destructive";
+    case "cancelled":
+      return "bg-muted-foreground";
+    default:
+      return "bg-foreground/30";
+  }
+}
+function missionWorkerTaskCounts(worker, tasks) {
+  if (worker.kind !== "task") return null;
+  const mine = tasks.filter((t) => t.agentDefName === worker.agentDefName);
+  return {
+    completed: mine.filter((t) => t.status === "done").length,
+    inFlight: mine.filter(
+      (t) => t.status === "running" || t.status === "blocked"
+    ).length
+  };
+}
+function formatMissionTimestamp(iso) {
+  if (!iso) return "";
+  const parsed = new Date(iso);
+  if (Number.isNaN(parsed.getTime())) return iso;
+  return parsed.toLocaleTimeString();
+}
+var CATEGORY_BADGE_CLASS = {
+  spawn: "border-primary/30 bg-primary/10 text-primary",
+  output: "border-foreground/20 bg-foreground/5 text-foreground/80",
+  done: "border-emerald-500/30 bg-emerald-500/10 text-emerald-600",
+  verdict: "border-amber-500/30 bg-amber-500/10 text-amber-600",
+  system: "border-border bg-muted text-muted-foreground"
+};
+function MissionActivityTab({ feed }) {
+  const [filter, setFilter] = react.useState("all");
+  const rows = react.useMemo(() => {
+    const newestFirst = [...feed.events].reverse();
+    if (filter === "all") return newestFirst;
+    return newestFirst.filter((e) => missionEventCategory(e.type) === filter);
+  }, [feed.events, filter]);
+  if (feed.events.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No mission activity yet." });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-1.5", children: ["all", ...MISSION_EVENT_CATEGORIES].map((cat) => /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setFilter(cat),
+        className: `rounded-full border px-2.5 py-0.5 font-mono text-[10px] uppercase tracking-wide transition-colors ${filter === cat ? "border-foreground bg-foreground text-background" : "border-border/60 bg-background text-muted-foreground hover:bg-muted/40"}`,
+        children: cat
+      },
+      cat
+    )) }),
+    /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "space-y-1", children: rows.map((e) => /* @__PURE__ */ jsxRuntime.jsx(ActivityRow, { event: e, feed }, e.id)) })
+  ] });
+}
+function ActivityRow({
+  event,
+  feed
+}) {
+  const category = missionEventCategory(event.type);
+  const taskId = missionEventTaskId(event, feed.sessions);
+  return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-3 rounded px-2 py-1.5 text-sm hover:bg-muted/30", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-20 shrink-0 font-mono text-[10px] text-muted-foreground/60", children: formatMissionTimestamp(event.createdAt) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-0.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: `shrink-0 rounded border px-1.5 font-mono uppercase ${CATEGORY_BADGE_CLASS[category]}`,
+            children: category
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "shrink-0 text-xs text-foreground font-mono", children: missionEventActorLabel(event, feed.sessions) }),
+        taskId ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "shrink-0 rounded bg-muted px-1.5 py-0.5 font-mono text-[9px] text-muted-foreground/70", children: taskId.slice(0, 8) }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "min-w-0 flex-1 truncate text-foreground/80", children: missionEventSummary(event) }) })
+    ] })
+  ] });
+}
+function verdictToneClass(result) {
+  if (result === "satisfied") {
+    return "border-emerald-500/30 bg-emerald-500/5 text-emerald-700 dark:text-emerald-400";
+  }
+  if (result === "failed" || result === "blocked") {
+    return "border-destructive/30 bg-destructive/5 text-destructive";
+  }
+  return "border-amber-500/30 bg-amber-500/5 text-amber-700 dark:text-amber-400";
+}
+function MissionMetadataTab({ mission }) {
+  const rows = [
+    {
+      label: "Mission ID",
+      value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.id })
+    },
+    {
+      label: "Session ID",
+      value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.sessionId })
+    },
+    {
+      label: "Agent ID",
+      value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.agentId })
+    },
+    { label: "Status", value: mission.status },
+    {
+      label: "Iteration",
+      value: `${mission.iteration} / ${mission.maxIterations}`
+    },
+    {
+      label: "Owner",
+      value: mission.userId ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        "user ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.userId })
+      ] }) : mission.serviceAccountId ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        "service account",
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.serviceAccountId })
+      ] }) : "\u2014"
+    },
+    {
+      label: "Created",
+      value: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[11px]", children: new Date(mission.createdAt).toLocaleString() })
+    },
+    {
+      label: "Updated",
+      value: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[11px]", children: new Date(mission.updatedAt).toLocaleString() })
+    }
+  ];
+  if (mission.pausedReason) {
+    rows.push({ label: "Paused reason", value: mission.pausedReason });
+  }
+  if (mission.cancelledReason) {
+    rows.push({ label: "Cancelled reason", value: mission.cancelledReason });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
+    mission.lastEvaluationResult ? /* @__PURE__ */ jsxRuntime.jsxs(
+      "section",
+      {
+        className: `space-y-2 rounded-md border p-4 ${verdictToneClass(mission.lastEvaluationResult)}`,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "font-mono text-[10px] uppercase tracking-widest", children: [
+            "Last verdict \u2014 ",
+            mission.lastEvaluationResult
+          ] }),
+          mission.lastEvaluationFeedback ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm font-medium text-foreground/90", children: mission.lastEvaluationFeedback }) : null,
+          mission.lastEvaluationExplanation ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-xs text-muted-foreground/80", children: mission.lastEvaluationExplanation }) : null,
+          mission.lastEvaluationAt ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-mono text-[10px] text-muted-foreground/60", children: new Date(mission.lastEvaluationAt).toLocaleString() }) : null
+        ]
+      }
+    ) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Identifiers" }),
+      /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "grid grid-cols-[max-content_1fr] gap-x-4 gap-y-1 text-xs", children: rows.map((r) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground/70", children: r.label }),
+        /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "break-all text-foreground/90", children: r.value })
+      ] }, r.label)) })
+    ] })
+  ] });
+}
+var TASK_STATUS_BADGE_CLASS = {
+  running: "border-primary/30 bg-primary/10 text-primary",
+  blocked: "border-amber-500/30 bg-amber-500/10 text-amber-600",
+  done: "border-emerald-500/30 bg-emerald-500/10 text-emerald-600",
+  failed: "border-destructive/30 bg-destructive/10 text-destructive",
+  cancelled: "border-border bg-muted text-muted-foreground"
+};
+function statusBadgeClass(status) {
+  return TASK_STATUS_BADGE_CLASS[status] ?? "border-foreground/20 bg-foreground/5 text-foreground/70";
+}
+function TaskChip({
+  task,
+  onSelect
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      "data-task-chip": true,
+      onClick: () => onSelect(task.id),
+      className: "inline-flex max-w-full items-center gap-1.5 rounded-full border border-border/60 bg-background px-2.5 py-1 text-xs hover:bg-muted/40",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: `size-1.5 shrink-0 rounded-full ${missionTaskStatusDotClass(task.status)}`
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-foreground/85", children: missionTaskTitle(task.goal, 40) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 font-mono text-[9px] text-muted-foreground/60", children: task.id.slice(0, 8) })
+      ]
+    }
+  );
+}
+function TaskRailRow({
+  task,
+  selected,
+  onSelect
+}) {
+  const preview = stripMissionControlMarkup(
+    task.status === "done" && task.result ? task.result : task.goal
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: () => onSelect(task.id),
+      className: `w-full rounded-md border px-3 py-2 text-left text-sm transition-colors ${selected ? "border-primary/40 bg-primary/5" : "border-transparent hover:bg-muted/40"}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: `size-2 shrink-0 rounded-full ${missionTaskStatusDotClass(task.status)}`
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate font-medium text-foreground/90", children: task.goal })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex flex-col gap-2 pl-4", children: [
+          task.agentDefName ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-xs font-mono text-muted-foreground", children: task.agentDefName }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "line-clamp-2 min-w-0 flex-1 text-xs text-muted-foreground/70", children: preview })
+        ] })
+      ]
+    }
+  );
+}
+function MissionTasksTab({
+  tasks,
+  feed,
+  onOpenTranscript
+}) {
+  const [selectedId, setSelectedId] = react.useState(null);
+  const groups = react.useMemo(() => missionTaskRailGroups(tasks), [tasks]);
+  const blocks = react.useMemo(() => missionTaskBlocks(tasks), [tasks]);
+  const byId = react.useMemo(() => new Map(tasks.map((t) => [t.id, t])), [tasks]);
+  const effectiveId = selectedId && byId.has(selectedId) ? selectedId : defaultSelectedMissionTaskId(tasks);
+  const selected = effectiveId ? byId.get(effectiveId) ?? null : null;
+  const taskEvents = react.useMemo(() => {
+    if (!selected || !feed.supported) return [];
+    return feed.events.filter(
+      (e) => missionEventTaskId(e, feed.sessions) === selected.id
+    );
+  }, [selected, feed]);
+  const liveOutput = react.useMemo(() => {
+    if (!selected || selected.status !== "running") return null;
+    const outputs = taskEvents.filter(
+      (e) => missionEventCategory(e.type) === "output"
+    );
+    return outputs.length > 0 ? outputs[outputs.length - 1] : null;
+  }, [selected, taskEvents]);
+  if (tasks.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No tasks spawned yet." });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full min-h-0 gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-72 shrink-0 space-y-4 overflow-y-auto pr-1", children: groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-1 px-1 font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: [
+        group.label,
+        " (",
+        group.tasks.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: group.tasks.map((t) => /* @__PURE__ */ jsxRuntime.jsx(
+        TaskRailRow,
+        {
+          task: t,
+          selected: t.id === effectiveId,
+          onSelect: setSelectedId
+        },
+        t.id
+      )) })
+    ] }, group.key)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        "data-testid": "task-detail",
+        className: "min-w-0 flex-1 space-y-4 overflow-y-auto bg-card px-8 py-5",
+        children: selected ? /* @__PURE__ */ jsxRuntime.jsx(
+          TaskDetail,
+          {
+            task: selected,
+            allTasks: byId,
+            blockedTaskIds: blocks[selected.id] ?? [],
+            taskEvents,
+            liveOutput,
+            eventsSupported: feed.supported,
+            onSelect: setSelectedId,
+            onOpenTranscript
+          }
+        ) : null
+      }
+    )
+  ] });
+}
+function TaskDetail({
+  task,
+  allTasks,
+  blockedTaskIds,
+  taskEvents,
+  liveOutput,
+  eventsSupported,
+  onSelect,
+  onOpenTranscript
+}) {
+  const parents = task.parentIds.map((id) => allTasks.get(id)).filter((t) => Boolean(t));
+  const children = blockedTaskIds.map((id) => allTasks.get(id)).filter((t) => Boolean(t));
+  const timeLabel = task.startedAt && task.completedAt ? `${formatMissionTimestamp(task.startedAt)} \u2192 ${formatMissionTimestamp(task.completedAt)}` : task.startedAt ? `started ${formatMissionTimestamp(task.startedAt)}` : "not started";
+  const outcome = deriveTaskOutcome({ task, taskEvents, liveOutput, parents });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "min-w-0 flex-1 truncate text-lg font-semibold text-foreground", children: missionTaskTitle(task.goal) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 font-mono text-[10px] text-muted-foreground/60", children: task.id.slice(0, 8) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2 text-xs", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Badge,
+          {
+            variant: "destructive",
+            className: `font-mono text-sm uppercase tracking-wide ${statusBadgeClass(task.status)}`,
+            children: task.status
+          }
+        ),
+        task.agentDefName ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: task.agentDefName }) : null,
+        task.attemptCount > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground", children: [
+          "attempts ",
+          task.attemptCount,
+          "/",
+          task.maxAttempts
+        ] }) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-auto inline-flex items-center gap-1 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "size-3" }),
+          timeLabel
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(OutcomeCard, { outcome }),
+    parents.length > 0 || children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Dependencies" }),
+      parents.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-1 text-[10px] uppercase text-muted-foreground/50", children: "Depends on" }),
+        parents.map((p) => /* @__PURE__ */ jsxRuntime.jsx(TaskChip, { task: p, onSelect }, p.id))
+      ] }) : null,
+      children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-1 text-[10px] uppercase text-muted-foreground/50", children: "Blocks" }),
+        children.map((c) => /* @__PURE__ */ jsxRuntime.jsx(TaskChip, { task: c, onSelect }, c.id))
+      ] }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Brief" }),
+      /* @__PURE__ */ jsxRuntime.jsx(MessageResponse, { className: "text-sm leading-relaxed text-foreground/90", children: task.goal })
+    ] }),
+    task.resultMetadata ? /* @__PURE__ */ jsxRuntime.jsxs("details", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("summary", { className: "cursor-pointer font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Result metadata" }),
+      /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "mt-1 max-h-64 overflow-auto whitespace-pre-wrap rounded bg-muted/30 px-2 py-1.5 text-[11px] text-foreground/90", children: JSON.stringify(task.resultMetadata, null, 2) })
+    ] }) : null,
+    eventsSupported && taskEvents.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 font-mono font-semibold uppercase text-muted-foreground", children: [
+        "History (",
+        taskEvents.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "space-y-3", children: taskEvents.map((e) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-3 text-xs", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-16 shrink-0 font-mono text-[10px] text-muted-foreground/60", children: formatMissionTimestamp(e.createdAt) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "shrink-0 font-mono uppercase text-muted-foreground", children: missionEventCategory(e.type) }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "min-w-0 flex-1 text-foreground/80", children: missionEventSummary(e) })
+        ] })
+      ] }, e.id)) })
+    ] }) : null,
+    task.currentSessionId && onOpenTranscript ? /* @__PURE__ */ jsxRuntime.jsxs(
+      Button,
+      {
+        "data-testid": "view-session",
+        variant: "outline",
+        size: "sm",
+        onClick: () => onOpenTranscript(task.currentSessionId),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-4" }),
+          "View ",
+          task.agentDefName ?? "worker",
+          " session"
+        ]
+      }
+    ) : null
+  ] });
+}
+function deriveTaskOutcome({
+  task,
+  taskEvents,
+  liveOutput,
+  parents
+}) {
+  const result = task.result ? stripMissionControlMarkup(task.result) : "";
+  switch (task.status) {
+    case "done":
+      return {
+        label: "Result",
+        tone: "bg-emerald-500/5 ring-emerald-500/25",
+        labelTone: "text-emerald-600",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "size-3" }),
+        timestamp: task.completedAt,
+        markdown: result || void 0,
+        text: result ? void 0 : "Completed."
+      };
+    case "failed":
+      return {
+        label: "Failed",
+        tone: "bg-destructive/5 ring-destructive/25",
+        labelTone: "text-destructive",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XCircle, { className: "size-3" }),
+        timestamp: task.completedAt,
+        markdown: result || void 0,
+        text: result ? void 0 : `Failed after ${task.attemptCount}/${task.maxAttempts} attempts.`
+      };
+    case "cancelled":
+      return {
+        label: "Cancelled",
+        tone: "bg-muted/40 ring-border",
+        labelTone: "text-muted-foreground",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Ban, { className: "size-3" }),
+        timestamp: task.completedAt,
+        text: "Task cancelled."
+      };
+    case "running":
+      return {
+        label: "Live output",
+        tone: "bg-amber-500/5 ring-amber-500/25",
+        labelTone: "text-amber-600",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleDot, { className: "size-3 animate-pulse" }),
+        timestamp: liveOutput?.createdAt ?? null,
+        text: liveOutput ? missionEventSummary(liveOutput) : "Working \u2014 no output yet."
+      };
+    case "blocked": {
+      const blockedEvent = [...taskEvents].reverse().find((e) => e.type === "task.blocked");
+      return {
+        label: "Waiting",
+        tone: "bg-amber-500/5 ring-amber-500/20",
+        labelTone: "text-amber-700 dark:text-amber-500",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "size-3" }),
+        timestamp: blockedEvent?.createdAt ?? null,
+        text: blockedEvent ? missionEventSummary(blockedEvent) : "Blocked \u2014 awaiting input."
+      };
+    }
+    default: {
+      const pending = parents.filter((p) => p.status !== "done");
+      const text = pending.length > 0 ? `Waiting on ${pending.map((p) => missionTaskTitle(p.goal, 40)).join(" \xB7 ")} to complete.` : "Queued \u2014 waiting for a worker slot.";
+      return {
+        label: "Waiting",
+        tone: "bg-muted/30 ring-border",
+        labelTone: "text-muted-foreground",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "size-3" }),
+        timestamp: null,
+        text
+      };
+    }
+  }
+}
+function OutcomeCard({ outcome }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Card,
+    {
+      "data-testid": "task-outcome",
+      size: "sm",
+      className: `mx-1 gap-3 rounded-lg py-4 shadow-none ${outcome.tone}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(CardHeader, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            CardTitle,
+            {
+              className: `flex items-center gap-1.5 font-mono text-[11px] font-semibold tracking-widest ${outcome.labelTone}`,
+              children: [
+                outcome.icon,
+                outcome.label
+              ]
+            }
+          ),
+          outcome.timestamp ? /* @__PURE__ */ jsxRuntime.jsx(CardAction, { className: "font-mono text-[10px] text-muted-foreground/60", children: formatMissionTimestamp(outcome.timestamp) }) : null
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: outcome.markdown ? /* @__PURE__ */ jsxRuntime.jsx(MessageResponse, { className: "font-mono text-xs leading-relaxed text-foreground/90", children: outcome.markdown }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap font-mono text-xs leading-relaxed text-foreground/90", children: outcome.text }) })
+      ]
+    }
+  );
+}
+var MISSION_WORKER_KIND_BADGE_CLASS = {
+  task: "border-primary/40 bg-primary/10 text-primary uppercase tracking-wide text-[10px]",
+  worker: "border-foreground/30 bg-foreground/5 text-foreground/80 uppercase tracking-wide text-[10px]",
+  delegation: "border-foreground/20 bg-foreground/[0.03] text-foreground/60 uppercase tracking-wide text-[10px]"
+};
+var MISSION_WORKER_KIND_TOOLTIP = {
+  task: "Durable Task row created by spawn_task. Retried by the dispatcher; survives across coordinator wakes.",
+  worker: "Async one-shot session spawned by spawn_worker. Durable session, no retry/DAG.",
+  delegation: "Sync fork-join child spawned by delegate_task. Coordinator's wake blocked until it finished."
+};
+function MissionWorkersTab({
+  workers,
+  tasks,
+  onOpenTranscript
+}) {
+  if (workers.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No workers attached to this mission right now." });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3 sm:grid-cols-2", children: workers.map((w) => /* @__PURE__ */ jsxRuntime.jsx(
+    WorkerCard,
+    {
+      worker: w,
+      tasks,
+      onOpenTranscript
+    },
+    w.workerSessionId
+  )) });
+}
+function WorkerCard({
+  worker,
+  tasks,
+  onOpenTranscript
+}) {
+  const counts = missionWorkerTaskCounts(worker, tasks);
+  const statusLabel2 = worker.kind === "task" ? worker.taskStatus ?? "\u2014" : worker.sessionStatus;
+  const onTranscriptClick = (e) => {
+    if (onOpenTranscript) {
+      e.preventDefault();
+      onOpenTranscript(worker.workerSessionId);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 rounded-md border border-border/60 bg-card p-4 shadow-sm", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-semibold text-foreground", children: worker.agentDefName ?? "worker" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            Badge,
+            {
+              variant: "outline",
+              className: `mt-1 ${MISSION_WORKER_KIND_BADGE_CLASS[worker.kind]}`,
+              children: worker.kind
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { className: "max-w-xs", children: MISSION_WORKER_KIND_TOOLTIP[worker.kind] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 font-mono text-[10px] uppercase tracking-wider text-muted-foreground/70", children: statusLabel2 })
+    ] }),
+    counts ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xl font-bold tabular-nums text-foreground", children: counts.completed }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-[9px] uppercase tracking-widest text-muted-foreground/60", children: "Completed" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: `text-xl font-bold tabular-nums ${counts.inFlight > 0 ? "text-amber-600" : "text-foreground"}`,
+            children: counts.inFlight
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-[9px] uppercase tracking-widest text-muted-foreground/60", children: "In flight" })
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-auto space-y-1 border-t border-border/40 pt-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-mono text-[10px] text-muted-foreground/70", children: worker.latestEventKind ?? "no events yet" }),
+        worker.latestEventAt ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 font-mono text-[10px] text-muted-foreground/60", children: formatMissionTimestamp(worker.latestEventAt) }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs text-foreground/80", children: deriveMissionWorkerActivityLabel(worker) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "a",
+        {
+          href: worker.transcriptUrl,
+          target: "_blank",
+          rel: "noreferrer",
+          onClick: onTranscriptClick,
+          className: "inline-block text-xs text-primary hover:underline",
+          children: "View session"
+        }
+      )
+    ] })
+  ] });
+}
+var PAGE_LIMIT = 500;
+var MAX_PAGES_PER_PUMP = 20;
+function useMissionEvents(input) {
+  const { adapter, missionId, missionStatus, isTerminal, pollIntervalMs } = input;
+  const supported = typeof adapter.listMissionEvents === "function";
+  const [events, setEvents] = react.useState([]);
+  const [sessions, setSessions] = react.useState({});
+  const lastIdRef = react.useRef(null);
+  const pumpingRef = react.useRef(false);
+  const mountedRef = react.useRef(true);
+  react.useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  react.useEffect(() => {
+    lastIdRef.current = null;
+    setEvents([]);
+    setSessions({});
+  }, [missionId]);
+  const pump = react.useCallback(async () => {
+    const fn = adapter.listMissionEvents;
+    if (typeof fn !== "function" || pumpingRef.current) return;
+    pumpingRef.current = true;
+    try {
+      for (let page = 0; page < MAX_PAGES_PER_PUMP; page += 1) {
+        const resp = await fn.call(adapter, {
+          missionId,
+          afterId: lastIdRef.current ?? void 0,
+          limit: PAGE_LIMIT
+        });
+        if (!mountedRef.current) return;
+        if (resp.events.length > 0) {
+          lastIdRef.current = resp.events[resp.events.length - 1].id;
+          setEvents((prev) => mergeMissionEvents(prev, resp.events));
+        }
+        if (Object.keys(resp.sessions).length > 0) {
+          setSessions((prev) => ({ ...prev, ...resp.sessions }));
+        }
+        if (resp.events.length < PAGE_LIMIT) break;
+      }
+    } catch {
+    } finally {
+      pumpingRef.current = false;
+    }
+  }, [adapter, missionId]);
+  react.useEffect(() => {
+    void pump();
+  }, [pump]);
+  react.useEffect(() => {
+    if (!supported || missionStatus === null || isTerminal) return;
+    const id = window.setInterval(() => {
+      void pump();
+    }, pollIntervalMs);
+    return () => {
+      window.clearInterval(id);
+    };
+  }, [supported, missionStatus, isTerminal, pollIntervalMs, pump]);
+  return { supported, events, sessions };
+}
+var DEFAULT_POLL_INTERVAL_MS = 5e3;
+function CountBadge({ n }) {
+  if (n === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 rounded bg-muted px-1 py-px text-[9px] text-muted-foreground/70", children: n });
+}
+var INITIAL_STATE = {
+  mission: null,
+  tasks: [],
   workers: [],
   loading: true,
   error: null
@@ -13361,10 +14687,13 @@ function MissionDashboard({
       window.clearInterval(id);
     };
   }, [refresh, state.mission, pollIntervalMs]);
-  const taskBuckets = react.useMemo(
-    () => groupMissionTasksByBucket(state.tasks),
-    [state.tasks]
-  );
+  const feed = useMissionEvents({
+    adapter,
+    missionId,
+    missionStatus: state.mission?.status ?? null,
+    isTerminal: state.mission ? isTerminalMissionStatus(state.mission.status) : false,
+    pollIntervalMs
+  });
   const runningWorkerCount = react.useMemo(
     // "running" means the child is still consuming compute right now.
     // For task-backed children that's ``taskStatus === "running"``; for
@@ -13433,7 +14762,6 @@ function MissionDashboard({
     }
   };
   const statusTone = mission.status === "satisfied" ? "border-emerald-500/40 bg-emerald-500/10 text-emerald-700 dark:text-emerald-400" : mission.status === "failed" || mission.status === "cancelled" ? "border-destructive/40 bg-destructive/10 text-destructive" : mission.status === "paused" ? "border-amber-500/40 bg-amber-500/10 text-amber-700 dark:text-amber-400" : "border-primary/40 bg-primary/10 text-primary";
-  const activity = buildMissionActivity(mission, state.tasks, state.workers);
   const isActive = ACTIVE_MISSION_STATUSES.has(mission.status);
   const iterationPct = mission.maxIterations > 0 ? Math.min(100, mission.iteration / mission.maxIterations * 100) : 0;
   return /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-1 flex-col overflow-hidden bg-muted/30", children: [
@@ -13540,18 +14868,18 @@ function MissionDashboard({
     /* @__PURE__ */ jsxRuntime.jsxs(
       Tabs,
       {
-        defaultValue: "activity",
+        defaultValue: "tasks",
         className: "mt-5 flex flex-1 flex-col overflow-hidden sm:mt-6",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 border-b border-border bg-background px-5 sm:px-6", children: /* @__PURE__ */ jsxRuntime.jsxs(TabsList, { variant: "line", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(TabsTrigger, { value: "activity", children: [
-              "Activity",
-              /* @__PURE__ */ jsxRuntime.jsx(CountBadge, { n: activity.length })
-            ] }),
             /* @__PURE__ */ jsxRuntime.jsxs(TabsTrigger, { value: "tasks", children: [
               "Tasks",
               /* @__PURE__ */ jsxRuntime.jsx(CountBadge, { n: state.tasks.length })
             ] }),
+            feed.supported ? /* @__PURE__ */ jsxRuntime.jsxs(TabsTrigger, { value: "activity", children: [
+              "Activity",
+              /* @__PURE__ */ jsxRuntime.jsx(CountBadge, { n: feed.events.length })
+            ] }) : null,
             /* @__PURE__ */ jsxRuntime.jsxs(TabsTrigger, { value: "workers", children: [
               "Workers",
               /* @__PURE__ */ jsxRuntime.jsx(CountBadge, { n: state.workers.length })
@@ -13559,22 +14887,24 @@ function MissionDashboard({
             /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: "metadata", children: "Metadata" })
           ] }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 overflow-y-auto bg-background px-5 py-4 sm:px-6", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "activity", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTimeline, { entries: activity }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "tasks", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-              TasksList,
+            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "tasks", className: "mt-0 h-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+              MissionTasksTab,
               {
-                taskBuckets,
-                totalTasks: state.tasks.length
+                tasks: state.tasks,
+                feed,
+                onOpenTranscript
               }
             ) }),
+            feed.supported ? /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "activity", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(MissionActivityTab, { feed }) }) : null,
             /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "workers", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-              WorkersList,
+              MissionWorkersTab,
               {
                 workers: state.workers,
+                tasks: state.tasks,
                 onOpenTranscript
               }
             ) }),
-            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "metadata", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(MetadataPane, { mission }) })
+            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "metadata", className: "mt-0", children: /* @__PURE__ */ jsxRuntime.jsx(MissionMetadataTab, { mission }) })
           ] })
         ]
       }
@@ -13638,234 +14968,6 @@ function MissionDashboard({
     )
   ] }) });
 }
-function ActivityTimeline({ entries }) {
-  if (entries.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No mission activity yet." });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "space-y-1", children: entries.map((e, i) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "li",
-    {
-      className: "flex items-start gap-3 rounded px-2 py-1.5 text-sm hover:bg-muted/30",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-20 shrink-0 font-mono text-[10px] text-muted-foreground/60", children: formatTimestamp(e.at) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: `shrink-0 rounded border px-1.5 py-0.5 font-mono text-[9px] uppercase tracking-wide ${ACTIVITY_KIND_TONE[e.kind]}`,
-            children: e.label
-          }
-        ),
-        e.detail ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate text-foreground/80", children: e.detail }) : null
-      ]
-    },
-    `${e.kind}-${e.at}-${i}`
-  )) });
-}
-function TaskRow({ task }) {
-  const [open, setOpen] = react.useState(false);
-  const goalPreview = firstLine3(task.goal, 160);
-  const hasMore = task.goal.length > 160 || Boolean(task.result) || Boolean(task.resultMetadata);
-  const statusTone = task.status === "done" ? "border-emerald-500/30 bg-emerald-500/10 text-emerald-600" : task.status === "failed" ? "border-destructive/30 bg-destructive/10 text-destructive" : task.status === "cancelled" ? "border-border bg-muted text-muted-foreground" : task.status === "running" ? "border-primary/30 bg-primary/10 text-primary" : "border-foreground/20 bg-foreground/5 text-foreground/70";
-  return /* @__PURE__ */ jsxRuntime.jsx(Collapsible, { open, onOpenChange: setOpen, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "rounded border border-border/40 text-sm", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      CollapsibleTrigger,
-      {
-        asChild: true,
-        disabled: !hasMore,
-        children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            className: "flex w-full items-start gap-3 px-3 py-2 text-left hover:bg-muted/30 disabled:hover:bg-transparent",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                lucideReact.ChevronRight,
-                {
-                  className: `mt-0.5 size-3.5 shrink-0 text-muted-foreground/60 transition-transform ${open ? "rotate-90" : ""} ${hasMore ? "" : "opacity-0"}`
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "span",
-                {
-                  className: `shrink-0 rounded border px-1.5 py-0.5 font-mono text-[9px] uppercase tracking-wide ${statusTone}`,
-                  children: task.status
-                }
-              ),
-              task.agentDefName ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[10px] text-muted-foreground/70", children: task.agentDefName }) : null,
-              task.attemptCount > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-[10px] text-muted-foreground/60", children: [
-                "(",
-                task.attemptCount,
-                "/",
-                task.maxAttempts,
-                ")"
-              ] }) : null,
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate text-foreground/80", children: goalPreview })
-            ]
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(CollapsibleContent, { className: "border-t border-border/40 px-3 py-2 text-xs", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Goal" }),
-        /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre-wrap rounded bg-muted/30 px-2 py-1.5 text-[11px] text-foreground/90", children: task.goal })
-      ] }),
-      task.parentIds.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 text-[10px] text-muted-foreground/70", children: [
-        "after: ",
-        task.parentIds.map((p) => p.slice(0, 8)).join(", ")
-      ] }) : null,
-      task.result ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Result" }),
-        /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre-wrap rounded bg-muted/30 px-2 py-1.5 text-[11px] text-foreground/90", children: task.result })
-      ] }) : null,
-      task.resultMetadata ? /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Result metadata" }),
-        /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre-wrap rounded bg-muted/30 px-2 py-1.5 text-[11px] text-foreground/90", children: JSON.stringify(task.resultMetadata, null, 2) })
-      ] }) : null
-    ] })
-  ] }) });
-}
-function TasksList({
-  taskBuckets,
-  totalTasks
-}) {
-  if (totalTasks === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No tasks spawned yet." });
-  }
-  const headings = {
-    in_flight: "In flight",
-    blocked: "Blocked",
-    done: "Done",
-    failed_or_cancelled: "Failed / cancelled"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: Object.keys(headings).map((bucket) => {
-    const rows = taskBuckets[bucket];
-    if (rows.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: [
-        headings[bucket],
-        " (",
-        rows.length,
-        ")"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-1", children: rows.map((task) => /* @__PURE__ */ jsxRuntime.jsx(TaskRow, { task }, task.id)) })
-    ] }, bucket);
-  }) });
-}
-function WorkersList({
-  workers,
-  onOpenTranscript
-}) {
-  if (workers.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No workers attached to this mission right now." });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-1", children: workers.map((w) => {
-    const onTranscriptClick = (e) => {
-      if (onOpenTranscript) {
-        e.preventDefault();
-        onOpenTranscript(w.workerSessionId);
-      }
-    };
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "li",
-      {
-        className: "flex flex-col gap-2 rounded border border-border/40 px-3 py-2 text-sm sm:flex-row sm:items-start sm:justify-between",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                Badge,
-                {
-                  variant: "outline",
-                  className: MISSION_WORKER_KIND_BADGE_CLASS[w.kind],
-                  title: MISSION_WORKER_KIND_TOOLTIP[w.kind],
-                  children: w.kind
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "text-foreground/70", children: w.kind === "task" ? w.taskStatus ?? "\u2014" : w.sessionStatus }),
-              w.agentDefName ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] text-muted-foreground/70", children: w.agentDefName }) : null,
-              w.latestEventAt ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto font-mono text-[10px] text-muted-foreground/60", children: formatTimestamp(w.latestEventAt) }) : null
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm text-foreground/80", children: deriveMissionWorkerActivityLabel(w) })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "a",
-            {
-              href: w.transcriptUrl,
-              target: "_blank",
-              rel: "noreferrer",
-              onClick: onTranscriptClick,
-              className: "self-start text-xs text-primary hover:underline",
-              children: "View session"
-            }
-          )
-        ]
-      },
-      w.workerSessionId
-    );
-  }) });
-}
-function MetadataPane({ mission }) {
-  const rows = [];
-  rows.push({
-    label: "Mission ID",
-    value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.id })
-  });
-  rows.push({
-    label: "Session ID",
-    value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.sessionId })
-  });
-  rows.push({
-    label: "Agent ID",
-    value: /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.agentId })
-  });
-  rows.push({ label: "Status", value: mission.status });
-  rows.push({
-    label: "Iteration",
-    value: `${mission.iteration} / ${mission.maxIterations}`
-  });
-  rows.push({
-    label: "Owner",
-    value: mission.userId ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      "user ",
-      /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.userId })
-    ] }) : mission.serviceAccountId ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      "service account ",
-      /* @__PURE__ */ jsxRuntime.jsx("code", { className: "text-[11px]", children: mission.serviceAccountId })
-    ] }) : "\u2014"
-  });
-  rows.push({
-    label: "Created",
-    value: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[11px]", children: new Date(mission.createdAt).toLocaleString() })
-  });
-  rows.push({
-    label: "Updated",
-    value: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[11px]", children: new Date(mission.updatedAt).toLocaleString() })
-  });
-  if (mission.pausedReason) {
-    rows.push({ label: "Paused reason", value: mission.pausedReason });
-  }
-  if (mission.cancelledReason) {
-    rows.push({ label: "Cancelled reason", value: mission.cancelledReason });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
-    mission.lastEvaluationResult ? /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: [
-        "Last verdict \u2014 ",
-        mission.lastEvaluationResult
-      ] }),
-      mission.lastEvaluationFeedback ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-sm text-foreground/90", children: mission.lastEvaluationFeedback }) : null,
-      mission.lastEvaluationExplanation ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "whitespace-pre-wrap text-xs text-muted-foreground/70", children: mission.lastEvaluationExplanation }) : null
-    ] }) : null,
-    /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Identifiers" }),
-      /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "grid grid-cols-[max-content_1fr] gap-x-4 gap-y-1 text-xs", children: rows.map((r) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground/70", children: r.label }),
-        /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "break-all text-foreground/90", children: r.value })
-      ] }, r.label)) })
-    ] })
-  ] });
-}
 init_utils();
 var DEFAULT_POLL_INTERVAL_MS2 = 3e4;
 function fingerprint(items) {
@@ -14105,7 +15207,7 @@ function MissionsPanel({
       if (!adapter.cancelMission || busyMissionId) return;
       setBusyMissionId(missionId);
       try {
-        await adapter.cancelMission({ missionId });
+        await adapter.cancelMission({ missionId, cascadeToWorkers: true });
         setItems((current) => {
           const next = current.filter((m) => m.id !== missionId);
           lastFingerprint.current = fingerprint(next);
@@ -14897,24 +15999,40 @@ exports.ACTIVE_MISSION_STATUSES = ACTIVE_MISSION_STATUSES;
 exports.AgentChat = AgentChat;
 exports.AgentChatAdapterProvider = AgentChatAdapterProvider;
 exports.CitationText = CitationText;
+exports.CodingAgentsPanel = CodingAgentsPanel;
 exports.ComposioConnectCard = ComposioConnectCard;
 exports.InboxPanel = InboxPanel;
 exports.IntegrationsBand = IntegrationsBand;
 exports.IntegrationsPage = IntegrationsPage;
+exports.MISSION_EVENT_CATEGORIES = MISSION_EVENT_CATEGORIES;
 exports.MessageResponse = MessageResponse;
 exports.MissionDashboard = MissionDashboard;
 exports.MissionsPanel = MissionsPanel;
 exports.ResearchSourcesPanel = ResearchSourcesPanel;
 exports.ScheduledWorkPanel = ScheduledWorkPanel;
 exports.SessionTreePanel = SessionTreePanel;
+exports.defaultSelectedMissionTaskId = defaultSelectedMissionTaskId;
 exports.deriveMissionWorkerActivityLabel = deriveMissionWorkerActivityLabel;
+exports.formatMissionTimestamp = formatMissionTimestamp;
 exports.groupMissionTasksByBucket = groupMissionTasksByBucket;
 exports.isTerminalMissionStatus = isTerminalMissionStatus;
+exports.mergeMissionEvents = mergeMissionEvents;
+exports.missionEventActorLabel = missionEventActorLabel;
+exports.missionEventCategory = missionEventCategory;
+exports.missionEventSummary = missionEventSummary;
+exports.missionEventTaskId = missionEventTaskId;
+exports.missionTaskBlocks = missionTaskBlocks;
 exports.missionTaskBucket = missionTaskBucket;
+exports.missionTaskRailGroups = missionTaskRailGroups;
+exports.missionTaskStatusDotClass = missionTaskStatusDotClass;
+exports.missionTaskTitle = missionTaskTitle;
+exports.missionWorkerTaskCounts = missionWorkerTaskCounts;
 exports.splitCitations = splitCitations;
+exports.stripMissionControlMarkup = stripMissionControlMarkup;
 exports.useAgentChatAdapterContext = useAgentChatAdapterContext;
 exports.useAgentChatRuntime = useAgentChatRuntime;
 exports.useChatViewMode = useChatViewMode;
 exports.useInboxUnreadCount = useInboxUnreadCount;
+exports.useMissionEvents = useMissionEvents;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map