@invergent/agent-chat-react 2.0.2 → 2.0.7

package/dist/index.js

@@ -1,8 +1,8 @@
 import { cn } from './chunk-QSC4UIVT.js';
-import { createContext, memo, useRef, useEffect, useCallback, useMemo, useState, lazy, useContext, Suspense, Children } from 'react';
+import { createContext, memo, useRef, useEffect, useCallback, useMemo, useState, lazy, useContext, Fragment as Fragment$1, Suspense, Children } from 'react';
 import { ChevronDownIcon, AlertTriangle, ChevronDown, ChevronRight, RefreshCw, File as File$1, FileImage, FileAudio, FileVideo, FileText, FileCode, FileArchive, FileSpreadsheet, InboxIcon, Loader2, AlertCircle, Pause, Play, Ban, TargetIcon, ChevronRightIcon, CalendarClockIcon, UsersIcon, MessageSquareIcon, ZapIcon, Maximize2Icon, FolderOpenIcon, Loader2Icon, UploadIcon, RefreshCwIcon, AlertCircleIcon, ExternalLinkIcon, ClipboardCheckIcon, ShieldAlertIcon, TimerIcon, CircleDotIcon, XIcon, Trash2Icon, SquareIcon, ArrowDownIcon, RotateCcwIcon, MousePointer2Icon, DownloadIcon, TrashIcon, ImageIcon, FileTextIcon, CheckIcon, CopyIcon, TerminalIcon, SparklesIcon, ClockIcon, PlusIcon, CloudIcon, HardDriveIcon, PaperclipIcon, GlobeIcon, FolderIcon, FileIcon, ChevronLeftIcon, MinusIcon, SearchIcon, GitBranchIcon, ThumbsUpIcon, ThumbsDownIcon, ActivityIcon, EyeIcon, ListTodoIcon, ArrowUpIcon, XCircleIcon, CheckCircle2Icon, Code, CircleCheckIcon, CircleXIcon, SkullIcon, CheckCircleIcon, CircleIcon } from 'lucide-react';
 import { cva } from 'class-variance-authority';
-import { Collapsible as Collapsible$1, Slot, Tooltip as Tooltip$1, Separator as Separator$1, Dialog as Dialog$1, ScrollArea as ScrollArea$1, Popover as Popover$1, Progress as Progress$1, Tabs as Tabs$1 } from 'radix-ui';
+import { Collapsible as Collapsible$1, Slot, Tooltip as Tooltip$1, Progress as Progress$1, Tabs as Tabs$1, Dialog as Dialog$1, ScrollArea as ScrollArea$1, Popover as Popover$1 } from 'radix-ui';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { StickToBottom, useStickToBottomContext } from 'use-stick-to-bottom';
 import { cjk } from '@streamdown/cjk';
@@ -597,26 +597,6 @@ var ConversationScrollButton = ({
     }
   );
 };
-function Separator({
-  className,
-  orientation = "horizontal",
-  decorative = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Separator$1.Root,
-    {
-      "data-slot": "separator",
-      decorative,
-      orientation,
-      className: cn(
-        "shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
-        className
-      ),
-      ...props
-    }
-  );
-}
 var Message = ({ className, from, ...props }) => /* @__PURE__ */ jsx(
   "div",
   {
@@ -10461,42 +10441,6 @@ function Card({
     }
   );
 }
-function CardHeader({ className, ...props }) {
-  return /* @__PURE__ */ 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__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-title",
-      className: cn(
-        "font-heading text-lg font-semibold tracking-wider uppercase",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CardDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-description",
-      className: cn("text-sm leading-relaxed text-muted-foreground", className),
-      ...props
-    }
-  );
-}
 function CardContent({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
@@ -10564,6 +10508,97 @@ var MISSION_WORKER_KIND_TOOLTIP = {
   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__ */ 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
+    });
+  }
+  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
+      });
+    }
+  }
+  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)
+      });
+    }
+  }
+  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;
+}
+function formatTimestamp(iso) {
+  try {
+    return new Date(iso).toLocaleTimeString();
+  } catch {
+    return iso;
+  }
+}
 var INITIAL_STATE = {
   mission: null,
   tasks: [],
@@ -10716,210 +10751,153 @@ function MissionDashboard({
       setBusy(false);
     }
   };
-  const statusVariant = mission.status === "satisfied" ? "default" : mission.status === "failed" || mission.status === "cancelled" ? "destructive" : "secondary";
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 p-4 sm:gap-6 sm:p-6", children: [
-    /* @__PURE__ */ jsxs(Card, { children: [
-      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-stretch gap-4 sm:flex-row sm:items-start sm:justify-between", children: [
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1 min-w-0 flex-1", children: [
-          /* @__PURE__ */ jsx(CardTitle, { className: "wrap-break-word -uppercase text-sm", children: mission.description }),
-          /* @__PURE__ */ jsxs(CardDescription, { className: "wrap-break-word text-foreground/70", children: [
-            "Rubric: ",
-            mission.rubric
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-1 pt-2 text-xs text-foreground/70", children: [
-            /* @__PURE__ */ jsx(Badge, { variant: statusVariant, className: "font-mono text-foreground", children: mission.status }),
-            /* @__PURE__ */ jsxs("span", { className: "font-mono text-primary", children: [
-              "Iteration ",
-              mission.iteration,
-              "/",
-              mission.maxIterations
-            ] }),
-            mission.lastEvaluationResult ? /* @__PURE__ */ jsxs("span", { children: [
-              "Last verdict:",
-              " ",
-              /* @__PURE__ */ jsx("span", { className: "font-mono text-primary", children: mission.lastEvaluationResult })
-            ] }) : null
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2 shrink-0", children: ACTIVE_MISSION_STATUSES.has(mission.status) ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          mission.status === "active" ? /* @__PURE__ */ jsxs(
-            Button,
-            {
-              size: "sm",
-              variant: "outline",
-              onClick: doPause,
-              disabled: busy,
-              children: [
-                /* @__PURE__ */ jsx(Pause, { className: "size-4" }),
-                " Pause"
-              ]
-            }
-          ) : /* @__PURE__ */ jsxs(
-            Button,
+  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__ */ jsx(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-1 flex-col overflow-hidden bg-muted/30", children: [
+    /* @__PURE__ */ jsx("div", { className: "shrink-0 px-5 pt-5 sm:px-6 sm:pt-6", children: /* @__PURE__ */ jsx(Card, { className: "border-border/60 bg-card shadow-sm", children: /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4 p-5 sm:p-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
+          /* @__PURE__ */ jsx(
+            "span",
             {
-              size: "sm",
-              variant: "outline",
-              onClick: doResume,
-              disabled: busy,
-              children: [
-                /* @__PURE__ */ jsx(Play, { className: "size-4" }),
-                " Resume"
-              ]
+              className: `rounded-md border px-2 py-0.5 font-mono text-[10px] font-semibold uppercase tracking-wider ${statusTone}`,
+              children: mission.status
             }
           ),
-          /* @__PURE__ */ jsxs(
+          /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-1.5", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-display text-2xl font-bold tracking-tight tabular-nums text-foreground", children: mission.iteration }),
+            /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground/70", children: [
+              "/ ",
+              mission.maxIterations
+            ] }),
+            /* @__PURE__ */ jsx("span", { className: "ml-1 text-[10px] uppercase tracking-wider text-muted-foreground/60", children: "iterations" })
+          ] }),
+          mission.lastEvaluationResult ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-[11px] text-muted-foreground/70", children: [
+            /* @__PURE__ */ jsx("span", { className: "opacity-70", children: "last verdict" }),
+            /* @__PURE__ */ jsx("span", { className: "rounded border border-primary/30 bg-primary/10 px-1.5 py-0.5 font-mono text-[10px] uppercase tracking-wider text-primary", children: mission.lastEvaluationResult })
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: [
+          isActive ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            mission.status === "active" ? /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "outline",
+                onClick: doPause,
+                disabled: busy,
+                children: [
+                  /* @__PURE__ */ jsx(Pause, { className: "size-4" }),
+                  " Pause"
+                ]
+              }
+            ) : /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "outline",
+                onClick: doResume,
+                disabled: busy,
+                children: [
+                  /* @__PURE__ */ jsx(Play, { className: "size-4" }),
+                  " Resume"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "destructive",
+                onClick: () => {
+                  setCancelCascade(false);
+                  setCancelOpen(true);
+                },
+                disabled: busy,
+                children: [
+                  /* @__PURE__ */ jsx(Ban, { className: "size-4" }),
+                  " Cancel"
+                ]
+              }
+            )
+          ] }) : onNavigateBack ? /* @__PURE__ */ jsx(Button, { size: "sm", variant: "outline", onClick: onNavigateBack, children: "Back" }) : null,
+          /* @__PURE__ */ jsx(
             Button,
             {
+              variant: "ghost",
               size: "sm",
-              variant: "destructive",
-              onClick: () => {
-                setCancelCascade(false);
-                setCancelOpen(true);
-              },
+              onClick: () => void refresh(),
               disabled: busy,
-              children: [
-                /* @__PURE__ */ jsx(Ban, { className: "size-4" }),
-                " Cancel"
-              ]
+              "aria-label": "Refresh",
+              title: "Refresh",
+              children: /* @__PURE__ */ jsx(RefreshCw, { className: "size-4" })
             }
           )
-        ] }) : onNavigateBack ? /* @__PURE__ */ jsx(Button, { size: "sm", variant: "outline", onClick: onNavigateBack, children: "Back" }) : null })
-      ] }) }),
-      mission.lastEvaluationFeedback ? /* @__PURE__ */ jsxs(CardContent, { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold uppercase tracking-widest text-foreground/70", children: "Evaluator feedback" }),
-        /* @__PURE__ */ jsx("p", { className: "text-sm whitespace-pre-wrap wrap-break-word", children: mission.lastEvaluationFeedback }),
-        mission.lastEvaluationExplanation ? /* @__PURE__ */ jsx("p", { className: "text-xs text-foreground/70 whitespace-pre-wrap wrap-break-word", children: mission.lastEvaluationExplanation }) : null
-      ] }) : null
-    ] }),
-    /* @__PURE__ */ jsxs(Card, { children: [
-      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, { children: [
-        "Tasks (",
-        state.tasks.length,
-        ")"
-      ] }) }),
-      /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
-        ["in_flight", "blocked", "done", "failed_or_cancelled"].map((bucket) => {
-          const rows = taskBuckets[bucket];
-          if (rows.length === 0) return null;
-          const heading = {
-            in_flight: "In flight",
-            blocked: "Blocked",
-            done: "Done",
-            failed_or_cancelled: "Failed / cancelled"
-          }[bucket];
-          return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ jsxs("div", { className: "text-xs font-semibold uppercase tracking-widest text-foreground/70", children: [
-              heading,
-              " (",
-              rows.length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsx("ul", { className: "space-y-1.5", children: rows.map((task) => /* @__PURE__ */ jsx(
-              "li",
-              {
-                className: "flex items-start justify-between gap-3 rounded border border-border/40 px-3 py-2 text-sm",
-                children: /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
-                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                    task.agentDefName ? /* @__PURE__ */ jsx("span", { className: "text-xs text-foreground/70", children: task.agentDefName }) : null,
-                    task.attemptCount > 1 ? /* @__PURE__ */ jsxs("span", { className: "text-xs text-foreground/70", children: [
-                      "attempt ",
-                      task.attemptCount,
-                      "/",
-                      task.maxAttempts
-                    ] }) : null
-                  ] }),
-                  /* @__PURE__ */ jsx("div", { className: "text-sm wrap-break-word", children: task.goal }),
-                  task.parentIds.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "text-xs text-foreground/70", children: [
-                    "after:",
-                    " ",
-                    task.parentIds.map((p) => p.slice(0, 8)).join(", ")
-                  ] }) : null,
-                  task.result ? /* @__PURE__ */ jsx("pre", { className: "text-xs whitespace-pre-wrap bg-muted/30 rounded px-2 py-1 max-h-32 overflow-auto", children: task.result }) : null,
-                  task.resultMetadata ? /* @__PURE__ */ jsx("pre", { className: "text-xs whitespace-pre-wrap bg-muted/30 rounded px-2 py-1 max-h-32 overflow-auto", children: JSON.stringify(task.resultMetadata, null, 2) }) : null
-                ] })
-              },
-              task.id
-            )) })
-          ] }, bucket);
-        }),
-        state.tasks.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-sm text-foreground/70", children: "No tasks spawned yet." }) : null
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs(Card, { children: [
-      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, { children: [
-        "Live workers (",
-        state.workers.length,
-        ")"
-      ] }) }),
-      /* @__PURE__ */ jsx(CardContent, { children: state.workers.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-sm text-foreground/70", children: "No workers attached to this mission right now." }) : /* @__PURE__ */ jsx("ul", { className: "space-y-1.5", children: state.workers.map((w) => {
-        const onTranscriptClick = (e) => {
-          if (onOpenTranscript) {
-            e.preventDefault();
-            onOpenTranscript(w.workerSessionId);
-          }
-        };
-        return /* @__PURE__ */ jsxs(
-          "li",
-          {
-            className: "flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between rounded border border-border/40 px-3 py-2 text-sm",
-            children: [
-              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
-                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx(
-                    Badge,
-                    {
-                      variant: "outline",
-                      className: MISSION_WORKER_KIND_BADGE_CLASS[w.kind],
-                      title: MISSION_WORKER_KIND_TOOLTIP[w.kind],
-                      children: w.kind
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(Badge, { className: "text-foreground/70", children: w.kind === "task" ? w.taskStatus ?? "\u2014" : w.sessionStatus }),
-                  w.agentDefName ? /* @__PURE__ */ jsx("span", { className: "text-xs text-foreground/70", children: w.agentDefName }) : null
-                ] }),
-                /* @__PURE__ */ jsx("div", { className: "text-sm wrap-break-word", children: deriveMissionWorkerActivityLabel(w) }),
-                w.latestEventAt ? /* @__PURE__ */ jsx("div", { className: "text-xs text-foreground/70", children: new Date(w.latestEventAt).toLocaleTimeString() }) : null
-              ] }),
-              /* @__PURE__ */ jsx(
-                "a",
-                {
-                  href: w.transcriptUrl,
-                  target: "_blank",
-                  rel: "noreferrer",
-                  onClick: onTranscriptClick,
-                  className: "text-xs text-primary hover:underline self-start",
-                  children: "View session"
-                }
-              )
-            ]
-          },
-          w.workerSessionId
-        );
-      }) }) })
-    ] }),
-    /* @__PURE__ */ jsx(Separator, {}),
-    /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center text-xs text-foreground/70", children: [
-      /* @__PURE__ */ jsxs("span", { children: [
-        "Auto-refresh every ",
-        pollIntervalMs / 1e3,
-        "s while mission is active."
+        ] })
       ] }),
-      /* @__PURE__ */ jsxs(
-        Button,
+      /* @__PURE__ */ jsx(
+        Progress,
         {
-          variant: "ghost",
-          size: "sm",
-          onClick: () => {
-            void refresh();
-          },
-          disabled: busy,
-          children: [
-            /* @__PURE__ */ jsx(RefreshCw, { className: "size-4" }),
-            " Refresh"
-          ]
+          value: iterationPct,
+          className: `h-1 ${isActive ? "" : "opacity-40"}`
         }
-      )
-    ] }),
+      ),
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("h1", { className: "line-clamp-4 cursor-default font-display text-lg font-semibold leading-snug text-foreground wrap-break-word", children: mission.description }) }),
+        mission.description.length > 240 ? /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-lg", side: "bottom", children: /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs", children: mission.description }) }) : null
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-border/60 bg-muted/40 px-3 py-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-0.5 font-mono text-[9px] uppercase tracking-widest text-muted-foreground/70", children: "Rubric" }),
+        /* @__PURE__ */ jsxs(Tooltip, { children: [
+          /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("p", { className: "line-clamp-3 cursor-default text-sm leading-relaxed text-foreground/90 wrap-break-word", children: mission.rubric }) }),
+          mission.rubric.length > 200 ? /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-lg", side: "bottom", children: /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs", children: mission.rubric }) }) : null
+        ] })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ jsxs(
+      Tabs,
+      {
+        defaultValue: "activity",
+        className: "mt-5 flex flex-1 flex-col overflow-hidden sm:mt-6",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "shrink-0 border-b border-border bg-background px-5 sm:px-6", children: /* @__PURE__ */ jsxs(TabsList, { variant: "line", children: [
+            /* @__PURE__ */ jsxs(TabsTrigger, { value: "activity", children: [
+              "Activity",
+              /* @__PURE__ */ jsx(CountBadge, { n: activity.length })
+            ] }),
+            /* @__PURE__ */ jsxs(TabsTrigger, { value: "tasks", children: [
+              "Tasks",
+              /* @__PURE__ */ jsx(CountBadge, { n: state.tasks.length })
+            ] }),
+            /* @__PURE__ */ jsxs(TabsTrigger, { value: "workers", children: [
+              "Workers",
+              /* @__PURE__ */ jsx(CountBadge, { n: state.workers.length })
+            ] }),
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "metadata", children: "Metadata" })
+          ] }) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto bg-background px-5 py-4 sm:px-6", children: [
+            /* @__PURE__ */ jsx(TabsContent, { value: "activity", className: "mt-0", children: /* @__PURE__ */ jsx(ActivityTimeline, { entries: activity }) }),
+            /* @__PURE__ */ jsx(TabsContent, { value: "tasks", className: "mt-0", children: /* @__PURE__ */ jsx(
+              TasksList,
+              {
+                taskBuckets,
+                totalTasks: state.tasks.length
+              }
+            ) }),
+            /* @__PURE__ */ jsx(TabsContent, { value: "workers", className: "mt-0", children: /* @__PURE__ */ jsx(
+              WorkersList,
+              {
+                workers: state.workers,
+                onOpenTranscript
+              }
+            ) }),
+            /* @__PURE__ */ jsx(TabsContent, { value: "metadata", className: "mt-0", children: /* @__PURE__ */ jsx(MetadataPane, { mission }) })
+          ] })
+        ]
+      }
+    ),
     /* @__PURE__ */ jsx(
       Dialog,
       {
@@ -10977,6 +10955,234 @@ function MissionDashboard({
         ] })
       }
     )
+  ] }) });
+}
+function ActivityTimeline({ entries }) {
+  if (entries.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No mission activity yet." });
+  }
+  return /* @__PURE__ */ jsx("ol", { className: "space-y-1", children: entries.map((e, i) => /* @__PURE__ */ jsxs(
+    "li",
+    {
+      className: "flex items-start gap-3 rounded px-2 py-1.5 text-sm hover:bg-muted/30",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "w-20 shrink-0 font-mono text-[10px] text-muted-foreground/60", children: formatTimestamp(e.at) }),
+        /* @__PURE__ */ 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__ */ 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] = 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__ */ jsx(Collapsible, { open, onOpenChange: setOpen, asChild: true, children: /* @__PURE__ */ jsxs("li", { className: "rounded border border-border/40 text-sm", children: [
+    /* @__PURE__ */ jsx(
+      CollapsibleTrigger,
+      {
+        asChild: true,
+        disabled: !hasMore,
+        children: /* @__PURE__ */ 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__ */ jsx(
+                ChevronRight,
+                {
+                  className: `mt-0.5 size-3.5 shrink-0 text-muted-foreground/60 transition-transform ${open ? "rotate-90" : ""} ${hasMore ? "" : "opacity-0"}`
+                }
+              ),
+              /* @__PURE__ */ 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__ */ jsx("span", { className: "shrink-0 text-[10px] text-muted-foreground/70", children: task.agentDefName }) : null,
+              task.attemptCount > 1 ? /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-[10px] text-muted-foreground/60", children: [
+                "(",
+                task.attemptCount,
+                "/",
+                task.maxAttempts,
+                ")"
+              ] }) : null,
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-foreground/80", children: goalPreview })
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs(CollapsibleContent, { className: "border-t border-border/40 px-3 py-2 text-xs", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Goal" }),
+        /* @__PURE__ */ 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__ */ 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__ */ jsxs("div", { className: "mb-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Result" }),
+        /* @__PURE__ */ 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__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 font-mono text-[9px] uppercase tracking-wide text-muted-foreground/60", children: "Result metadata" }),
+        /* @__PURE__ */ 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__ */ 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__ */ jsx("div", { className: "space-y-4", children: Object.keys(headings).map((bucket) => {
+    const rows = taskBuckets[bucket];
+    if (rows.length === 0) return null;
+    return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: [
+        headings[bucket],
+        " (",
+        rows.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsx("ul", { className: "space-y-1", children: rows.map((task) => /* @__PURE__ */ jsx(TaskRow, { task }, task.id)) })
+    ] }, bucket);
+  }) });
+}
+function WorkersList({
+  workers,
+  onOpenTranscript
+}) {
+  if (workers.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: "py-8 text-center text-sm text-muted-foreground/60", children: "No workers attached to this mission right now." });
+  }
+  return /* @__PURE__ */ jsx("ul", { className: "space-y-1", children: workers.map((w) => {
+    const onTranscriptClick = (e) => {
+      if (onOpenTranscript) {
+        e.preventDefault();
+        onOpenTranscript(w.workerSessionId);
+      }
+    };
+    return /* @__PURE__ */ 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__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                Badge,
+                {
+                  variant: "outline",
+                  className: MISSION_WORKER_KIND_BADGE_CLASS[w.kind],
+                  title: MISSION_WORKER_KIND_TOOLTIP[w.kind],
+                  children: w.kind
+                }
+              ),
+              /* @__PURE__ */ jsx(Badge, { className: "text-foreground/70", children: w.kind === "task" ? w.taskStatus ?? "\u2014" : w.sessionStatus }),
+              w.agentDefName ? /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground/70", children: w.agentDefName }) : null,
+              w.latestEventAt ? /* @__PURE__ */ jsx("span", { className: "ml-auto font-mono text-[10px] text-muted-foreground/60", children: formatTimestamp(w.latestEventAt) }) : null
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "truncate text-sm text-foreground/80", children: deriveMissionWorkerActivityLabel(w) })
+          ] }),
+          /* @__PURE__ */ 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__ */ jsx("code", { className: "text-[11px]", children: mission.id })
+  });
+  rows.push({
+    label: "Session ID",
+    value: /* @__PURE__ */ jsx("code", { className: "text-[11px]", children: mission.sessionId })
+  });
+  rows.push({
+    label: "Agent ID",
+    value: /* @__PURE__ */ 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__ */ jsxs(Fragment, { children: [
+      "user ",
+      /* @__PURE__ */ jsx("code", { className: "text-[11px]", children: mission.userId })
+    ] }) : mission.serviceAccountId ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      "service account ",
+      /* @__PURE__ */ jsx("code", { className: "text-[11px]", children: mission.serviceAccountId })
+    ] }) : "\u2014"
+  });
+  rows.push({
+    label: "Created",
+    value: /* @__PURE__ */ jsx("span", { className: "font-mono text-[11px]", children: new Date(mission.createdAt).toLocaleString() })
+  });
+  rows.push({
+    label: "Updated",
+    value: /* @__PURE__ */ 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__ */ jsxs("div", { className: "space-y-6", children: [
+    mission.lastEvaluationResult ? /* @__PURE__ */ jsxs("section", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: [
+        "Last verdict \u2014 ",
+        mission.lastEvaluationResult
+      ] }),
+      mission.lastEvaluationFeedback ? /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-sm text-foreground/90", children: mission.lastEvaluationFeedback }) : null,
+      mission.lastEvaluationExplanation ? /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs text-muted-foreground/70", children: mission.lastEvaluationExplanation }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsxs("section", { children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-2 font-mono text-[10px] uppercase tracking-widest text-muted-foreground/70", children: "Identifiers" }),
+      /* @__PURE__ */ jsx("dl", { className: "grid grid-cols-[max-content_1fr] gap-x-4 gap-y-1 text-xs", children: rows.map((r) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground/70", children: r.label }),
+        /* @__PURE__ */ jsx("dd", { className: "break-all text-foreground/90", children: r.value })
+      ] }, r.label)) })
+    ] })
   ] });
 }
 var DEFAULT_POLL_INTERVAL_MS2 = 3e4;