@elizaos/plugin-task-coordinator 2.0.3-beta.2 → 2.0.3-beta.3

package/dist/OrchestratorWorkbench.js

@@ -0,0 +1,3200 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogTrigger,
+  Button,
+  client,
+  DiffReviewPanel,
+  useAppSelectorShallow
+} from "@elizaos/ui";
+import { useAgentElement } from "@elizaos/ui/agent-surface";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger
+} from "@elizaos/ui/components/ui/select";
+import {
+  Archive,
+  ArrowDownToLine,
+  ArrowLeft,
+  Bot,
+  Check,
+  ChevronDown,
+  ChevronsUp,
+  ChevronUp,
+  Circle,
+  CircleAlert,
+  CircleCheck,
+  CircleDashed,
+  CirclePlay,
+  CircleStop,
+  CircleX,
+  Copy,
+  Gauge,
+  GitFork,
+  Layers,
+  OctagonX,
+  PanelRightOpen,
+  Pause,
+  Play,
+  RotateCcw,
+  Trash2,
+  UserPlus,
+  UserRound,
+  X
+} from "lucide-react";
+import {
+  useCallback,
+  useDeferredValue,
+  useEffect,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import {
+  paramPriority,
+  TASK_LIST_LIMIT
+} from "./orchestrator-params.js";
+import {
+  ConversationBlockView,
+  ToolBody
+} from "./orchestrator-stream.js";
+import { buildConversation } from "./orchestrator-stream.helpers";
+import {
+  BackChip,
+  SparseWatermark,
+  TaskCard,
+  TaskEmptyState,
+  TaskMetaChip,
+  TaskSearchInput,
+  TaskStatusChip
+} from "./TaskCardList.js";
+import {
+  formatClockTime,
+  formatCompactNumber,
+  formatDuration,
+  formatIsoRelative,
+  formatRelativeTime,
+  formatUsd
+} from "./view-format.js";
+const fallbackTranslate = (key, vars) => String(vars?.defaultValue ?? key);
+const TIMELINE_PAGE_LIMIT = 50;
+const POLL_INTERVAL_MS = 5e3;
+const ACTIVE_POLL_INTERVAL_MS = 1500;
+const STATUS_ICON = {
+  open: Circle,
+  active: CirclePlay,
+  waiting_on_user: UserRound,
+  blocked: OctagonX,
+  validating: CircleDashed,
+  done: CircleCheck,
+  failed: CircleX,
+  archived: Archive,
+  interrupted: CircleAlert
+};
+const STATUS_TONE = {
+  open: "text-muted",
+  active: "text-ok",
+  waiting_on_user: "text-warn",
+  blocked: "text-warn",
+  validating: "text-accent",
+  done: "text-ok",
+  failed: "text-danger",
+  archived: "text-muted",
+  interrupted: "text-warn"
+};
+const STATUS_PULSE = /* @__PURE__ */ new Set([
+  "active",
+  "validating"
+]);
+const TERMINAL_TASK_STATUSES = /* @__PURE__ */ new Set([
+  "done",
+  "failed",
+  "archived"
+]);
+const PRIORITY_ICON = {
+  low: ChevronDown,
+  normal: null,
+  high: ChevronUp,
+  urgent: ChevronsUp
+};
+const SESSION_ICON = {
+  active: CirclePlay,
+  running: CirclePlay,
+  tool_running: CirclePlay,
+  blocked: OctagonX,
+  idle: Circle,
+  completed: CircleCheck,
+  stopped: CircleStop,
+  error: CircleX,
+  errored: CircleX
+};
+const SESSION_TONE = {
+  active: "text-ok",
+  running: "text-ok",
+  tool_running: "text-ok",
+  blocked: "text-warn",
+  idle: "text-muted",
+  completed: "text-ok",
+  stopped: "text-muted",
+  error: "text-danger",
+  errored: "text-danger"
+};
+const SESSION_PULSE = /* @__PURE__ */ new Set([
+  "active",
+  "running",
+  "tool_running"
+]);
+const VERIFICATION_ICON = {
+  passed: CircleCheck,
+  failed: CircleX,
+  pending: CircleDashed,
+  unknown: Circle
+};
+const VERIFICATION_TONE = {
+  passed: "text-ok",
+  failed: "text-danger",
+  pending: "text-warn",
+  unknown: "text-muted"
+};
+const PLAN_STEP_ICON = {
+  done: CircleCheck,
+  completed: CircleCheck,
+  passed: CircleCheck,
+  in_progress: CircleDashed,
+  active: CircleDashed,
+  running: CircleDashed,
+  blocked: OctagonX,
+  failed: CircleX,
+  pending: Circle,
+  todo: Circle
+};
+const PLAN_STEP_TONE = {
+  done: "text-ok",
+  completed: "text-ok",
+  passed: "text-ok",
+  in_progress: "text-accent",
+  active: "text-accent",
+  running: "text-accent",
+  blocked: "text-warn",
+  failed: "text-danger",
+  pending: "text-muted",
+  todo: "text-muted"
+};
+const FILTER_OPTIONS = [
+  "all",
+  "active",
+  "blocked",
+  "validating",
+  "waiting_on_user",
+  "interrupted",
+  "open",
+  "done",
+  "failed"
+];
+const STATUS_LABEL_KEY = {
+  open: "orchestrator.status.open",
+  active: "orchestrator.status.active",
+  waiting_on_user: "orchestrator.status.waitingOnUser",
+  blocked: "orchestrator.status.blocked",
+  validating: "orchestrator.status.validating",
+  done: "orchestrator.status.done",
+  failed: "orchestrator.status.failed",
+  archived: "orchestrator.status.archived",
+  interrupted: "orchestrator.status.interrupted"
+};
+function labelStatus(status, t) {
+  return t(STATUS_LABEL_KEY[status], {
+    defaultValue: status.replace(/_/g, " ")
+  });
+}
+function labelPriority(priority, t) {
+  return t(`orchestrator.priority.${priority}`, { defaultValue: priority });
+}
+function StatusGlyph({
+  status,
+  paused,
+  t,
+  size = "h-3.5 w-3.5"
+}) {
+  const Icon = STATUS_ICON[status];
+  const label = labelStatus(status, t);
+  const pulse = STATUS_PULSE.has(status) && !paused ? " animate-pulse" : "";
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "inline-flex shrink-0",
+      title: label,
+      "aria-label": label,
+      role: "img",
+      children: /* @__PURE__ */ jsx(Icon, { className: `${size} ${STATUS_TONE[status]}${pulse}`, "aria-hidden": true })
+    }
+  );
+}
+function SessionGlyph({
+  status,
+  t,
+  size = "h-3.5 w-3.5"
+}) {
+  const Icon = SESSION_ICON[status] ?? Circle;
+  const tone = SESSION_TONE[status] ?? "text-muted";
+  const label = labelSessionStatus(status, t);
+  const pulse = SESSION_PULSE.has(status) ? " animate-pulse" : "";
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "inline-flex shrink-0",
+      title: label,
+      "aria-label": label,
+      role: "img",
+      children: /* @__PURE__ */ jsx(Icon, { className: `${size} ${tone}${pulse}`, "aria-hidden": true })
+    }
+  );
+}
+function VerificationGlyph({
+  status,
+  t
+}) {
+  const Icon = VERIFICATION_ICON[status];
+  const label = t(`orchestrator.verification.${status}`, {
+    defaultValue: status
+  });
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "inline-flex shrink-0",
+      title: label,
+      "aria-label": label,
+      role: "img",
+      children: /* @__PURE__ */ jsx(
+        Icon,
+        {
+          className: `h-3.5 w-3.5 ${VERIFICATION_TONE[status]}`,
+          "aria-hidden": true
+        }
+      )
+    }
+  );
+}
+function PlanStepGlyph({ status, t }) {
+  const key = status.trim().toLowerCase().replace(/[\s-]+/g, "_");
+  const Icon = PLAN_STEP_ICON[key] ?? Circle;
+  const tone = PLAN_STEP_TONE[key] ?? "text-muted";
+  const label = t(`orchestrator.planStatus.${key}`, {
+    defaultValue: status.replace(/_/g, " ")
+  });
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "mt-px inline-flex shrink-0",
+      title: label,
+      "aria-label": label,
+      role: "img",
+      children: /* @__PURE__ */ jsx(Icon, { className: `h-3.5 w-3.5 ${tone}`, "aria-hidden": true })
+    }
+  );
+}
+const SENDER_LABEL_KEY = {
+  user: { key: "orchestrator.sender.user", fallback: "You" },
+  orchestrator: {
+    key: "orchestrator.sender.orchestrator",
+    fallback: "Orchestrator"
+  },
+  sub_agent: { key: "orchestrator.sender.subAgent", fallback: "Sub-agent" },
+  system: { key: "orchestrator.sender.system", fallback: "System" }
+};
+function labelSender(kind, t) {
+  const meta = SENDER_LABEL_KEY[kind];
+  return t(meta.key, { defaultValue: meta.fallback });
+}
+function resolveSenderName(message, sessionLabelById, mainAgentName, t) {
+  if (message.senderKind === "sub_agent") {
+    const label = message.sessionId ? sessionLabelById.get(message.sessionId)?.trim() : void 0;
+    return label || labelSender("sub_agent", t);
+  }
+  if (message.senderKind === "orchestrator") {
+    return mainAgentName?.trim() || labelSender("orchestrator", t);
+  }
+  return labelSender(message.senderKind, t);
+}
+function getClientErrorMessage(error, fallback) {
+  return error instanceof Error && error.message ? error.message : fallback;
+}
+function isOrchestratorBackendAbsent(error) {
+  const status = error?.status;
+  if (status === 404) return true;
+  const msg = error instanceof Error ? error.message.toLowerCase() : "";
+  return msg === "not found" || msg.includes("404");
+}
+function mergeById(previous, incoming) {
+  if (incoming.length === 0) return previous;
+  const byId = /* @__PURE__ */ new Map();
+  for (const item of previous) byId.set(item.id, item);
+  for (const item of incoming) byId.set(item.id, item);
+  return [...byId.values()].sort((a, b) => a.timestamp - b.timestamp);
+}
+function splitTimelineItems(items) {
+  const messages = [];
+  const events = [];
+  for (const item of items) {
+    if (item.kind === "message") messages.push(item.message);
+    else events.push(item.event);
+  }
+  return { messages, events };
+}
+function normalizePlan(plan) {
+  if (!plan) return null;
+  const summary = typeof plan.summary === "string" ? plan.summary : null;
+  const rawSteps = Array.isArray(plan.steps) ? plan.steps : [];
+  const steps = [];
+  for (const raw of rawSteps) {
+    if (typeof raw === "string" && raw.trim()) {
+      steps.push({
+        key: `step-${steps.length}`,
+        label: raw.trim(),
+        status: null
+      });
+      continue;
+    }
+    if (raw && typeof raw === "object") {
+      const obj = raw;
+      const label = typeof obj.title === "string" && obj.title || typeof obj.label === "string" && obj.label || typeof obj.description === "string" && obj.description || null;
+      if (!label) continue;
+      steps.push({
+        key: `step-${steps.length}`,
+        label,
+        status: typeof obj.status === "string" ? obj.status : null
+      });
+    }
+  }
+  if (!summary && steps.length === 0) return null;
+  return { summary, steps };
+}
+function formatTokenCount(state, totalTokens, t, locale) {
+  if (state === "unavailable") {
+    return t("orchestrator.usage.unavailable", { defaultValue: "\u2014" });
+  }
+  const value = formatCompactNumber(totalTokens, locale);
+  return state === "estimated" ? t("orchestrator.usage.estimatedTokens", {
+    defaultValue: "~{{value}}",
+    value
+  }) : value;
+}
+function renderTokens(usage, t, locale) {
+  return formatTokenCount(usage.state, usage.totalTokens, t, locale);
+}
+function renderCost(usage, t, locale) {
+  if (usage.state === "unavailable") {
+    return t("orchestrator.usage.unavailable", { defaultValue: "\u2014" });
+  }
+  const value = formatUsd(usage.costUsd, locale);
+  return usage.state === "estimated" ? t("orchestrator.usage.estimatedCost", {
+    defaultValue: "~{{value}}",
+    value
+  }) : value;
+}
+function HeaderStat({
+  value,
+  label,
+  toneClass = "text-txt-strong"
+}) {
+  return /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-baseline gap-1", title: label, children: [
+    /* @__PURE__ */ jsx("span", { className: `text-sm font-semibold tabular-nums ${toneClass}`, children: value }),
+    /* @__PURE__ */ jsx("span", { className: "text-2xs text-muted", children: label })
+  ] });
+}
+function InspectorSection({
+  title,
+  action,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("section", { className: "space-y-1.5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-xs font-medium text-muted", children: title }),
+      action
+    ] }),
+    children
+  ] });
+}
+function WorkbenchHeader({
+  status,
+  busy,
+  isMobile,
+  onPauseAll,
+  onResumeAll,
+  t,
+  locale
+}) {
+  const title = /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
+    /* @__PURE__ */ jsx(Layers, { className: "h-4 w-4 text-accent" }),
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-txt-strong", children: t("orchestrator.title", { defaultValue: "Orchestrator" }) })
+  ] });
+  const summary = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex min-w-0 items-center gap-4 overflow-x-auto",
+      style: isMobile ? void 0 : { flex: "1 1 0%" },
+      children: [
+        /* @__PURE__ */ jsx(HeaderStat, { value: String(status?.taskCount ?? 0), label: "tasks" }),
+        status?.activeTaskCount ? /* @__PURE__ */ jsx(
+          HeaderStat,
+          {
+            value: String(status.activeTaskCount),
+            label: "active",
+            toneClass: "text-ok"
+          }
+        ) : null,
+        status?.blockedTaskCount ? /* @__PURE__ */ jsx(
+          HeaderStat,
+          {
+            value: String(status.blockedTaskCount),
+            label: "blocked",
+            toneClass: "text-warn"
+          }
+        ) : null,
+        status?.validatingTaskCount ? /* @__PURE__ */ jsx(
+          HeaderStat,
+          {
+            value: String(status.validatingTaskCount),
+            label: "validating",
+            toneClass: "text-accent"
+          }
+        ) : null,
+        status?.activeSessionCount ? /* @__PURE__ */ jsx(
+          HeaderStat,
+          {
+            value: `${status.activeSessionCount}/${status.sessionCount}`,
+            label: "agents"
+          }
+        ) : null
+      ]
+    }
+  );
+  const usageReadout = status && status.usage.state !== "unavailable" ? /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: "flex shrink-0 items-center gap-1.5 text-xs tabular-nums text-muted",
+      title: t("orchestrator.stat.usage", { defaultValue: "Usage" }),
+      children: [
+        /* @__PURE__ */ jsx(Gauge, { className: "h-3 w-3 text-muted/70" }),
+        renderTokens(status.usage, t, locale),
+        /* @__PURE__ */ jsx("span", { className: "text-muted/50", children: "\xB7" }),
+        renderCost(status.usage, t, locale)
+      ]
+    }
+  ) : null;
+  const pauseAllLabel = t("orchestrator.action.pauseAll", {
+    defaultValue: "Pause all"
+  });
+  const resumeAllLabel = t("orchestrator.action.resumeAll", {
+    defaultValue: "Resume all"
+  });
+  const { ref: pauseAllRef, agentProps: pauseAllAgentProps } = useAgentElement({
+    id: "header-pause-all",
+    role: "button",
+    label: pauseAllLabel,
+    group: "orchestrator-header",
+    description: "Pause every active orchestrator task"
+  });
+  const { ref: resumeAllRef, agentProps: resumeAllAgentProps } = useAgentElement({
+    id: "header-resume-all",
+    role: "button",
+    label: resumeAllLabel,
+    group: "orchestrator-header",
+    description: "Resume every paused orchestrator task"
+  });
+  const actions = status?.activeTaskCount || status?.pausedTaskCount ? /* @__PURE__ */ jsxs("div", { className: "ml-auto flex shrink-0 items-center gap-1.5", children: [
+    status?.activeTaskCount ? /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref: pauseAllRef,
+        variant: "ghost",
+        size: "sm",
+        disabled: busy,
+        onClick: onPauseAll,
+        className: "h-7 w-7 p-0",
+        "aria-label": pauseAllLabel,
+        title: pauseAllLabel,
+        "data-testid": "orchestrator-pause-all",
+        ...pauseAllAgentProps,
+        children: /* @__PURE__ */ jsx(Pause, { className: "h-3.5 w-3.5" })
+      }
+    ) : null,
+    status?.pausedTaskCount ? /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref: resumeAllRef,
+        variant: "ghost",
+        size: "sm",
+        disabled: busy,
+        onClick: onResumeAll,
+        className: "h-7 w-7 p-0",
+        "aria-label": resumeAllLabel,
+        title: resumeAllLabel,
+        "data-testid": "orchestrator-resume-all",
+        ...resumeAllAgentProps,
+        children: /* @__PURE__ */ jsx(Play, { className: "h-3.5 w-3.5" })
+      }
+    ) : null
+  ] }) : null;
+  if (isMobile) {
+    return /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-2 bg-bg px-4 py-2.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        title,
+        actions
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+        summary,
+        usageReadout
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-4 bg-bg px-4 py-2.5", children: [
+    title,
+    summary,
+    usageReadout,
+    actions
+  ] });
+}
+function FilterSelect({
+  status,
+  active,
+  onSelect,
+  t
+}) {
+  const countFor = (filter) => {
+    if (!status) return 0;
+    if (filter === "all") return status.taskCount;
+    return status.byStatus[filter] ?? 0;
+  };
+  const filterLabel = t("orchestrator.filter.label", {
+    defaultValue: "Filter by status"
+  });
+  const { ref, agentProps } = useAgentElement({
+    id: "rail-filter-status",
+    role: "select",
+    label: filterLabel,
+    group: "orchestrator-rail",
+    description: "Filter the task list by status",
+    options: FILTER_OPTIONS,
+    getValue: () => active,
+    onFill: (value) => {
+      if (FILTER_OPTIONS.includes(value)) {
+        onSelect(value);
+      }
+    }
+  });
+  const labelFor = (filter) => filter === "all" ? t("orchestrator.filter.all", { defaultValue: "All" }) : labelStatus(filter, t);
+  return /* @__PURE__ */ jsxs(
+    Select,
+    {
+      value: active,
+      onValueChange: (value) => onSelect(value),
+      children: [
+        /* @__PURE__ */ jsx(
+          SelectTrigger,
+          {
+            ref,
+            "aria-label": filterLabel,
+            "data-testid": "orchestrator-filter",
+            className: "h-9 border-0 bg-transparent px-1 text-xs",
+            ...agentProps,
+            children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+              active !== "all" ? /* @__PURE__ */ jsx(TaskStatusChip, { status: active, t }) : /* @__PURE__ */ jsx("span", { className: "text-txt", children: labelFor("all") }),
+              /* @__PURE__ */ jsxs("span", { className: "text-muted tabular-nums", children: [
+                "(",
+                countFor(active),
+                ")"
+              ] })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectContent, { children: FILTER_OPTIONS.map((filter) => /* @__PURE__ */ jsx(SelectItem, { value: filter, className: "text-xs", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+          filter === "all" ? /* @__PURE__ */ jsx("span", { children: labelFor("all") }) : /* @__PURE__ */ jsx(TaskStatusChip, { status: filter, t }),
+          /* @__PURE__ */ jsxs("span", { className: "text-muted tabular-nums", children: [
+            "(",
+            countFor(filter),
+            ")"
+          ] })
+        ] }) }, filter)) })
+      ]
+    }
+  );
+}
+function orchestratorTaskChips(thread, t, locale) {
+  const lastActivity = thread.latestActivityAt != null ? formatRelativeTime(thread.latestActivityAt, locale) : formatIsoRelative(
+    thread.updatedAt,
+    locale,
+    t("orchestrator.unknown", { defaultValue: "\u2014" })
+  );
+  const PriorityIcon = PRIORITY_ICON[thread.priority];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    thread.sessionCount > 0 ? /* @__PURE__ */ jsx(
+      TaskMetaChip,
+      {
+        icon: /* @__PURE__ */ jsx(Bot, { className: "h-3 w-3" }),
+        tone: thread.activeSessionCount > 0 ? "accent" : "muted",
+        children: t("orchestrator.chip.agents", {
+          defaultValue: "{{active}}/{{total}} agents",
+          active: thread.activeSessionCount,
+          total: thread.sessionCount
+        })
+      }
+    ) : null,
+    thread.paused ? /* @__PURE__ */ jsx(TaskMetaChip, { icon: /* @__PURE__ */ jsx(Pause, { className: "h-3 w-3" }), children: t("orchestrator.status.paused", { defaultValue: "Paused" }) }) : null,
+    PriorityIcon && thread.priority !== "normal" ? /* @__PURE__ */ jsx(TaskMetaChip, { icon: /* @__PURE__ */ jsx(PriorityIcon, { className: "h-3 w-3" }), children: labelPriority(thread.priority, t) }) : null,
+    /* @__PURE__ */ jsx("span", { className: "text-2xs text-muted/80", children: lastActivity })
+  ] });
+}
+function SubAgentCard({
+  session,
+  busy,
+  onInspect,
+  onStop,
+  t,
+  locale
+}) {
+  const stoppable = session.stoppedAt == null && session.status !== "completed";
+  const provider = [session.framework, session.model].filter((part) => Boolean(part)).join(" \xB7 ");
+  const workspace = session.repo || session.workdir || t("orchestrator.noWorkspace", { defaultValue: "None" });
+  const stopLabel = t("orchestrator.action.stopAgent", {
+    defaultValue: "Stop agent"
+  });
+  const inspectLabel = t("orchestrator.action.inspectAgent", {
+    defaultValue: "Inspect agent"
+  });
+  const { ref: inspectRef, agentProps: inspectAgentProps } = useAgentElement({
+    id: `sub-agent-inspect-${session.sessionId}`,
+    role: "button",
+    label: `${inspectLabel}: ${session.label}`,
+    group: "orchestrator-sub-agents",
+    description: `Open recovery and event details for the "${session.label}" sub-agent`
+  });
+  const { ref: stopRef, agentProps: stopAgentProps } = useAgentElement({
+    id: `sub-agent-stop-${session.sessionId}`,
+    role: "button",
+    label: `${stopLabel}: ${session.label}`,
+    group: "orchestrator-sub-agents",
+    description: `Stop the "${session.label}" sub-agent`
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx(SessionGlyph, { status: session.status, t }),
+      /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-xs font-medium text-txt", children: session.label }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          ref: inspectRef,
+          type: "button",
+          onClick: () => onInspect(session.sessionId),
+          className: "flex items-center gap-0.5 px-1 py-0.5 text-2xs text-muted transition-colors hover:text-txt",
+          "data-testid": "orchestrator-inspect-session",
+          "aria-label": inspectLabel,
+          title: inspectLabel,
+          ...inspectAgentProps,
+          children: /* @__PURE__ */ jsx(PanelRightOpen, { className: "h-3 w-3" })
+        }
+      ),
+      stoppable ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          ref: stopRef,
+          type: "button",
+          disabled: busy,
+          onClick: () => onStop(session.sessionId),
+          className: "flex items-center gap-0.5 px-1 py-0.5 text-2xs text-muted transition-colors hover:text-danger disabled:opacity-50",
+          "data-testid": "orchestrator-stop-agent",
+          "aria-label": stopLabel,
+          ...stopAgentProps,
+          children: /* @__PURE__ */ jsx(CircleStop, { className: "h-3 w-3" })
+        }
+      ) : null
+    ] }),
+    provider ? /* @__PURE__ */ jsx("div", { className: "mt-0.5 truncate text-2xs text-muted", children: provider }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex items-center gap-2 text-2xs text-muted", children: [
+      session.activeTool ? /* @__PURE__ */ jsx("span", { className: "truncate text-warn", children: session.activeTool }) : null,
+      /* @__PURE__ */ jsx("span", { className: "ml-auto tabular-nums", children: formatTokenCount(session.usageState, session.totalTokens, t, locale) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "mt-0.5 truncate text-2xs text-muted/80", children: workspace })
+  ] });
+}
+function labelSessionStatus(status, t) {
+  return t(`orchestrator.sessionStatus.${status}`, {
+    defaultValue: status.replace(/_/g, " ")
+  });
+}
+function PlanSection({ plan, t }) {
+  return /* @__PURE__ */ jsxs(InspectorSection, { title: t("orchestrator.plan", { defaultValue: "Plan" }), children: [
+    plan.summary ? /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs-tight text-txt", children: plan.summary }) : null,
+    plan.steps.length > 0 ? /* @__PURE__ */ jsx("ol", { className: "space-y-1", children: plan.steps.map((step, index) => /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: "flex items-start gap-1.5 text-xs-tight text-txt",
+        children: [
+          /* @__PURE__ */ jsxs("span", { className: "mt-px shrink-0 tabular-nums text-muted", children: [
+            index + 1,
+            "."
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", children: step.label }),
+          step.status ? /* @__PURE__ */ jsx(PlanStepGlyph, { status: step.status, t }) : null
+        ]
+      },
+      step.key
+    )) }) : null
+  ] });
+}
+function EditedPlanRestartSection({
+  plan,
+  latestPlanRevisionId,
+  busy,
+  onSubmit,
+  t
+}) {
+  const planSource = useMemo(() => JSON.stringify(plan, null, 2), [plan]);
+  const [open, setOpen] = useState(false);
+  const [draft, setDraft] = useState(planSource);
+  const [summary, setSummary] = useState("");
+  const [error, setError] = useState(null);
+  const toggleLabel = t("orchestrator.action.editPlan", {
+    defaultValue: "Edit plan"
+  });
+  const restartLabel = t("orchestrator.action.restartWithPlan", {
+    defaultValue: "Restart with plan"
+  });
+  const summaryLabel = t("orchestrator.planEdit.summary", {
+    defaultValue: "Edit summary"
+  });
+  const draftLabel = t("orchestrator.planEdit.draft", {
+    defaultValue: "Plan JSON"
+  });
+  const baseLabel = t("orchestrator.planEdit.base", {
+    defaultValue: "Base revision"
+  });
+  const currentPlanLabel = t("orchestrator.planEdit.currentPlan", {
+    defaultValue: "Current plan"
+  });
+  const { ref: toggleRef, agentProps: toggleAgentProps } = useAgentElement({
+    id: "inspector-plan-edit-toggle",
+    role: "button",
+    label: toggleLabel,
+    group: "orchestrator-inspector",
+    description: "Open the plan JSON editor"
+  });
+  const { ref: restartRef, agentProps: restartAgentProps } = useAgentElement({
+    id: "inspector-restart-edited-plan",
+    role: "button",
+    label: restartLabel,
+    group: "orchestrator-inspector",
+    description: "Restart this task with the edited plan"
+  });
+  useEffect(() => {
+    setDraft(planSource);
+    setSummary("");
+    setError(null);
+  }, [planSource]);
+  const submit = () => {
+    let parsed;
+    try {
+      parsed = JSON.parse(draft);
+    } catch {
+      setError(
+        t("orchestrator.planEdit.invalidJson", {
+          defaultValue: "Plan must be valid JSON."
+        })
+      );
+      return;
+    }
+    if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
+      setError(
+        t("orchestrator.planEdit.invalidObject", {
+          defaultValue: "Plan must be a JSON object."
+        })
+      );
+      return;
+    }
+    const confirmed = typeof window === "undefined" || window.confirm(
+      t("orchestrator.confirmRestartWithPlan", {
+        defaultValue: "Restart this task with the edited plan? Active agents will be stopped first."
+      })
+    );
+    if (!confirmed) return;
+    setError(null);
+    onSubmit({
+      plan: parsed,
+      basePlanRevisionId: latestPlanRevisionId,
+      editSummary: summary.trim() || void 0,
+      stopActive: true
+    });
+  };
+  return /* @__PURE__ */ jsxs(
+    InspectorSection,
+    {
+      title: t("orchestrator.planEdit.title", {
+        defaultValue: "Plan editor"
+      }),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 text-2xs text-muted", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-semibold text-muted-strong", children: baseLabel }),
+            /* @__PURE__ */ jsx("span", { className: "ml-1 truncate", children: latestPlanRevisionId ?? currentPlanLabel })
+          ] }),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              ref: toggleRef,
+              type: "button",
+              disabled: busy,
+              onClick: () => setOpen((prev) => !prev),
+              className: "inline-flex h-7 shrink-0 items-center gap-1.5 px-1 text-2xs font-semibold text-muted transition-colors hover:text-txt disabled:opacity-50",
+              "data-testid": "orchestrator-plan-edit-toggle",
+              ...toggleAgentProps,
+              children: [
+                open ? /* @__PURE__ */ jsx(ChevronUp, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "h-3 w-3" }),
+                toggleLabel
+              ]
+            }
+          )
+        ] }),
+        open ? /* @__PURE__ */ jsxs("div", { className: "mt-2 space-y-2", children: [
+          /* @__PURE__ */ jsxs("label", { className: "block", children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: summaryLabel }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                value: summary,
+                onChange: (event) => setSummary(event.target.value),
+                className: FIELD_CLASS,
+                placeholder: t("orchestrator.planEdit.summaryPlaceholder", {
+                  defaultValue: "What changed"
+                }),
+                "data-testid": "orchestrator-plan-edit-summary"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("label", { className: "block", children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: draftLabel }),
+            /* @__PURE__ */ jsx(
+              "textarea",
+              {
+                value: draft,
+                onChange: (event) => setDraft(event.target.value),
+                rows: 8,
+                className: `${FIELD_CLASS} resize-y font-mono leading-relaxed`,
+                spellCheck: false,
+                "data-testid": "orchestrator-plan-draft"
+              }
+            )
+          ] }),
+          error ? /* @__PURE__ */ jsx("p", { className: "text-2xs text-danger", children: error }) : null,
+          /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs(
+            Button,
+            {
+              ref: restartRef,
+              type: "button",
+              size: "sm",
+              disabled: busy,
+              onClick: submit,
+              className: "h-7 gap-1.5 px-2.5 text-xs-tight",
+              "data-testid": "orchestrator-plan-restart",
+              ...restartAgentProps,
+              children: [
+                /* @__PURE__ */ jsx(RotateCcw, { className: "h-3 w-3" }),
+                restartLabel
+              ]
+            }
+          ) })
+        ] }) : null
+      ]
+    }
+  );
+}
+function AcceptanceSection({
+  criteria,
+  t
+}) {
+  return /* @__PURE__ */ jsx(
+    InspectorSection,
+    {
+      title: t("orchestrator.acceptance", { defaultValue: "Acceptance" }),
+      children: /* @__PURE__ */ jsx("ul", { className: "space-y-1", children: criteria.map((criterion, index) => /* @__PURE__ */ jsxs(
+        "li",
+        {
+          className: "flex items-start gap-1.5 text-xs-tight text-txt",
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "mt-1 inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-accent/60" }),
+            /* @__PURE__ */ jsx("span", { children: criterion })
+          ]
+        },
+        `${criterion}-${index}`
+      )) })
+    }
+  );
+}
+function ArtifactSection({
+  artifacts,
+  t
+}) {
+  return /* @__PURE__ */ jsx(
+    InspectorSection,
+    {
+      title: t("orchestrator.artifacts", { defaultValue: "Artifacts" }),
+      children: /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: artifacts.map((artifact) => /* @__PURE__ */ jsxs("div", { className: "text-xs-tight", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-medium text-txt", children: artifact.title }),
+          /* @__PURE__ */ jsx(VerificationGlyph, { status: artifact.verificationStatus, t })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "truncate text-muted", children: [
+          artifact.artifactType,
+          artifact.path || artifact.uri ? ` \xB7 ${artifact.path ?? artifact.uri}` : ""
+        ] })
+      ] }, artifact.id)) })
+    }
+  );
+}
+function UsageSection({
+  usage,
+  t,
+  locale
+}) {
+  return /* @__PURE__ */ jsxs(
+    InspectorSection,
+    {
+      title: t("orchestrator.usage.title", { defaultValue: "Tokens & cost" }),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-3 text-xs", children: [
+          /* @__PURE__ */ jsxs("span", { className: "text-txt", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-semibold tabular-nums", children: renderTokens(usage, t, locale) }),
+            " ",
+            /* @__PURE__ */ jsx("span", { className: "text-muted", children: t("orchestrator.usage.tokens", { defaultValue: "tokens" }) })
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "text-txt", children: /* @__PURE__ */ jsx("span", { className: "font-semibold tabular-nums", children: renderCost(usage, t, locale) }) })
+        ] }),
+        usage.byProvider.length > 1 ? /* @__PURE__ */ jsx("div", { className: "space-y-1", children: usage.byProvider.map((entry) => /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center gap-2 text-2xs text-muted",
+            children: [
+              /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 truncate", children: [
+                entry.provider,
+                entry.model ? ` \xB7 ${entry.model}` : ""
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "shrink-0 tabular-nums", children: formatTokenCount(entry.state, entry.totalTokens, t, locale) }),
+              /* @__PURE__ */ jsx("span", { className: "shrink-0 tabular-nums", children: entry.state === "unavailable" ? t("orchestrator.usage.unavailable", { defaultValue: "\u2014" }) : formatUsd(entry.costUsd, locale) })
+            ]
+          },
+          `${entry.provider}-${entry.model ?? "default"}`
+        )) }) : null
+      ]
+    }
+  );
+}
+const FIELD_CLASS = "w-full border-border/35 border-b bg-transparent px-1 py-1.5 text-xs text-txt outline-none transition-colors placeholder:text-muted focus:border-accent/60";
+function FieldLabel({ children }) {
+  return /* @__PURE__ */ jsx("span", { className: "mb-1 block text-xs font-medium text-muted", children });
+}
+function AddAgentForm({
+  busy,
+  onClose,
+  onSubmit,
+  t
+}) {
+  const [label, setLabel] = useState("");
+  const [framework, setFramework] = useState("");
+  const [model, setModel] = useState("");
+  const [workdir, setWorkdir] = useState("");
+  const [repo, setRepo] = useState("");
+  const [task, setTask] = useState("");
+  const fieldLabels = {
+    label: t("orchestrator.addAgent.label", {
+      defaultValue: "Label (optional)"
+    }),
+    framework: t("orchestrator.addAgent.framework", {
+      defaultValue: "Framework"
+    }),
+    model: t("orchestrator.addAgent.model", { defaultValue: "Model" }),
+    workdir: t("orchestrator.addAgent.workdir", {
+      defaultValue: "Workdir (optional)"
+    }),
+    repo: t("orchestrator.addAgent.repo", {
+      defaultValue: "Repo URL (optional)"
+    }),
+    task: t("orchestrator.addAgent.task", {
+      defaultValue: "Sub-task for this agent (optional)"
+    })
+  };
+  const spawnLabel = t("orchestrator.action.spawn", {
+    defaultValue: "Spawn agent"
+  });
+  const cancelLabel = t("orchestrator.action.cancel", {
+    defaultValue: "Cancel"
+  });
+  const spawn = () => onSubmit({
+    label: label.trim() || void 0,
+    framework: framework.trim() || void 0,
+    model: model.trim() || void 0,
+    workdir: workdir.trim() || void 0,
+    repo: repo.trim() || void 0,
+    task: task.trim() || void 0
+  });
+  const { ref: labelRef, agentProps: labelAgentProps } = useAgentElement({
+    id: "add-agent-label",
+    role: "text-input",
+    label: fieldLabels.label,
+    group: "orchestrator-add-agent",
+    description: "Optional label for the spawned sub-agent",
+    getValue: () => label,
+    onFill: (value) => setLabel(value)
+  });
+  const { ref: frameworkRef, agentProps: frameworkAgentProps } = useAgentElement({
+    id: "add-agent-framework",
+    role: "text-input",
+    label: fieldLabels.framework,
+    group: "orchestrator-add-agent",
+    description: "Coding-agent framework for the sub-agent",
+    getValue: () => framework,
+    onFill: (value) => setFramework(value)
+  });
+  const { ref: modelRef, agentProps: modelAgentProps } = useAgentElement({
+    id: "add-agent-model",
+    role: "text-input",
+    label: fieldLabels.model,
+    group: "orchestrator-add-agent",
+    description: "Model for the sub-agent",
+    getValue: () => model,
+    onFill: (value) => setModel(value)
+  });
+  const { ref: workdirRef, agentProps: workdirAgentProps } = useAgentElement({
+    id: "add-agent-workdir",
+    role: "text-input",
+    label: fieldLabels.workdir,
+    group: "orchestrator-add-agent",
+    description: "Optional working directory for the sub-agent",
+    getValue: () => workdir,
+    onFill: (value) => setWorkdir(value)
+  });
+  const { ref: repoRef, agentProps: repoAgentProps } = useAgentElement({
+    id: "add-agent-repo",
+    role: "text-input",
+    label: fieldLabels.repo,
+    group: "orchestrator-add-agent",
+    description: "Optional repo URL for the sub-agent",
+    getValue: () => repo,
+    onFill: (value) => setRepo(value)
+  });
+  const { ref: taskRef, agentProps: taskAgentProps } = useAgentElement({
+    id: "add-agent-task",
+    role: "textarea",
+    label: fieldLabels.task,
+    group: "orchestrator-add-agent",
+    description: "Optional sub-task description for the sub-agent",
+    getValue: () => task,
+    onFill: (value) => setTask(value)
+  });
+  const { ref: cancelRef, agentProps: cancelAgentProps } = useAgentElement({
+    id: "add-agent-cancel",
+    role: "button",
+    label: cancelLabel,
+    group: "orchestrator-add-agent",
+    description: "Cancel adding a sub-agent"
+  });
+  const { ref: spawnRef, agentProps: spawnAgentProps } = useAgentElement({
+    id: "add-agent-spawn",
+    role: "button",
+    label: spawnLabel,
+    group: "orchestrator-add-agent",
+    description: "Spawn a new sub-agent on this task",
+    onActivate: () => {
+      if (!busy) spawn();
+    }
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "mt-1.5 space-y-1.5", children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: labelRef,
+        value: label,
+        onChange: (event) => setLabel(event.target.value),
+        className: FIELD_CLASS,
+        placeholder: fieldLabels.label,
+        "aria-label": fieldLabels.label,
+        "data-testid": "orchestrator-add-agent-label",
+        ...labelAgentProps
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-1.5", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: frameworkRef,
+          value: framework,
+          onChange: (event) => setFramework(event.target.value),
+          className: FIELD_CLASS,
+          placeholder: fieldLabels.framework,
+          "aria-label": fieldLabels.framework,
+          ...frameworkAgentProps
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: modelRef,
+          value: model,
+          onChange: (event) => setModel(event.target.value),
+          className: FIELD_CLASS,
+          placeholder: fieldLabels.model,
+          "aria-label": fieldLabels.model,
+          ...modelAgentProps
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: workdirRef,
+        value: workdir,
+        onChange: (event) => setWorkdir(event.target.value),
+        className: FIELD_CLASS,
+        placeholder: fieldLabels.workdir,
+        "aria-label": fieldLabels.workdir,
+        ...workdirAgentProps
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: repoRef,
+        value: repo,
+        onChange: (event) => setRepo(event.target.value),
+        className: FIELD_CLASS,
+        placeholder: fieldLabels.repo,
+        "aria-label": fieldLabels.repo,
+        ...repoAgentProps
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref: taskRef,
+        value: task,
+        onChange: (event) => setTask(event.target.value),
+        rows: 2,
+        className: `${FIELD_CLASS} resize-none`,
+        placeholder: fieldLabels.task,
+        "aria-label": fieldLabels.task,
+        ...taskAgentProps
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          ref: cancelRef,
+          variant: "secondary",
+          size: "sm",
+          onClick: onClose,
+          className: "h-6 px-2 text-2xs",
+          ...cancelAgentProps,
+          children: cancelLabel
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          ref: spawnRef,
+          size: "sm",
+          disabled: busy,
+          onClick: spawn,
+          className: "h-6 px-2 text-2xs",
+          "data-testid": "orchestrator-add-agent-submit",
+          ...spawnAgentProps,
+          children: spawnLabel
+        }
+      )
+    ] })
+  ] });
+}
+function ControlButton({
+  agentId,
+  description,
+  icon,
+  label,
+  onClick,
+  disabled,
+  tone = "neutral",
+  testId
+}) {
+  const { ref, agentProps } = useAgentElement({
+    id: agentId,
+    role: "button",
+    label,
+    group: "orchestrator-inspector",
+    description
+  });
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref,
+      type: "button",
+      disabled,
+      onClick,
+      "aria-label": label,
+      title: label,
+      className: `flex items-center justify-center p-1.5 transition-colors disabled:opacity-50 ${tone === "danger" ? "text-muted hover:text-danger" : "text-muted hover:text-txt"}`,
+      "data-testid": testId,
+      ...agentProps,
+      children: icon
+    }
+  );
+}
+function RecoveryActionButton({
+  agentId,
+  description,
+  icon,
+  label,
+  onClick,
+  disabled,
+  testId
+}) {
+  const { ref, agentProps } = useAgentElement({
+    id: agentId,
+    role: "button",
+    label,
+    group: "orchestrator-operator-detail",
+    description
+  });
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      disabled,
+      onClick,
+      className: "inline-flex h-7 items-center gap-1.5 px-1 text-2xs font-semibold text-muted transition-colors hover:text-txt disabled:opacity-50",
+      "data-testid": testId,
+      ...agentProps,
+      children: [
+        icon,
+        label
+      ]
+    }
+  );
+}
+function TaskInspector({
+  detail,
+  className,
+  style,
+  onClose,
+  busy,
+  addAgentOpen,
+  onPause,
+  onResume,
+  onArchive,
+  onReopen,
+  onDelete,
+  onFork,
+  onRestart,
+  onRestartWithEditedPlan,
+  onValidate,
+  onSetPriority,
+  onToggleAddAgent,
+  onAddAgent,
+  onInspectSession,
+  onStopAgent,
+  onCopyLink,
+  t,
+  locale
+}) {
+  const plan = normalizePlan(detail.currentPlan);
+  const sessions = [...detail.sessions].sort(
+    (a, b) => b.lastActivityAt - a.lastActivityAt
+  );
+  const latestChangeSet = sessions.map((session) => readSessionChangeSet(session.metadata)).find((value) => value !== void 0);
+  const artifacts = [...detail.artifacts].reverse().slice(0, 12);
+  const latestPlanRevisionId = detail.planRevisions.length > 0 ? detail.planRevisions[detail.planRevisions.length - 1]?.id : void 0;
+  const archived = detail.status === "archived";
+  const terminal = TERMINAL_TASK_STATUSES.has(detail.status);
+  const providerPolicyLine = detail.providerPolicy ? [
+    detail.providerPolicy.preferredFramework,
+    detail.providerPolicy.providerSource,
+    detail.providerPolicy.model
+  ].filter((part) => Boolean(part)).join(" \xB7 ") : "";
+  const closeDetailsLabel = t("orchestrator.action.closeDetails", {
+    defaultValue: "Close details"
+  });
+  const setPriorityLabel = t("orchestrator.action.setPriority", {
+    defaultValue: "Set priority"
+  });
+  const { ref: closeRef, agentProps: closeAgentProps } = useAgentElement({
+    id: "inspector-close",
+    role: "button",
+    label: closeDetailsLabel,
+    group: "orchestrator-inspector",
+    description: "Close the task details panel"
+  });
+  const { ref: priorityRef, agentProps: priorityAgentProps } = useAgentElement({
+    id: "inspector-priority",
+    role: "select",
+    label: setPriorityLabel,
+    group: "orchestrator-inspector",
+    description: "Set the priority of this task",
+    options: ["low", "normal", "high", "urgent"],
+    getValue: () => detail.priority,
+    onFill: (value) => {
+      const next = paramPriority(value);
+      if (next && next !== detail.priority) onSetPriority(next);
+    }
+  });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `shrink-0 flex-col gap-4 overflow-y-auto bg-bg p-3 ${className ?? "flex w-80"}`,
+      style,
+      "data-testid": "orchestrator-inspector",
+      children: [
+        onClose ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx("h3", { className: "text-xs font-medium text-muted", children: t("orchestrator.inspector.title", { defaultValue: "Details" }) }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              ref: closeRef,
+              type: "button",
+              onClick: onClose,
+              className: "-mr-1 p-1 text-muted transition-colors hover:text-txt",
+              "aria-label": closeDetailsLabel,
+              "data-testid": "orchestrator-close-inspector",
+              ...closeAgentProps,
+              children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+            }
+          )
+        ] }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1", children: [
+          detail.status === "validating" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              ControlButton,
+              {
+                agentId: "inspector-approve",
+                description: "Approve the task validation",
+                icon: /* @__PURE__ */ jsx(Check, { className: "h-3 w-3" }),
+                label: t("orchestrator.action.approve", {
+                  defaultValue: "Approve"
+                }),
+                onClick: () => onValidate(true),
+                disabled: busy,
+                testId: "orchestrator-approve"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ControlButton,
+              {
+                agentId: "inspector-reject",
+                description: "Reject the task validation",
+                icon: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" }),
+                label: t("orchestrator.action.reject", {
+                  defaultValue: "Reject"
+                }),
+                onClick: () => onValidate(false),
+                disabled: busy,
+                tone: "danger",
+                testId: "orchestrator-reject"
+              }
+            )
+          ] }) : null,
+          archived ? /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-reopen",
+              description: "Reopen this archived task",
+              icon: /* @__PURE__ */ jsx(RotateCcw, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.reopen", { defaultValue: "Reopen" }),
+              onClick: onReopen,
+              disabled: busy,
+              testId: "orchestrator-reopen"
+            }
+          ) : terminal ? null : detail.paused ? /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-resume",
+              description: "Resume this paused task",
+              icon: /* @__PURE__ */ jsx(Play, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.resume", { defaultValue: "Resume" }),
+              onClick: onResume,
+              disabled: busy,
+              testId: "orchestrator-inspector-resume"
+            }
+          ) : /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-pause",
+              description: "Pause this task",
+              icon: /* @__PURE__ */ jsx(Pause, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.pause", { defaultValue: "Pause" }),
+              onClick: onPause,
+              disabled: busy,
+              testId: "orchestrator-inspector-pause"
+            }
+          ),
+          archived ? null : /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-archive",
+              description: "Archive this task",
+              icon: /* @__PURE__ */ jsx(Archive, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.archive", {
+                defaultValue: "Archive"
+              }),
+              onClick: onArchive,
+              disabled: busy,
+              testId: "orchestrator-inspector-archive"
+            }
+          ),
+          terminal ? null : /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-fork",
+              description: "Fork this task into a new task",
+              icon: /* @__PURE__ */ jsx(GitFork, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.fork", { defaultValue: "Fork" }),
+              onClick: onFork,
+              disabled: busy,
+              testId: "orchestrator-fork"
+            }
+          ),
+          terminal ? null : /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-restart",
+              description: "Restart this task with a fresh worker",
+              icon: /* @__PURE__ */ jsx(RotateCcw, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.restart", {
+                defaultValue: "Restart"
+              }),
+              onClick: onRestart,
+              disabled: busy,
+              testId: "orchestrator-inspector-restart"
+            }
+          ),
+          terminal ? null : /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-add-agent",
+              description: "Open the add-agent form for this task",
+              icon: /* @__PURE__ */ jsx(UserPlus, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.addAgent", {
+                defaultValue: "Add agent"
+              }),
+              onClick: onToggleAddAgent,
+              disabled: busy,
+              testId: "orchestrator-add-agent"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ControlButton,
+            {
+              agentId: "inspector-copy-link",
+              description: "Copy a deep link to this task",
+              icon: /* @__PURE__ */ jsx(Copy, { className: "h-3 w-3" }),
+              label: t("orchestrator.action.copyLink", {
+                defaultValue: "Copy link"
+              }),
+              onClick: onCopyLink,
+              disabled: busy,
+              testId: "orchestrator-copy-link"
+            }
+          ),
+          terminal ? null : /* @__PURE__ */ jsxs(
+            "select",
+            {
+              ref: priorityRef,
+              "aria-label": setPriorityLabel,
+              value: detail.priority,
+              disabled: busy,
+              onChange: (event) => {
+                const next = paramPriority(event.target.value);
+                if (next && next !== detail.priority) onSetPriority(next);
+              },
+              className: "border-border/35 border-b bg-transparent px-1 py-1 text-2xs text-muted transition-colors hover:border-accent/60 hover:text-txt disabled:opacity-50",
+              "data-testid": "orchestrator-priority-select",
+              ...priorityAgentProps,
+              children: [
+                /* @__PURE__ */ jsx("option", { value: "low", children: labelPriority("low", t) }),
+                /* @__PURE__ */ jsx("option", { value: "normal", children: labelPriority("normal", t) }),
+                /* @__PURE__ */ jsx("option", { value: "high", children: labelPriority("high", t) }),
+                /* @__PURE__ */ jsx("option", { value: "urgent", children: labelPriority("urgent", t) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(AlertDialog, { children: [
+            /* @__PURE__ */ jsx(AlertDialogTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+              ControlButton,
+              {
+                agentId: "inspector-delete",
+                description: "Delete this task",
+                icon: /* @__PURE__ */ jsx(Trash2, { className: "h-3 w-3" }),
+                label: t("orchestrator.action.delete", {
+                  defaultValue: "Delete"
+                }),
+                onClick: () => {
+                },
+                disabled: busy,
+                tone: "danger",
+                testId: "orchestrator-delete"
+              }
+            ) }),
+            /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
+              /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
+                /* @__PURE__ */ jsx(AlertDialogTitle, { children: t("orchestrator.confirmDeleteTitle", {
+                  defaultValue: "Delete task?"
+                }) }),
+                /* @__PURE__ */ jsx(AlertDialogDescription, { children: t("orchestrator.confirmDelete", {
+                  defaultValue: "Delete this task and its transcript? This can't be undone."
+                }) })
+              ] }),
+              /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
+                /* @__PURE__ */ jsx(AlertDialogCancel, { children: t("orchestrator.action.cancel", { defaultValue: "Cancel" }) }),
+                /* @__PURE__ */ jsx(
+                  AlertDialogAction,
+                  {
+                    onClick: onDelete,
+                    className: "bg-red-600 hover:bg-red-700",
+                    children: t("orchestrator.action.delete", { defaultValue: "Delete" })
+                  }
+                )
+              ] })
+            ] })
+          ] })
+        ] }),
+        addAgentOpen && !terminal ? /* @__PURE__ */ jsx(
+          AddAgentForm,
+          {
+            busy,
+            onClose: onToggleAddAgent,
+            onSubmit: onAddAgent,
+            t
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs(
+          InspectorSection,
+          {
+            title: t("orchestrator.goal", { defaultValue: "Goal" }),
+            children: [
+              /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs-tight text-txt", children: detail.goal || detail.originalRequest }),
+              detail.parentTaskId ? /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-2xs text-muted", children: t("orchestrator.forkedFrom", {
+                defaultValue: "Forked from {{id}}",
+                id: detail.parentTaskId
+              }) }) : null
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          InspectorSection,
+          {
+            title: t("orchestrator.subAgents", { defaultValue: "Sub-agents" }),
+            children: sessions.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: t("orchestrator.noSubAgents", {
+              defaultValue: "No sub-agents spawned yet."
+            }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: sessions.map((session) => /* @__PURE__ */ jsx(
+              SubAgentCard,
+              {
+                session,
+                busy,
+                onInspect: onInspectSession,
+                onStop: onStopAgent,
+                t,
+                locale
+              },
+              session.id
+            )) })
+          }
+        ),
+        latestChangeSet ? /* @__PURE__ */ jsx(
+          InspectorSection,
+          {
+            title: t("orchestrator.changes", { defaultValue: "Changes" }),
+            children: /* @__PURE__ */ jsx(DiffReviewPanel, { changeSet: latestChangeSet })
+          }
+        ) : null,
+        plan ? /* @__PURE__ */ jsx(PlanSection, { plan, t }) : null,
+        detail.currentPlan && !terminal ? /* @__PURE__ */ jsx(
+          EditedPlanRestartSection,
+          {
+            plan: detail.currentPlan,
+            latestPlanRevisionId,
+            busy,
+            onSubmit: onRestartWithEditedPlan,
+            t
+          }
+        ) : null,
+        detail.acceptanceCriteria.length > 0 ? /* @__PURE__ */ jsx(AcceptanceSection, { criteria: detail.acceptanceCriteria, t }) : null,
+        artifacts.length > 0 ? /* @__PURE__ */ jsx(ArtifactSection, { artifacts, t }) : null,
+        /* @__PURE__ */ jsx(UsageSection, { usage: detail.usage, t, locale }),
+        providerPolicyLine ? /* @__PURE__ */ jsx(
+          InspectorSection,
+          {
+            title: t("orchestrator.providerPolicy", {
+              defaultValue: "Provider policy"
+            }),
+            children: /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-txt", children: providerPolicyLine })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function compactText(value, max = 6e3) {
+  if (value.length <= max) return value;
+  return `${value.slice(0, max).trimEnd()}
+
+\u2026 ${(value.length - max).toLocaleString()} characters truncated`;
+}
+function hasRecordEntries(value) {
+  return Boolean(value && Object.keys(value).length > 0);
+}
+function readSessionChangeSet(metadata) {
+  const raw = metadata.lastChangeSet;
+  if (!raw || typeof raw !== "object") return void 0;
+  const candidate = raw;
+  if (!Array.isArray(candidate.changedFiles)) return void 0;
+  if (typeof candidate.diff !== "string") return void 0;
+  if (typeof candidate.diffStat !== "string") return void 0;
+  if (typeof candidate.truncated !== "boolean") return void 0;
+  if (typeof candidate.capturedAt !== "number") return void 0;
+  return candidate;
+}
+function JsonBlock({
+  value,
+  emptyLabel
+}) {
+  const empty = value === null || value === void 0 || Array.isArray(value) && value.length === 0 || typeof value === "object" && !Array.isArray(value) && Object.keys(value).length === 0;
+  if (empty) {
+    return /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: emptyLabel });
+  }
+  const text = typeof value === "string" ? value : JSON.stringify(value, null, 2);
+  return /* @__PURE__ */ jsx(
+    "pre",
+    {
+      className: "max-h-72 overflow-auto bg-bg/60 px-2.5 py-1.5 font-mono text-2xs leading-relaxed text-muted",
+      "data-testid": "orchestrator-detail-json",
+      children: compactText(text)
+    }
+  );
+}
+function DetailRow({ label, value }) {
+  if (value === null || value === void 0 || value === "") return null;
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[5.25rem_minmax(0,1fr)] gap-2 text-xs-tight", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-muted", children: label }),
+    /* @__PURE__ */ jsx("span", { className: "min-w-0 break-words text-txt", children: value })
+  ] });
+}
+function OperatorTabs({
+  active,
+  onSelect,
+  t
+}) {
+  const tabs = [
+    {
+      id: "input",
+      label: t("orchestrator.detail.tabs.input", { defaultValue: "Input" })
+    },
+    {
+      id: "output",
+      label: t("orchestrator.detail.tabs.output", { defaultValue: "Output" })
+    },
+    {
+      id: "events",
+      label: t("orchestrator.detail.tabs.events", { defaultValue: "Events" })
+    },
+    {
+      id: "usage",
+      label: t("orchestrator.detail.tabs.usage", { defaultValue: "Usage" })
+    }
+  ];
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "flex gap-2",
+      role: "tablist",
+      "aria-label": t("orchestrator.detail.tabsLabel", {
+        defaultValue: "Detail tabs"
+      }),
+      children: tabs.map((tab) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": active === tab.id,
+          onClick: () => onSelect(tab.id),
+          className: `flex-1 px-1 py-1 text-xs font-medium transition-colors ${active === tab.id ? "text-accent" : "text-muted hover:text-txt"}`,
+          children: tab.label
+        },
+        tab.id
+      ))
+    }
+  );
+}
+function sessionUsage(session) {
+  return {
+    inputTokens: session.inputTokens,
+    outputTokens: session.outputTokens,
+    reasoningTokens: session.reasoningTokens,
+    cacheTokens: session.cacheTokens,
+    totalTokens: session.totalTokens,
+    costUsd: session.costUsd,
+    state: session.usageState,
+    byProvider: [
+      {
+        provider: session.providerSource ?? session.framework,
+        model: session.model ?? void 0,
+        inputTokens: session.inputTokens,
+        outputTokens: session.outputTokens,
+        reasoningTokens: session.reasoningTokens,
+        cacheTokens: session.cacheTokens,
+        totalTokens: session.totalTokens,
+        costUsd: session.costUsd,
+        state: session.usageState
+      }
+    ]
+  };
+}
+function blockEventIds(block) {
+  if (block.kind === "tool") return block.tool.eventIds;
+  if (block.kind === "reasoning") return block.eventIds;
+  if (block.kind === "notice") return [block.eventId];
+  return [];
+}
+function blockMessageIds(block) {
+  if (block.kind === "user" || block.kind === "agent") return block.messageIds;
+  return [];
+}
+function blockSelection(block) {
+  return {
+    kind: "block",
+    blockKey: block.key,
+    blockKind: block.kind,
+    eventIds: blockEventIds(block),
+    messageIds: blockMessageIds(block)
+  };
+}
+function blockMatchesSelection(block, selection) {
+  if (block.key === selection.blockKey) return true;
+  if (block.kind !== selection.blockKind) return false;
+  const eventIds = blockEventIds(block);
+  if (selection.eventIds.length > 0 && selection.eventIds.some((id) => eventIds.includes(id))) {
+    return true;
+  }
+  const messageIds = blockMessageIds(block);
+  return selection.messageIds.length > 0 && selection.messageIds.some((id) => messageIds.includes(id));
+}
+function blockSelectionKey(selection) {
+  if (selection.kind === "session") return `session:${selection.sessionId}`;
+  return [
+    "block",
+    selection.blockKey,
+    selection.blockKind,
+    selection.eventIds.join(","),
+    selection.messageIds.join(",")
+  ].join(":");
+}
+function blockTitle(block, t) {
+  if (block.kind === "tool") return block.tool.title;
+  if (block.kind === "agent") return block.senderName;
+  if (block.kind === "user")
+    return t("orchestrator.detail.userTurn", { defaultValue: "User turn" });
+  if (block.kind === "reasoning")
+    return t("orchestrator.detail.reasoning", { defaultValue: "Reasoning" });
+  return block.eventType.replace(/_/g, " ");
+}
+function eventError(events, t) {
+  const error = events.find((event) => event.eventType === "error");
+  if (!error) return null;
+  const message = typeof error.data?.message === "string" ? error.data.message : typeof error.data?.error === "string" ? error.data.error : error.summary;
+  return message.trim() || t("orchestrator.detail.errorFallback", { defaultValue: "Error" });
+}
+function blockError(block, events, t) {
+  const fromEvent = eventError(events, t);
+  if (fromEvent) return fromEvent;
+  if (!block) return null;
+  if (block.kind === "agent" && block.tone === "error") {
+    return compactText(block.content, 600);
+  }
+  if (block.kind === "notice" && block.eventType === "error") {
+    return block.text;
+  }
+  if (block.kind === "tool" && block.tool.status === "failed") {
+    if (block.tool.output) return compactText(block.tool.output, 600);
+    if (typeof block.tool.exitCode === "number") {
+      return t("orchestrator.detail.toolExited", {
+        defaultValue: `Tool exited with code ${block.tool.exitCode}.`,
+        code: block.tool.exitCode
+      });
+    }
+    return block.tool.rawStatus ?? t("orchestrator.detail.toolFailed", { defaultValue: "Tool failed." });
+  }
+  return null;
+}
+function sessionError(session, t) {
+  if (session.status !== "error" && session.status !== "errored") return null;
+  return session.completionSummary ?? session.activeTool ?? t("orchestrator.detail.sessionFailed", {
+    defaultValue: "Session failed."
+  });
+}
+function ErrorFirstBanner({ text }) {
+  if (!text) return null;
+  return /* @__PURE__ */ jsx("div", { className: "rounded-md bg-red-500/10 px-2.5 py-2 text-xs-tight text-red-500", children: text });
+}
+function OperatorDrawerShell({
+  title,
+  subtitle,
+  closeLabel,
+  className,
+  style,
+  onClose,
+  children
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `shrink-0 flex-col gap-2.5 overflow-y-auto bg-bg p-3 ${className ?? "flex w-80"}`,
+      style,
+      "data-testid": "orchestrator-operator-detail",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsx("h3", { className: "truncate text-xs font-medium text-muted", children: title }),
+            /* @__PURE__ */ jsx("p", { className: "mt-0.5 truncate text-xs-tight font-medium text-txt", children: subtitle })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: onClose,
+              className: "-mr-1 p-1 text-muted transition-colors hover:text-txt",
+              "aria-label": closeLabel,
+              "data-testid": "orchestrator-close-operator-detail",
+              children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+            }
+          )
+        ] }),
+        children
+      ]
+    }
+  );
+}
+function EventList({
+  events,
+  messages,
+  locale,
+  t
+}) {
+  if (events.length === 0 && messages.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: t("orchestrator.detail.noEvents", {
+      defaultValue: "No events captured."
+    }) });
+  }
+  const timeline = [
+    ...messages.map((message) => ({
+      kind: "message",
+      id: message.id,
+      timestamp: message.timestamp,
+      record: message
+    })),
+    ...events.map((event) => ({
+      kind: "event",
+      id: event.id,
+      timestamp: event.timestamp,
+      record: event
+    }))
+  ].sort((a, b) => a.timestamp - b.timestamp);
+  return /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: timeline.map((item) => {
+    if (item.kind === "message") {
+      const message = item.record;
+      return /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center gap-2 text-2xs text-muted", children: [
+          /* @__PURE__ */ jsx("span", { className: "font-semibold text-txt", children: message.senderKind }),
+          /* @__PURE__ */ jsx("span", { children: message.direction }),
+          /* @__PURE__ */ jsx("span", { className: "ml-auto tabular-nums", children: formatClockTime(message.timestamp, locale) })
+        ] }),
+        /* @__PURE__ */ jsx(
+          JsonBlock,
+          {
+            value: message,
+            emptyLabel: t("orchestrator.detail.noMessagePayload", {
+              defaultValue: "No message payload."
+            })
+          }
+        )
+      ] }, `message-${message.id}`);
+    }
+    const event = item.record;
+    return /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center gap-2 text-2xs text-muted", children: [
+        /* @__PURE__ */ jsx("span", { className: "font-semibold text-txt", children: event.eventType.replace(/_/g, " ") }),
+        /* @__PURE__ */ jsx("span", { className: "ml-auto tabular-nums", children: formatClockTime(event.timestamp, locale) })
+      ] }),
+      event.summary ? /* @__PURE__ */ jsx("p", { className: "mb-1 text-xs-tight text-txt", children: event.summary }) : null,
+      /* @__PURE__ */ jsx(
+        JsonBlock,
+        {
+          value: event.data,
+          emptyLabel: t("orchestrator.detail.noEventData", {
+            defaultValue: "No event data."
+          })
+        }
+      )
+    ] }, `event-${event.id}`);
+  }) });
+}
+function OperatorDetailDrawer({
+  selection,
+  block,
+  session,
+  events,
+  messages,
+  taskUsage,
+  busy,
+  className,
+  style,
+  onClose,
+  onRetry,
+  onRerun,
+  t,
+  locale
+}) {
+  const [tab, setTab] = useState("input");
+  const closeDetailsLabel = t("orchestrator.detail.close", {
+    defaultValue: "Close details"
+  });
+  const label = (key, defaultValue) => t(`orchestrator.detail.${key}`, { defaultValue });
+  if (selection.kind === "session" && !session) {
+    return /* @__PURE__ */ jsx(
+      OperatorDrawerShell,
+      {
+        title: t("orchestrator.detail.session", { defaultValue: "Session" }),
+        subtitle: t("orchestrator.detail.noLongerAvailable", {
+          defaultValue: "No longer available"
+        }),
+        closeLabel: closeDetailsLabel,
+        className,
+        style,
+        onClose,
+        children: /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: t("orchestrator.detail.sessionDataChanged", {
+          defaultValue: "Session data changed."
+        }) })
+      }
+    );
+  }
+  if (selection.kind === "block" && !block) {
+    return /* @__PURE__ */ jsx(
+      OperatorDrawerShell,
+      {
+        title: t("orchestrator.detail.event", { defaultValue: "Event" }),
+        subtitle: t("orchestrator.detail.noLongerAvailable", {
+          defaultValue: "No longer available"
+        }),
+        closeLabel: closeDetailsLabel,
+        className,
+        style,
+        onClose,
+        children: /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: t("orchestrator.detail.timelineDataChanged", {
+          defaultValue: "Timeline data changed."
+        }) })
+      }
+    );
+  }
+  const isSession = selection.kind === "session";
+  const title = isSession ? t("orchestrator.detail.sessionDetail", { defaultValue: "Session detail" }) : t("orchestrator.detail.timelineDetail", {
+    defaultValue: "Timeline detail"
+  });
+  const subtitle = isSession ? session?.label ?? t("orchestrator.detail.session", { defaultValue: "Session" }) : block ? blockTitle(block, t) : t("orchestrator.detail.event", { defaultValue: "Event" });
+  const activeUsage = session ? sessionUsage(session) : taskUsage;
+  const toolUsageFallbackLabel = session ? label(
+    "perToolUsageUnavailable",
+    "Per-tool usage is not emitted yet; showing the owning session total."
+  ) : label(
+    "perToolUsageTaskFallback",
+    "Per-tool usage is not emitted yet; showing the task total."
+  );
+  const errorText = isSession && session ? sessionError(session, t) : block ? blockError(block, events, t) : null;
+  const retryMessage = !isSession ? messages[0] : null;
+  const rerunEvent = !isSession ? events[0] : null;
+  const retryLabel = label("retry", "Retry");
+  const rerunLabel = label("rerun", "Rerun");
+  const recoveryActions = [];
+  if (isSession && session) {
+    recoveryActions.push(
+      /* @__PURE__ */ jsx(
+        RecoveryActionButton,
+        {
+          agentId: "operator-retry-session",
+          description: "Retry this session's work in a new worker",
+          icon: /* @__PURE__ */ jsx(RotateCcw, { className: "h-3 w-3" }),
+          label: retryLabel,
+          onClick: () => onRetry({
+            sessionId: session.sessionId,
+            mode: "new-session",
+            instruction: `Retry work from session ${session.label ?? session.sessionId}.`
+          }),
+          disabled: busy,
+          testId: "orchestrator-detail-retry"
+        },
+        "retry-session"
+      )
+    );
+  } else if (retryMessage) {
+    recoveryActions.push(
+      /* @__PURE__ */ jsx(
+        RecoveryActionButton,
+        {
+          agentId: "operator-retry-message",
+          description: "Retry this selected turn in a new worker",
+          icon: /* @__PURE__ */ jsx(RotateCcw, { className: "h-3 w-3" }),
+          label: retryLabel,
+          onClick: () => onRetry({
+            messageId: retryMessage.id,
+            sessionId: retryMessage.sessionId ?? void 0,
+            mode: "new-session",
+            instruction: "Retry this selected turn."
+          }),
+          disabled: busy,
+          testId: "orchestrator-detail-retry"
+        },
+        "retry-message"
+      )
+    );
+  }
+  if (rerunEvent) {
+    recoveryActions.push(
+      /* @__PURE__ */ jsx(
+        RecoveryActionButton,
+        {
+          agentId: "operator-rerun-event",
+          description: "Rerun from this selected event without rewriting history",
+          icon: /* @__PURE__ */ jsx(ChevronsUp, { className: "h-3 w-3" }),
+          label: rerunLabel,
+          onClick: () => onRerun({
+            eventId: rerunEvent.id,
+            instruction: `Rerun from ${rerunEvent.eventType.replace(/_/g, " ")}.`,
+            stopActive: false,
+            preserveHistory: true
+          }),
+          disabled: busy,
+          testId: "orchestrator-detail-rerun"
+        },
+        "rerun-event"
+      )
+    );
+  }
+  let body;
+  if (tab === "input") {
+    if (isSession && session) {
+      body = /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("status", "Status"),
+            value: session.status.replace(/_/g, " ")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("framework", "Framework"),
+            value: session.framework
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("provider", "Provider"),
+            value: session.providerSource
+          }
+        ),
+        /* @__PURE__ */ jsx(DetailRow, { label: label("model", "Model"), value: session.model }),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("workdir", "Workdir"),
+            value: session.workdir
+          }
+        ),
+        /* @__PURE__ */ jsx(DetailRow, { label: label("repo", "Repo"), value: session.repo }),
+        /* @__PURE__ */ jsx(InspectorSection, { title: label("originalTask", "Original task"), children: /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs-tight text-txt", children: session.originalTask }) }),
+        hasRecordEntries(session.metadata) ? /* @__PURE__ */ jsx(InspectorSection, { title: label("metadata", "Metadata"), children: /* @__PURE__ */ jsx(
+          JsonBlock,
+          {
+            value: session.metadata,
+            emptyLabel: label("noMetadata", "No metadata.")
+          }
+        ) }) : null
+      ] });
+    } else if (block?.kind === "tool") {
+      const input = block.tool.rawInput ?? {};
+      body = /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(DetailRow, { label: label("toolId", "Tool id"), value: block.tool.id }),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("kind", "Kind"),
+            value: block.tool.kind || "tool"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("status", "Status"),
+            value: block.tool.rawStatus ?? block.tool.status
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("file", "File"),
+            value: block.tool.filePath
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("command", "Command"),
+            value: block.tool.command
+          }
+        ),
+        /* @__PURE__ */ jsx(DetailRow, { label: label("query", "Query"), value: block.tool.query }),
+        /* @__PURE__ */ jsx(
+          JsonBlock,
+          {
+            value: input,
+            emptyLabel: label("noToolInput", "No tool input captured.")
+          }
+        )
+      ] });
+    } else if (block?.kind === "user") {
+      body = /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap bg-bg/60 px-2.5 py-1.5 text-xs-tight text-txt", children: block.content });
+    } else if (block?.kind === "agent") {
+      body = /* @__PURE__ */ jsx(
+        JsonBlock,
+        {
+          value: messages.map((message) => message.metadata),
+          emptyLabel: label("noInputMetadata", "No input metadata captured.")
+        }
+      );
+    } else {
+      body = /* @__PURE__ */ jsx(
+        JsonBlock,
+        {
+          value: events.map((event) => event.data),
+          emptyLabel: label("noInput", "No input captured.")
+        }
+      );
+    }
+  } else if (tab === "output") {
+    if (isSession && session) {
+      body = /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("activeTool", "Active tool"),
+            value: session.activeTool
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("decisions", "Decisions"),
+            value: t("orchestrator.detail.decisionCounts", {
+              defaultValue: `${session.decisionCount} total \xB7 ${session.autoResolvedCount} auto`,
+              count: session.decisionCount,
+              auto: session.autoResolvedCount
+            })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("lastInput", "Last input"),
+            value: session.lastInputSentAt ? formatClockTime(session.lastInputSentAt, locale) : null
+          }
+        ),
+        /* @__PURE__ */ jsx(InspectorSection, { title: label("completion", "Completion"), children: session.completionSummary ? /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap text-xs-tight text-txt", children: session.completionSummary }) : /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: label("noCompletion", "No completion yet.") }) })
+      ] });
+    } else if (block?.kind === "tool") {
+      body = /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("exit", "Exit"),
+            value: block.tool.exitCode
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DetailRow,
+          {
+            label: label("duration", "Duration"),
+            value: block.tool.durationMs ? formatDuration(block.tool.durationMs) : null
+          }
+        ),
+        /* @__PURE__ */ jsx(ToolBody, { tool: block.tool }),
+        /* @__PURE__ */ jsx(
+          JsonBlock,
+          {
+            value: block.tool.rawOutput,
+            emptyLabel: label("noRawOutput", "No raw output payload captured.")
+          }
+        )
+      ] });
+    } else if (block?.kind === "agent" || block?.kind === "user") {
+      body = /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap bg-bg/60 px-2.5 py-1.5 text-xs-tight text-txt", children: compactText(block.content) });
+    } else if (block?.kind === "reasoning") {
+      body = /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap bg-bg/60 px-2.5 py-1.5 text-xs-tight text-txt", children: compactText(block.text) });
+    } else if (block) {
+      body = /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-txt", children: block.text });
+    } else {
+      body = null;
+    }
+  } else if (tab === "events") {
+    body = /* @__PURE__ */ jsx(EventList, { events, messages, locale, t });
+  } else {
+    body = /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      block?.kind === "tool" ? /* @__PURE__ */ jsx("p", { className: "text-xs-tight text-muted", children: toolUsageFallbackLabel }) : null,
+      /* @__PURE__ */ jsx(UsageSection, { usage: activeUsage, t, locale })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(
+    OperatorDrawerShell,
+    {
+      title,
+      subtitle,
+      closeLabel: closeDetailsLabel,
+      className,
+      style,
+      onClose,
+      children: [
+        /* @__PURE__ */ jsx(ErrorFirstBanner, { text: errorText }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+          session ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              DetailRow,
+              {
+                label: label("session", "Session"),
+                value: session.sessionId
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              DetailRow,
+              {
+                label: label("activity", "Activity"),
+                value: formatClockTime(session.lastActivityAt, locale)
+              }
+            )
+          ] }) : null,
+          block ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(DetailRow, { label: label("kind", "Kind"), value: block.kind }),
+            /* @__PURE__ */ jsx(
+              DetailRow,
+              {
+                label: label("time", "Time"),
+                value: formatClockTime(block.at, locale)
+              }
+            )
+          ] }) : null
+        ] }),
+        recoveryActions.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", "data-testid": "orchestrator-detail-recovery", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-muted", children: label("recovery", "Recovery") }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", children: recoveryActions })
+        ] }) : null,
+        /* @__PURE__ */ jsx(OperatorTabs, { active: tab, onSelect: setTab, t }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-0", children: body })
+      ]
+    }
+  );
+}
+function readInitialTaskId() {
+  if (typeof window === "undefined") return null;
+  const params = new URLSearchParams(window.location.search);
+  return params.get("task") ?? params.get("taskId");
+}
+const MOBILE_QUERY = "(max-width: 767px)";
+function useIsMobile() {
+  const [isMobile, setIsMobile] = useState(() => {
+    if (typeof window === "undefined" || !window.matchMedia) return false;
+    return window.matchMedia(MOBILE_QUERY).matches;
+  });
+  useEffect(() => {
+    if (typeof window === "undefined" || !window.matchMedia) return;
+    const mql = window.matchMedia(MOBILE_QUERY);
+    const onChange = (event) => setIsMobile(event.matches);
+    setIsMobile(mql.matches);
+    mql.addEventListener("change", onChange);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return isMobile;
+}
+const INSPECTOR_DRAWER_STYLE = {
+  position: "absolute",
+  insetBlock: 0,
+  right: 0,
+  zIndex: 30,
+  width: "86%",
+  maxWidth: "22rem",
+  boxShadow: "0 10px 30px rgba(0, 0, 0, 0.45)"
+};
+const HIDDEN_STYLE = { display: "none" };
+function TimelineHeader({
+  detail,
+  isMobile,
+  onBack,
+  onOpenInspector,
+  t
+}) {
+  const statusDot = /* @__PURE__ */ jsx(
+    StatusGlyph,
+    {
+      status: detail.status,
+      paused: detail.paused,
+      t,
+      size: "h-4 w-4"
+    }
+  );
+  const title = /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-sm font-semibold text-txt", children: detail.title });
+  const pausedLabel = t("orchestrator.status.paused", {
+    defaultValue: "Paused"
+  });
+  const pausedBadge = detail.paused ? /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "inline-flex shrink-0 text-warn",
+      title: pausedLabel,
+      "aria-label": pausedLabel,
+      role: "img",
+      children: /* @__PURE__ */ jsx(Pause, { className: "h-3.5 w-3.5", "aria-hidden": true })
+    }
+  ) : null;
+  const detailsLabel = t("orchestrator.action.details", {
+    defaultValue: "Details"
+  });
+  const backLabel = t("orchestrator.action.backToList", {
+    defaultValue: "Back to tasks"
+  });
+  const { ref: backRef, agentProps: backAgentProps } = useAgentElement({
+    id: "timeline-back",
+    role: "button",
+    label: backLabel,
+    group: "orchestrator-timeline",
+    description: "Go back to the task list"
+  });
+  const { ref: detailsRef, agentProps: detailsAgentProps } = useAgentElement({
+    id: "timeline-open-inspector",
+    role: "button",
+    label: detailsLabel,
+    group: "orchestrator-timeline",
+    description: "Open the task details panel"
+  });
+  if (isMobile) {
+    return /* @__PURE__ */ jsxs("div", { className: "px-3 py-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            ref: backRef,
+            type: "button",
+            onClick: onBack,
+            className: "-ml-1 shrink-0 p-1 text-muted transition-colors hover:text-txt",
+            "aria-label": backLabel,
+            "data-testid": "orchestrator-back",
+            ...backAgentProps,
+            children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" })
+          }
+        ),
+        statusDot,
+        title,
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            ref: detailsRef,
+            type: "button",
+            onClick: onOpenInspector,
+            className: "shrink-0 p-1 text-muted transition-colors hover:text-txt",
+            "aria-label": detailsLabel,
+            title: detailsLabel,
+            "data-testid": "orchestrator-open-inspector",
+            ...detailsAgentProps,
+            children: /* @__PURE__ */ jsx(PanelRightOpen, { className: "h-4 w-4", "aria-hidden": true })
+          }
+        )
+      ] }),
+      pausedBadge ? /* @__PURE__ */ jsx("div", { className: "mt-1.5 flex items-center gap-1.5", children: pausedBadge }) : null
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 px-4 py-2.5", children: [
+    /* @__PURE__ */ jsx(BackChip, { label: backLabel, onClick: onBack, testId: "orchestrator-back" }),
+    statusDot,
+    title,
+    pausedBadge,
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref: detailsRef,
+        type: "button",
+        onClick: onOpenInspector,
+        className: "shrink-0 p-1 text-muted transition-colors hover:text-txt",
+        "aria-label": detailsLabel,
+        title: detailsLabel,
+        "data-testid": "orchestrator-open-inspector",
+        ...detailsAgentProps,
+        children: /* @__PURE__ */ jsx(PanelRightOpen, { className: "h-4 w-4", "aria-hidden": true })
+      }
+    )
+  ] });
+}
+function OrchestratorWorkbench() {
+  const {
+    t: appT,
+    uiLanguage,
+    copyToClipboard,
+    agentStatus
+  } = useAppSelectorShallow((s) => ({
+    t: s.t,
+    uiLanguage: s.uiLanguage,
+    copyToClipboard: s.copyToClipboard,
+    agentStatus: s.agentStatus
+  }));
+  const t = appT ?? fallbackTranslate;
+  const locale = typeof uiLanguage === "string" ? uiLanguage : void 0;
+  const mainAgentName = typeof agentStatus?.agentName === "string" ? agentStatus.agentName : void 0;
+  const [status, setStatus] = useState(
+    null
+  );
+  const [tasks, setTasks] = useState([]);
+  const [selectedId, setSelectedId] = useState(
+    readInitialTaskId
+  );
+  const [detail, setDetail] = useState(
+    null
+  );
+  const [messages, setMessages] = useState([]);
+  const [events, setEvents] = useState([]);
+  const [timelineCursor, setTimelineCursor] = useState(null);
+  const [search, setSearch] = useState("");
+  const [statusFilter, setStatusFilter] = useState("all");
+  const [showArchived, setShowArchived] = useState(false);
+  const [addAgentOpen, setAddAgentOpen] = useState(false);
+  const [inspectorOpen, setInspectorOpen] = useState(false);
+  const [detailDrawer, setDetailDrawer] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [mutating, setMutating] = useState(false);
+  const [loadError, setLoadError] = useState(null);
+  const [backendAbsent, setBackendAbsent] = useState(false);
+  const [actionError, setActionError] = useState(null);
+  const isMobile = useIsMobile();
+  const deferredSearch = useDeferredValue(search.trim());
+  const detailReqRef = useRef(0);
+  const selectedIdRef = useRef(selectedId);
+  selectedIdRef.current = selectedId;
+  const listRef = useRef(null);
+  const stickToBottomRef = useRef(true);
+  const handleListScroll = useCallback((event) => {
+    const el = event.currentTarget;
+    stickToBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
+  }, []);
+  const fetchTasksAndStatus = useCallback(
+    async (silent) => {
+      if (!silent) setLoading(true);
+      try {
+        const [nextStatus, nextTasks] = await Promise.all([
+          client.getOrchestratorStatus(),
+          client.listCodingAgentTaskThreads({
+            includeArchived: showArchived,
+            status: statusFilter === "all" ? void 0 : statusFilter,
+            search: deferredSearch || void 0,
+            limit: TASK_LIST_LIMIT
+          })
+        ]);
+        setStatus(nextStatus);
+        setTasks(nextTasks);
+        setLoadError(null);
+        setBackendAbsent(false);
+      } catch (error) {
+        if (!silent) {
+          if (isOrchestratorBackendAbsent(error)) {
+            setBackendAbsent(true);
+            setLoadError(null);
+          } else {
+            setBackendAbsent(false);
+            setLoadError(
+              getClientErrorMessage(
+                error,
+                t("orchestrator.loadFailed", {
+                  defaultValue: "Failed to load orchestrator state."
+                })
+              )
+            );
+          }
+        }
+      } finally {
+        if (!silent) setLoading(false);
+      }
+    },
+    [deferredSearch, showArchived, statusFilter, t]
+  );
+  const fetchDetail = useCallback(async (id, reset) => {
+    const token = ++detailReqRef.current;
+    const [nextDetail, timelinePage] = await Promise.all([
+      client.getCodingAgentTaskThread(id),
+      client.listOrchestratorTaskTimeline(id, { limit: TIMELINE_PAGE_LIMIT })
+    ]);
+    if (token !== detailReqRef.current || id !== selectedIdRef.current) return;
+    const timeline = splitTimelineItems(timelinePage.items);
+    setDetail(nextDetail);
+    if (reset) {
+      setMessages(mergeById([], timeline.messages));
+      setEvents(mergeById([], timeline.events));
+      setTimelineCursor(timelinePage.nextCursor);
+    } else {
+      setMessages((prev) => mergeById(prev, timeline.messages));
+      setEvents((prev) => mergeById(prev, timeline.events));
+      setTimelineCursor((prev) => prev ?? timelinePage.nextCursor);
+    }
+  }, []);
+  useEffect(() => {
+    void fetchTasksAndStatus(false);
+    const timer = window.setInterval(
+      () => void fetchTasksAndStatus(true),
+      POLL_INTERVAL_MS
+    );
+    return () => window.clearInterval(timer);
+  }, [fetchTasksAndStatus]);
+  const detailPollMs = detail !== null && (detail.activeSessionCount > 0 || detail.status === "active" || detail.status === "validating") ? ACTIVE_POLL_INTERVAL_MS : POLL_INTERVAL_MS;
+  useEffect(() => {
+    setInspectorOpen(false);
+    setAddAgentOpen(false);
+    setDetailDrawer(null);
+    stickToBottomRef.current = true;
+    if (!selectedId) {
+      setDetail(null);
+      setMessages([]);
+      setEvents([]);
+      setTimelineCursor(null);
+      return;
+    }
+    void fetchDetail(selectedId, true).catch((err) => {
+      console.error("[OrchestratorWorkbench] fetchDetail (initial)", { err });
+    });
+  }, [selectedId, fetchDetail]);
+  useEffect(() => {
+    if (!selectedId) return;
+    const timer = window.setInterval(
+      () => void fetchDetail(selectedId, false).catch((err) => {
+        console.error("[OrchestratorWorkbench] fetchDetail (poll)", { err });
+      }),
+      detailPollMs
+    );
+    return () => window.clearInterval(timer);
+  }, [selectedId, detailPollMs, fetchDetail]);
+  const refetchTimerRef = useRef(null);
+  const scheduleRefetch = useCallback(() => {
+    if (refetchTimerRef.current != null) return;
+    refetchTimerRef.current = window.setTimeout(() => {
+      refetchTimerRef.current = null;
+      const current = selectedIdRef.current;
+      if (current)
+        void fetchDetail(current, false).catch((err) => {
+          console.error("[OrchestratorWorkbench] fetchDetail (debounced)", {
+            err
+          });
+        });
+    }, 150);
+  }, [fetchDetail]);
+  useEffect(() => {
+    if (!selectedId) return;
+    const unsubscribe = client.streamOrchestratorTask(
+      selectedId,
+      scheduleRefetch
+    );
+    return () => {
+      unsubscribe();
+      if (refetchTimerRef.current != null) {
+        window.clearTimeout(refetchTimerRef.current);
+        refetchTimerRef.current = null;
+      }
+    };
+  }, [selectedId, scheduleRefetch]);
+  const runMutation = useCallback(
+    async (fn) => {
+      setMutating(true);
+      setActionError(null);
+      try {
+        await fn();
+        await fetchTasksAndStatus(true);
+        const current = selectedIdRef.current;
+        if (current)
+          await fetchDetail(current, false).catch((err) => {
+            console.error("[OrchestratorWorkbench] fetchDetail (mutation)", {
+              err
+            });
+          });
+      } catch (error) {
+        setActionError(
+          getClientErrorMessage(
+            error,
+            t("orchestrator.actionFailed", { defaultValue: "Action failed." })
+          )
+        );
+      } finally {
+        setMutating(false);
+      }
+    },
+    [fetchTasksAndStatus, fetchDetail, t]
+  );
+  const loadOlderTimeline = useCallback(async () => {
+    const current = selectedIdRef.current;
+    if (!current || !timelineCursor) return;
+    const page = await client.listOrchestratorTaskTimeline(current, {
+      cursor: timelineCursor,
+      limit: TIMELINE_PAGE_LIMIT
+    });
+    if (current !== selectedIdRef.current) return;
+    const timeline = splitTimelineItems(page.items);
+    setMessages((prev) => mergeById(prev, timeline.messages));
+    setEvents((prev) => mergeById(prev, timeline.events));
+    setTimelineCursor(page.nextCursor);
+  }, [timelineCursor]);
+  const handleStopActive = useCallback(() => {
+    const current = detail;
+    if (!current) return;
+    const targets = current.sessions.filter(
+      (session) => session.sessionId && session.stoppedAt == null && session.status !== "completed"
+    );
+    if (targets.length === 0) return;
+    void runMutation(async () => {
+      for (const session of targets) {
+        await client.stopOrchestratorAgent(current.id, session.sessionId);
+      }
+    });
+  }, [detail, runMutation]);
+  const escStateRef = useRef({
+    addAgentOpen,
+    inspectorOpen,
+    detailDrawer,
+    stop: handleStopActive
+  });
+  escStateRef.current = {
+    addAgentOpen,
+    inspectorOpen,
+    detailDrawer,
+    stop: handleStopActive
+  };
+  useEffect(() => {
+    const onKey = (event) => {
+      if (event.key !== "Escape") return;
+      const s = escStateRef.current;
+      if (s.addAgentOpen) {
+        setAddAgentOpen(false);
+        return;
+      }
+      if (s.inspectorOpen) {
+        setInspectorOpen(false);
+        return;
+      }
+      if (s.detailDrawer) {
+        setDetailDrawer(null);
+        return;
+      }
+      s.stop();
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, []);
+  const handleCopyLink = useCallback(() => {
+    const current = selectedIdRef.current;
+    if (!current || !copyToClipboard || typeof window === "undefined") return;
+    const url = `${window.location.origin}/orchestrator?task=${encodeURIComponent(current)}`;
+    void copyToClipboard(url);
+  }, [copyToClipboard]);
+  const sessionLabelById = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const session of detail?.sessions ?? []) {
+      const label = session.label?.trim();
+      if (session.sessionId && label) map.set(session.sessionId, label);
+    }
+    return map;
+  }, [detail?.sessions]);
+  const finishedSessionIds = useMemo(() => {
+    const ids = /* @__PURE__ */ new Set();
+    for (const session of detail?.sessions ?? []) {
+      if (session.sessionId && (session.stoppedAt != null || session.status === "completed")) {
+        ids.add(session.sessionId);
+      }
+    }
+    return ids;
+  }, [detail?.sessions]);
+  const conversation = useMemo(
+    () => buildConversation(
+      messages,
+      events,
+      (message) => resolveSenderName(message, sessionLabelById, mainAgentName, t),
+      finishedSessionIds
+    ),
+    [messages, events, sessionLabelById, mainAgentName, finishedSessionIds, t]
+  );
+  const selectedBlock = useMemo(() => {
+    if (detailDrawer?.kind !== "block") return null;
+    return conversation.find(
+      (block) => blockMatchesSelection(block, detailDrawer)
+    ) ?? null;
+  }, [conversation, detailDrawer]);
+  const selectedSession = useMemo(() => {
+    if (detailDrawer?.kind !== "session" || !detail) return null;
+    return detail.sessions.find(
+      (session) => session.sessionId === detailDrawer.sessionId
+    ) ?? null;
+  }, [detail, detailDrawer]);
+  const selectedBlockEvents = useMemo(() => {
+    if (!detailDrawer) return [];
+    if (detailDrawer.kind === "session") {
+      return events.filter(
+        (event) => event.sessionId === detailDrawer.sessionId
+      );
+    }
+    const ids = new Set(detailDrawer.eventIds);
+    return events.filter((event) => ids.has(event.id));
+  }, [detailDrawer, events]);
+  const selectedBlockMessages = useMemo(() => {
+    if (!detailDrawer) return [];
+    if (detailDrawer.kind === "session") {
+      return messages.filter(
+        (message) => message.sessionId === detailDrawer.sessionId
+      );
+    }
+    const ids = new Set(detailDrawer.messageIds);
+    return messages.filter((message) => ids.has(message.id));
+  }, [detailDrawer, messages]);
+  const handleSelectBlock = useCallback(
+    (block) => {
+      setDetailDrawer(blockSelection(block));
+      if (isMobile) setInspectorOpen(true);
+    },
+    [isMobile]
+  );
+  const handleInspectSession = useCallback(
+    (sessionId) => {
+      setDetailDrawer({ kind: "session", sessionId });
+      if (isMobile) setInspectorOpen(true);
+    },
+    [isMobile]
+  );
+  useEffect(() => {
+    const el = listRef.current;
+    if (el && stickToBottomRef.current) el.scrollTop = el.scrollHeight;
+  }, [conversation]);
+  const viewState = JSON.stringify({
+    selectedId,
+    taskCount: status?.taskCount ?? tasks.length,
+    activeTaskCount: status?.activeTaskCount ?? 0,
+    statusFilter,
+    showArchived
+  });
+  const searchLabel = t("orchestrator.searchPlaceholder", {
+    defaultValue: "Search tasks"
+  });
+  const showArchivedLabel = t("orchestrator.showArchived", {
+    defaultValue: "Show archived"
+  });
+  const loadOlderLabel = t("orchestrator.loadOlder", {
+    defaultValue: "Load older"
+  });
+  const stopLabel = t("orchestrator.action.stop", { defaultValue: "Stop" });
+  const { ref: searchRef, agentProps: searchAgentProps } = useAgentElement({
+    id: "rail-search",
+    role: "text-input",
+    label: searchLabel,
+    group: "orchestrator-rail",
+    description: "Filter the task list by title or request text",
+    getValue: () => search,
+    onFill: (value) => setSearch(value)
+  });
+  const { ref: showArchivedRef, agentProps: showArchivedAgentProps } = useAgentElement({
+    id: "rail-show-archived",
+    role: "toggle",
+    label: showArchivedLabel,
+    group: "orchestrator-rail",
+    status: showArchived ? "active" : "inactive",
+    description: "Toggle showing archived tasks in the list",
+    onActivate: () => setShowArchived((value) => !value)
+  });
+  const { ref: loadOlderRef, agentProps: loadOlderAgentProps } = useAgentElement({
+    id: "timeline-load-older",
+    role: "button",
+    label: loadOlderLabel,
+    group: "orchestrator-timeline",
+    description: "Load older entries in the task timeline"
+  });
+  const { ref: stopActiveRef, agentProps: stopActiveAgentProps } = useAgentElement({
+    id: "timeline-stop-active",
+    role: "button",
+    label: stopLabel,
+    group: "orchestrator-timeline",
+    description: "Stop the running sub-agents on this task"
+  });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "relative flex h-full min-h-0 w-full flex-col bg-bg text-txt",
+      "data-testid": "orchestrator-workbench",
+      children: [
+        /* @__PURE__ */ jsx("span", { "data-view-state": viewState, hidden: true }),
+        /* @__PURE__ */ jsx(
+          WorkbenchHeader,
+          {
+            status,
+            busy: mutating,
+            isMobile,
+            onPauseAll: () => runMutation(() => client.pauseAllOrchestratorTasks()),
+            onResumeAll: () => runMutation(() => client.resumeAllOrchestratorTasks()),
+            t,
+            locale
+          }
+        ),
+        backendAbsent ? /* @__PURE__ */ jsx("div", { className: "px-4 py-1.5 text-2xs text-muted", children: t("orchestrator.backendAbsent", {
+          defaultValue: "Connect a cloud or desktop agent to run tasks."
+        }) }) : null,
+        loadError ? /* @__PURE__ */ jsx("div", { className: "bg-danger/10 px-3 py-1.5 text-xs text-danger", children: loadError }) : null,
+        actionError ? /* @__PURE__ */ jsx("div", { className: "bg-danger/10 px-3 py-1.5 text-xs text-danger", children: actionError }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "relative flex min-h-0 flex-1 flex-col overflow-y-auto", children: [
+          !selectedId ? /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "relative flex flex-1 flex-col gap-3 px-4 pb-28 pt-4",
+              "data-testid": "orchestrator-rail",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    TaskSearchInput,
+                    {
+                      value: search,
+                      onChange: setSearch,
+                      placeholder: searchLabel,
+                      inputRef: searchRef,
+                      testId: "orchestrator-search",
+                      className: "min-w-[12rem] flex-1",
+                      agentProps: searchAgentProps
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("div", { className: "w-40", children: /* @__PURE__ */ jsx(
+                      FilterSelect,
+                      {
+                        status,
+                        active: statusFilter,
+                        onSelect: setStatusFilter,
+                        t
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        ref: showArchivedRef,
+                        type: "button",
+                        onClick: () => setShowArchived((value) => !value),
+                        "aria-pressed": showArchived,
+                        className: `inline-flex h-9 items-center gap-2 px-2 text-xs font-medium transition-colors ${showArchived ? "text-accent" : "text-muted hover:text-txt"}`,
+                        "data-testid": "orchestrator-show-archived",
+                        ...showArchivedAgentProps,
+                        children: [
+                          /* @__PURE__ */ jsx(Archive, { className: "h-3.5 w-3.5" }),
+                          showArchivedLabel
+                        ]
+                      }
+                    )
+                  ] })
+                ] }),
+                tasks.length === 0 ? loading ? /* @__PURE__ */ jsx("p", { className: "p-2 text-sm text-muted", children: t("orchestrator.loadingTasks", {
+                  defaultValue: "Loading"
+                }) }) : /* @__PURE__ */ jsx(
+                  TaskEmptyState,
+                  {
+                    title: t("orchestrator.empty.title", {
+                      defaultValue: "None"
+                    }),
+                    hint: t("orchestrator.empty.hint", {
+                      defaultValue: "Ask me to start a coding task and it will appear here."
+                    })
+                  }
+                ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2.5", children: tasks.map((thread) => /* @__PURE__ */ jsx(
+                    TaskCard,
+                    {
+                      id: thread.id,
+                      title: thread.title,
+                      subtitle: thread.summary || thread.originalRequest,
+                      status: thread.status,
+                      chips: orchestratorTaskChips(thread, t, locale),
+                      onOpen: (id) => setSelectedId(id),
+                      t
+                    },
+                    thread.id
+                  )) }),
+                  tasks.length < 4 ? /* @__PURE__ */ jsx(SparseWatermark, { icon: Layers }) : null
+                ] })
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            "main",
+            {
+              className: "flex min-h-0 min-w-0 flex-1 flex-col bg-bg",
+              "data-testid": "orchestrator-timeline",
+              style: selectedId ? void 0 : HIDDEN_STYLE,
+              children: detail ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  TimelineHeader,
+                  {
+                    detail,
+                    isMobile,
+                    onBack: () => setSelectedId(null),
+                    onOpenInspector: () => {
+                      setDetailDrawer(null);
+                      setInspectorOpen(true);
+                    },
+                    t
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    ref: listRef,
+                    onScroll: handleListScroll,
+                    className: "min-h-0 flex-1 space-y-3 overflow-y-auto px-4 py-4",
+                    "data-testid": "orchestrator-message-list",
+                    children: [
+                      timelineCursor ? /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs(
+                        "button",
+                        {
+                          ref: loadOlderRef,
+                          type: "button",
+                          onClick: () => void loadOlderTimeline(),
+                          className: "flex items-center gap-1 px-1 py-0.5 text-2xs text-muted transition-colors hover:text-txt",
+                          "data-testid": "orchestrator-load-older",
+                          "aria-label": loadOlderLabel,
+                          ...loadOlderAgentProps,
+                          children: [
+                            /* @__PURE__ */ jsx(ArrowDownToLine, { className: "h-3 w-3" }),
+                            loadOlderLabel
+                          ]
+                        }
+                      ) }) : null,
+                      conversation.length === 0 ? /* @__PURE__ */ jsx("p", { className: "p-4 text-center text-xs text-muted", children: t("orchestrator.noMessages", {
+                        defaultValue: "No messages yet."
+                      }) }) : conversation.map((block) => {
+                        const selected = detailDrawer?.kind === "block" && blockMatchesSelection(block, detailDrawer);
+                        return /* @__PURE__ */ jsxs(
+                          "div",
+                          {
+                            className: `group flex gap-1.5 transition-colors ${selected ? "text-accent" : "hover:bg-bg-hover/30"}`,
+                            "data-testid": "orchestrator-conversation-block",
+                            children: [
+                              /* @__PURE__ */ jsx(
+                                "button",
+                                {
+                                  type: "button",
+                                  onClick: () => handleSelectBlock(block),
+                                  className: "mt-1.5 flex h-6 w-6 shrink-0 items-center justify-center text-muted opacity-0 transition-colors hover:text-txt focus:opacity-100 group-hover:opacity-100 group-focus-within:opacity-100",
+                                  "aria-label": t("orchestrator.action.inspectBlock", {
+                                    defaultValue: `Inspect ${blockTitle(block, t)}`
+                                  }),
+                                  title: t("orchestrator.action.inspectBlock", {
+                                    defaultValue: `Inspect ${blockTitle(block, t)}`
+                                  }),
+                                  "data-testid": "orchestrator-inspect-block",
+                                  children: /* @__PURE__ */ jsx(PanelRightOpen, { className: "h-3.5 w-3.5" })
+                                }
+                              ),
+                              /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx(
+                                ConversationBlockView,
+                                {
+                                  block,
+                                  locale,
+                                  onInspect: () => handleSelectBlock(block)
+                                }
+                              ) })
+                            ]
+                          },
+                          block.key
+                        );
+                      })
+                    ]
+                  }
+                ),
+                detail.activeSessionCount > 0 ? /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "flex items-center justify-between gap-2 bg-warn/5 px-3 py-1.5",
+                    "data-testid": "orchestrator-running-bar",
+                    children: [
+                      /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-2xs font-medium text-warn", children: [
+                        /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 animate-pulse rounded-full bg-warn" }),
+                        t("orchestrator.agentsWorking", {
+                          defaultValue: "Agent working\u2026"
+                        })
+                      ] }),
+                      /* @__PURE__ */ jsxs(
+                        "button",
+                        {
+                          ref: stopActiveRef,
+                          type: "button",
+                          onClick: handleStopActive,
+                          disabled: mutating,
+                          className: "flex items-center gap-1 px-1 py-0.5 text-2xs text-txt transition-colors hover:text-danger disabled:opacity-50",
+                          "data-testid": "orchestrator-stop-active",
+                          "aria-label": stopLabel,
+                          ...stopActiveAgentProps,
+                          children: [
+                            /* @__PURE__ */ jsx(CircleStop, { className: "h-3 w-3" }),
+                            stopLabel,
+                            /* @__PURE__ */ jsx("kbd", { className: "ml-0.5 px-1 text-[0.9em] text-muted", children: "Esc" })
+                          ]
+                        }
+                      )
+                    ]
+                  }
+                ) : null,
+                /* @__PURE__ */ jsx("div", { className: "pb-24" })
+              ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 px-4 py-2.5", children: [
+                  /* @__PURE__ */ jsx(
+                    BackChip,
+                    {
+                      label: t("orchestrator.action.backToList", {
+                        defaultValue: "Tasks"
+                      }),
+                      onClick: () => setSelectedId(null),
+                      testId: "orchestrator-back-loading"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-muted", children: t("orchestrator.loadingTask", {
+                    defaultValue: "Loading task\u2026"
+                  }) })
+                ] }),
+                /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-muted", children: t("orchestrator.loadingTask", {
+                  defaultValue: "Loading task\u2026"
+                }) }) })
+              ] })
+            }
+          ),
+          detail && isMobile && inspectorOpen ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": t("orchestrator.action.closeDetails", {
+                defaultValue: "Close details"
+              }),
+              onClick: () => {
+                setInspectorOpen(false);
+                setDetailDrawer(null);
+              },
+              className: "absolute inset-0 z-20 bg-black/40",
+              "data-testid": "orchestrator-inspector-backdrop"
+            }
+          ) : null,
+          detail && detailDrawer ? /* @__PURE__ */ jsx(
+            OperatorDetailDrawer,
+            {
+              selection: detailDrawer,
+              block: selectedBlock,
+              session: selectedSession,
+              events: selectedBlockEvents,
+              messages: selectedBlockMessages,
+              taskUsage: detail.usage,
+              busy: mutating,
+              className: "flex",
+              style: isMobile ? inspectorOpen ? INSPECTOR_DRAWER_STYLE : HIDDEN_STYLE : void 0,
+              onClose: () => {
+                setDetailDrawer(null);
+                if (isMobile) setInspectorOpen(false);
+              },
+              onRetry: (input) => runMutation(
+                () => client.retryOrchestratorTaskTurn(detail.id, input)
+              ),
+              onRerun: (input) => runMutation(
+                () => client.rerunOrchestratorTaskFromEvent(detail.id, input)
+              ),
+              t,
+              locale
+            },
+            blockSelectionKey(detailDrawer)
+          ) : detail ? /* @__PURE__ */ jsx(
+            TaskInspector,
+            {
+              detail,
+              className: "flex",
+              style: isMobile ? inspectorOpen ? INSPECTOR_DRAWER_STYLE : HIDDEN_STYLE : void 0,
+              onClose: isMobile ? () => setInspectorOpen(false) : void 0,
+              busy: mutating,
+              addAgentOpen,
+              onPause: () => runMutation(() => client.pauseOrchestratorTask(detail.id)),
+              onResume: () => runMutation(() => client.resumeOrchestratorTask(detail.id)),
+              onArchive: () => runMutation(async () => {
+                await client.archiveCodingAgentTaskThread(detail.id);
+                if (!showArchived) setSelectedId(null);
+              }),
+              onReopen: () => runMutation(() => client.reopenCodingAgentTaskThread(detail.id)),
+              onDelete: () => runMutation(async () => {
+                await client.deleteOrchestratorTask(detail.id);
+                setSelectedId(null);
+              }),
+              onFork: () => runMutation(async () => {
+                const forked = await client.forkOrchestratorTask(detail.id);
+                if (forked) setSelectedId(forked.id);
+              }),
+              onRestart: () => {
+                const confirmed = typeof window === "undefined" || window.confirm(
+                  t("orchestrator.confirmRestart", {
+                    defaultValue: "Restart this task with a fresh worker? Active agents will be stopped first."
+                  })
+                );
+                if (!confirmed) return;
+                runMutation(
+                  () => client.restartOrchestratorTask(detail.id, { stopActive: true })
+                );
+              },
+              onRestartWithEditedPlan: (input) => runMutation(
+                () => client.restartOrchestratorTaskWithEditedPlan(detail.id, input)
+              ),
+              onValidate: (passed) => runMutation(
+                () => client.validateOrchestratorTask(detail.id, {
+                  passed,
+                  humanOverride: true
+                })
+              ),
+              onSetPriority: (priority) => runMutation(
+                () => client.updateOrchestratorTask(detail.id, { priority })
+              ),
+              onToggleAddAgent: () => setAddAgentOpen((prev) => !prev),
+              onAddAgent: (input) => runMutation(async () => {
+                await client.addOrchestratorAgent(detail.id, input);
+                setAddAgentOpen(false);
+              }),
+              onInspectSession: handleInspectSession,
+              onStopAgent: (sessionId) => runMutation(
+                () => client.stopOrchestratorAgent(detail.id, sessionId)
+              ),
+              onCopyLink: handleCopyLink,
+              t,
+              locale
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+}
+export {
+  OrchestratorWorkbench,
+  TaskInspector
+};
+//# sourceMappingURL=OrchestratorWorkbench.js.map