opencode-subagent-magazine 1.4.1 → 1.5.0

package/dist/tui.js

@@ -11,7 +11,103 @@ import { createElement as _$createElement } from "@opentui/solid";
 import { createMemo, createSignal, createEffect, onMount, onCleanup, untrack, Show, For } from "solid-js";
 
 // src/_version.ts
-var PLUGIN_VERSION = "1.4.1";
+var PLUGIN_VERSION = "1.5.0";
+
+// src/clipboard.ts
+import { spawn } from "node:child_process";
+import { platform, release } from "node:os";
+function runWithInput(command, args, input) {
+  return new Promise((resolve, reject) => {
+    const child = spawn(command, args, {
+      stdio: ["pipe", "ignore", "ignore"],
+      windowsHide: true
+    });
+    child.once("error", reject);
+    child.once("close", (code) => {
+      if (code === 0) resolve();
+      else reject(new Error(`${command} exited with code ${code}`));
+    });
+    child.stdin?.end(input);
+  });
+}
+function writeOsc52(text) {
+  if (!process.stdout.isTTY) return false;
+  const payload = Buffer.from(text, "utf8").toString("base64");
+  const sequence = `\x1B]52;c;${payload}\x07`;
+  const wrapped = process.env.TMUX || process.env.STY ? `\x1BPtmux;\x1B${sequence}\x1B\\` : sequence;
+  process.stdout.write(wrapped);
+  return true;
+}
+async function tryCommand(method, command, args, text) {
+  try {
+    await runWithInput(command, args, text);
+    return { copied: true, method };
+  } catch {
+    return void 0;
+  }
+}
+async function copyText(text) {
+  if (!text) return { copied: false, method: "none", error: "empty_text" };
+  const os = platform();
+  const isWsl = release().toLowerCase().includes("microsoft");
+  const attempts = [];
+  if (os === "darwin") {
+    attempts.push(() => tryCommand("pbcopy", "pbcopy", [], text));
+    attempts.push(
+      () => tryCommand(
+        "osascript",
+        "osascript",
+        ["-e", 'set the clipboard to (read (POSIX file "/dev/stdin") as text)'],
+        text
+      )
+    );
+  }
+  if (os === "linux" && isWsl) {
+    attempts.push(
+      () => tryCommand(
+        "powershell",
+        "powershell.exe",
+        [
+          "-NonInteractive",
+          "-NoProfile",
+          "-Command",
+          "[Console]::InputEncoding=[Text.Encoding]::UTF8; Set-Clipboard ([Console]::In.ReadToEnd())"
+        ],
+        text
+      )
+    );
+  } else if (os === "linux") {
+    if (process.env.WAYLAND_DISPLAY) {
+      attempts.push(() => tryCommand("wl-copy", "wl-copy", [], text));
+    }
+    attempts.push(() => tryCommand("xclip", "xclip", ["-selection", "clipboard"], text));
+    attempts.push(() => tryCommand("xsel", "xsel", ["--clipboard", "--input"], text));
+  }
+  if (os === "win32") {
+    attempts.push(
+      () => tryCommand(
+        "powershell",
+        "powershell.exe",
+        [
+          "-NonInteractive",
+          "-NoProfile",
+          "-Command",
+          "[Console]::InputEncoding=[Text.Encoding]::UTF8; Set-Clipboard ([Console]::In.ReadToEnd())"
+        ],
+        text
+      )
+    );
+  }
+  for (const attempt of attempts) {
+    const result = await attempt();
+    if (result) return result;
+  }
+  try {
+    if (writeOsc52(text)) return { copied: true, method: "osc52" };
+  } catch {
+  }
+  return { copied: false, method: "none", error: "clipboard_unavailable" };
+}
 
 // src/index.tsx
 var SUBAGENT_TOOLS = /* @__PURE__ */ new Set(["task", "delegate", "call_omo_agent"]);
@@ -28,14 +124,18 @@ var I18N = {
     "todo.label": "\u8FDB\u5EA6",
     "session.label": "\u4F1A\u8BDD ID",
     "session.toast.copy": "\u53EF\u624B\u52A8\u590D\u5236\u4E0A\u65B9 ID",
+    "session.toast.copied": "\u4F1A\u8BDD ID \u5DF2\u590D\u5236",
+    "session.toast.copy_failed": "\u65E0\u6CD5\u8BBF\u95EE\u7CFB\u7EDF\u526A\u8D34\u677F\uFF0C\u8BF7\u624B\u52A8\u590D\u5236\u4E0A\u65B9 ID",
     "open.label": "\u8FDB\u5165\u4F1A\u8BDD",
     "cost.label": "\u8D39\u7528",
     "scroll.more": "\u66F4\u591A",
     "scroll.top": "\u56DE\u9876",
     "scroll.bottom": "\u56DE\u5E95",
     "dismiss.label": "\u6807\u8BB0\u5B8C\u6210",
+    "cancel.label": "\u53D6\u6D88",
     "status.running": "\u8FD0\u884C\u4E2D",
     "status.done": "\u5DF2\u5B8C\u6210",
+    "status.cancelled": "\u5DF2\u53D6\u6D88",
     "status.error": "\u9519\u8BEF",
     "order.desc": "\u964D\u5E8F\uFF08\u6700\u65B0\u5728\u524D\uFF09",
     "order.asc": "\u5347\u5E8F\uFF08\u6700\u65E9\u5728\u524D\uFF09",
@@ -53,7 +153,15 @@ var I18N = {
     "clear.prompt": "\u786E\u5B9A\u6E05\u9664\u5F53\u524D\u4F1A\u8BDD\u6240\u6709\u5B50\u4EE3\u7406\u8BB0\u5F55\uFF1F\u6B64\u64CD\u4F5C\u4E0D\u53EF\u64A4\u9500\u3002",
     "clear.prompt_running": "\u5F53\u524D\u6709 {n} \u4E2A\u8FD0\u884C\u4E2D\u7684\u5B50\u4EE3\u7406\uFF0C\u6E05\u9664\u540E\u5C06\u4E0D\u53EF\u6062\u590D\u3002\u786E\u5B9A\u7EE7\u7EED\uFF1F",
     "clear.done": "\u5DF2\u6E05\u9664 {n} \u6761\u5B50\u4EE3\u7406\u8BB0\u5F55",
-    "clear.empty": "\u5F53\u524D\u4F1A\u8BDD\u65E0\u5B50\u4EE3\u7406\u8BB0\u5F55"
+    "clear.empty": "\u5F53\u524D\u4F1A\u8BDD\u65E0\u5B50\u4EE3\u7406\u8BB0\u5F55",
+    "cancel.no_session": "\u5B50\u4F1A\u8BDD ID \u4E0D\u53EF\u7528",
+    "cancel.not_child": "\u76EE\u6807\u4E0D\u662F\u5B50\u4F1A\u8BDD",
+    "cancel.read_error": "\u65E0\u6CD5\u8BFB\u53D6\u4F1A\u8BDD\u4FE1\u606F",
+    "cancel.outside_tree": "\u76EE\u6807\u4E0D\u5728\u5F53\u524D\u76D1\u63A7\u4F1A\u8BDD\u6811\u4E2D",
+    "cancel.already_ended": "\u4F1A\u8BDD\u5DF2\u7ED3\u675F\uFF0C\u65E0\u9700\u53D6\u6D88",
+    "cancel.status_error": "\u65E0\u6CD5\u67E5\u8BE2\u4F1A\u8BDD\u72B6\u6001",
+    "cancel.sent": "\u5DF2\u53D1\u9001\u53D6\u6D88\u6307\u4EE4",
+    "cancel.failed": "\u53D6\u6D88\u5931\u8D25"
   },
   en: {
     "panel.title": "SubAgent",
@@ -67,14 +175,18 @@ var I18N = {
     "todo.label": "todo",
     "session.label": "session ID",
     "session.toast.copy": "Copy the ID above manually",
+    "session.toast.copied": "Session ID copied",
+    "session.toast.copy_failed": "Cannot access the system clipboard; copy the ID above manually",
     "open.label": "Open session",
     "cost.label": "cost",
     "scroll.more": "more",
     "scroll.top": "Top",
     "scroll.bottom": "Bottom",
     "dismiss.label": "dismiss",
+    "cancel.label": "Cancel",
     "status.running": "running",
     "status.done": "done",
+    "status.cancelled": "cancelled",
     "status.error": "error",
     "order.desc": "Desc (newest first)",
     "order.asc": "Asc (oldest first)",
@@ -92,7 +204,15 @@ var I18N = {
     "clear.prompt": "Clear all sub-agent records for this session? This cannot be undone.",
     "clear.prompt_running": "{n} sub-agent(s) are still running. Clearing will discard them permanently. Continue?",
     "clear.done": "Cleared {n} sub-agent record(s)",
-    "clear.empty": "No sub-agent records in this session"
+    "clear.empty": "No sub-agent records in this session",
+    "cancel.no_session": "Child session ID is unavailable",
+    "cancel.not_child": "Target is not a child session",
+    "cancel.read_error": "Cannot read session info",
+    "cancel.outside_tree": "Target is outside the monitored session tree",
+    "cancel.already_ended": "Session already ended, no need to cancel",
+    "cancel.status_error": "Cannot query session status",
+    "cancel.sent": "Cancel instruction sent",
+    "cancel.failed": "Cancellation failed"
   }
 };
 function detectLang() {
@@ -410,7 +530,7 @@ function SubAgentPanel(props) {
       let needsImmediateFlush = false;
       for (const [id, entry] of next) {
         const prevEntry = prev.get(id);
-        if (prevEntry?.status === "running" && (entry.status === "done" || entry.status === "error")) {
+        if (prevEntry?.status === "running" && (entry.status === "done" || entry.status === "error" || entry.status === "cancelled")) {
           needsImmediateFlush = true;
           break;
         }
@@ -481,6 +601,7 @@ function SubAgentPanel(props) {
   })());
   const [hoveredOpen, setHoveredOpen] = createSignal(void 0);
   const [hoveredDismiss, setHoveredDismiss] = createSignal(void 0);
+  const [hoveredCancel, setHoveredCancel] = createSignal(void 0);
   const [hoveredTop, setHoveredTop] = createSignal(false);
   const [hoveredMoreAbove, setHoveredMoreAbove] = createSignal(false);
   const [hoveredMoreBelow, setHoveredMoreBelow] = createSignal(false);
@@ -574,7 +695,7 @@ function SubAgentPanel(props) {
       const next = new Map(prev);
       const nowTs = Date.now();
       const e = partial.status;
-      const ended = e === "done" || e === "error";
+      const ended = e === "done" || e === "error" || e === "cancelled";
       next.set(partial.id, {
         ...existing ?? {
           startedAt: nowTs
@@ -586,6 +707,123 @@ function SubAgentPanel(props) {
       return next;
     });
   };
+  const isDescendantOf = (childId, rootId) => {
+    const visited = /* @__PURE__ */ new Set();
+    try {
+      let current = props.api.state.session.get(childId);
+      while (current?.parentID) {
+        if (visited.has(current.id)) return false;
+        visited.add(current.id);
+        if (current.parentID === rootId) return true;
+        current = props.api.state.session.get(current.parentID);
+      }
+    } catch {
+    }
+    return false;
+  };
+  const settleOnIdle = (entry) => {
+    if (entry.status === "cancel_requested" && entry.abortAccepted) return "cancelled";
+    return "done";
+  };
+  const cancelEntry = async (entry) => {
+    const childId = entry.sessionId;
+    if (!childId) {
+      props.api.ui.toast({
+        title: entry.title || entry.agent,
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.no_session"] ?? "Child session ID is unavailable")
+      });
+      return;
+    }
+    try {
+      const child = props.api.state.session.get(childId);
+      if (!child?.parentID) {
+        props.api.ui.toast({
+          title: entry.title || entry.agent,
+          message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.not_child"] ?? "Target is not a child session")
+        });
+        return;
+      }
+    } catch {
+      props.api.ui.toast({
+        title: entry.title || entry.agent,
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.read_error"] ?? "Cannot read session info")
+      });
+      return;
+    }
+    if (!isDescendantOf(childId, props.sessionId)) {
+      props.api.ui.toast({
+        title: entry.title || entry.agent,
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.outside_tree"] ?? "Target is outside the monitored session tree")
+      });
+      return;
+    }
+    try {
+      const st = props.api.state.session.status(childId);
+      if (st?.type !== "busy") {
+        const tokens = readSessionTokens(childId);
+        const cost = readSessionCost(childId);
+        upsertEntry({
+          id: entry.id,
+          title: entry.title,
+          agent: entry.agent,
+          prompt: entry.prompt,
+          status: "done",
+          sessionId: entry.sessionId,
+          tokens,
+          cost
+        });
+        return;
+      }
+    } catch {
+      props.api.ui.toast({
+        title: entry.title || entry.agent,
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.status_error"] ?? "Cannot query session status")
+      });
+      return;
+    }
+    upsertEntry({
+      id: entry.id,
+      title: entry.title,
+      agent: entry.agent,
+      prompt: entry.prompt,
+      status: "cancel_requested",
+      sessionId: entry.sessionId,
+      cancelRequestedAt: Date.now(),
+      abortAccepted: false,
+      cancelReason: "manual"
+    });
+    try {
+      await props.api.client.session.abort({
+        sessionID: childId
+      });
+      upsertEntry({
+        id: entry.id,
+        title: entry.title,
+        agent: entry.agent,
+        prompt: entry.prompt,
+        status: "cancel_requested",
+        sessionId: entry.sessionId,
+        abortAccepted: true
+      });
+      props.api.ui.toast({
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.sent"] ?? "Cancel instruction sent")
+      });
+    } catch (err) {
+      upsertEntry({
+        id: entry.id,
+        title: entry.title,
+        agent: entry.agent,
+        prompt: entry.prompt,
+        status: "error",
+        sessionId: entry.sessionId,
+        error: String(err)
+      });
+      props.api.ui.toast({
+        title: entry.title || entry.agent,
+        message: t("cancel.label") + ": " + (I18N[props.lang()]["cancel.failed"] ?? "Cancellation failed")
+      });
+    }
+  };
   const handlePartUpdated = (event) => {
     const e = event;
     const props_ = e.properties;
@@ -690,8 +928,9 @@ function SubAgentPanel(props) {
     }
     const tryMatchAndUpdate = (entriesMap, targetSid, targetStatus, nowTs) => {
       for (const [, entry] of entriesMap) {
-        if (entry.sessionId === targetSid && entry.status === "running") {
-          entry.status = targetStatus;
+        if (entry.sessionId === targetSid && (entry.status === "running" || entry.status === "cancel_requested")) {
+          const finalStatus = targetStatus === "error" ? "error" : settleOnIdle(entry);
+          entry.status = finalStatus;
           entry.endedAt = nowTs;
           entry.tokens = entry.tokens ?? sessionTokens;
           entry.cost = entry.cost ?? sessionCost;
@@ -707,7 +946,7 @@ function SubAgentPanel(props) {
         const saNorm = normalize(sessionAgent);
         let best = null;
         for (const [, entry] of entriesMap) {
-          if (entry.status !== "running") continue;
+          if (entry.status !== "running" && entry.status !== "cancel_requested") continue;
           const eaNorm = normalize(entry.agent);
           if (!eaNorm || !saNorm) continue;
           if (!eaNorm.includes(saNorm) && !saNorm.includes(eaNorm)) continue;
@@ -719,7 +958,7 @@ function SubAgentPanel(props) {
         }
         if (!best) {
           for (const [, entry] of entriesMap) {
-            if (entry.status !== "running") continue;
+            if (entry.status !== "running" && entry.status !== "cancel_requested") continue;
             if (entry.sessionId) continue;
             const gap = nowTs - (entry.startedAt || 0);
             if (!best || gap > best.gap) best = {
@@ -729,7 +968,8 @@ function SubAgentPanel(props) {
           }
         }
         if (best) {
-          best.entry.status = targetStatus;
+          const finalStatus = targetStatus === "error" ? "error" : settleOnIdle(best.entry);
+          best.entry.status = finalStatus;
           best.entry.endedAt = nowTs;
           best.entry.tokens = best.entry.tokens ?? sessionTokens;
           best.entry.cost = best.entry.cost ?? sessionCost;
@@ -748,13 +988,14 @@ function SubAgentPanel(props) {
       const next = new Map(prev);
       for (const [id, entry] of next) {
         if (entry.sessionId !== sid) continue;
-        if (entry.status !== "running" && entry.status !== "done") continue;
+        if (entry.status !== "running" && entry.status !== "done" && entry.status !== "cancel_requested") continue;
         if (sid === props.sessionId) continue;
-        const alreadySettled = entry.status !== "running";
+        const alreadySettled = entry.status !== "running" && entry.status !== "cancel_requested";
+        const finalStatus = status === "error" ? "error" : settleOnIdle(entry);
         next.set(id, {
           ...entry,
           ...alreadySettled ? {} : {
-            status,
+            status: finalStatus,
             endedAt: Date.now()
           },
           tokens: entry.tokens ?? sessionTokens,
@@ -772,7 +1013,7 @@ function SubAgentPanel(props) {
         const saNorm = normalize(sessionAgent);
         let best = null;
         for (const [id, entry] of next) {
-          if (entry.status !== "running") continue;
+          if (entry.status !== "running" && entry.status !== "cancel_requested") continue;
           const eaNorm = normalize(entry.agent);
           if (!eaNorm || !saNorm) continue;
           if (!eaNorm.includes(saNorm) && !saNorm.includes(eaNorm)) continue;
@@ -784,7 +1025,7 @@ function SubAgentPanel(props) {
         }
         if (!best) {
           for (const [id, entry] of next) {
-            if (entry.status !== "running") continue;
+            if (entry.status !== "running" && entry.status !== "cancel_requested") continue;
             if (entry.sessionId) continue;
             const gap = nowTs - (entry.startedAt || 0);
             if (!best || gap > best.gap) best = {
@@ -795,9 +1036,10 @@ function SubAgentPanel(props) {
         }
         if (best) {
           const entry = next.get(best.id);
+          const finalStatus = status === "error" ? "error" : settleOnIdle(entry);
           next.set(best.id, {
             ...entry,
-            status,
+            status: finalStatus,
             endedAt: nowTs,
             tokens: sessionTokens || entry.tokens,
             cost: sessionCost || entry.cost,
@@ -1020,7 +1262,7 @@ function SubAgentPanel(props) {
                       const scanHasChild = scanStMeta?.session_id !== void 0 || scanStMeta?.sessionId !== void 0;
                       if (scanHasChild) status = "running";
                     }
-                    if (exists && exists.status !== "running") continue;
+                    if (exists && exists.status !== "running" && exists.status !== "cancel_requested") continue;
                     if (exists && status === "running") {
                       if (!rawStatus) {
                         const msgTokens = msg?.tokens;
@@ -1069,15 +1311,16 @@ function SubAgentPanel(props) {
           let changed = false;
           const next = new Map(prev);
           for (const [id, entry] of next) {
-            if (entry.status !== "running" || !entry.sessionId) continue;
+            if (entry.status !== "running" && entry.status !== "cancel_requested" || !entry.sessionId) continue;
             try {
               const st = props.api.state.session.status(entry.sessionId);
               if (!st || st.type !== "idle") continue;
               const tokens = readSessionTokens(entry.sessionId);
               const cost = readSessionCost(entry.sessionId);
+              const finalStatus = entry.status === "cancel_requested" && entry.abortAccepted ? "cancelled" : "done";
               next.set(id, {
                 ...entry,
-                status: "done",
+                status: finalStatus,
                 endedAt: Date.now(),
                 tokens: tokens ?? entry.tokens,
                 cost: cost ?? entry.cost
@@ -1173,8 +1416,8 @@ function SubAgentPanel(props) {
       elapsed: (e.endedAt ?? nowVal) - e.startedAt
     }));
   });
-  const doneCount = createMemo(() => entryList().filter((e) => e.status === "done").length);
-  const runningCount = createMemo(() => entryList().filter((e) => e.status === "running").length);
+  const doneCount = createMemo(() => entryList().filter((e) => e.status === "done" || e.status === "cancelled").length);
+  const runningCount = createMemo(() => entryList().filter((e) => e.status === "running" || e.status === "cancel_requested").length);
   const errCount = createMemo(() => entryList().filter((e) => e.status === "error").length);
   const anyEntry = () => entryList().length > 0;
   const totalTokens = createMemo(() => {
@@ -1433,11 +1676,15 @@ function SubAgentPanel(props) {
               children: (entry) => {
                 const isExpanded = () => expanded() === entry.id;
                 const isRunning = entry.status === "running";
+                const isCancelRequested = entry.status === "cancel_requested";
+                const isCancelled = entry.status === "cancelled";
                 const isError = entry.status === "error";
+                const isActiveRunning = isRunning || isCancelRequested;
                 const elapsed = () => (entry.endedAt ?? now()) - entry.startedAt;
                 const statusDot = () => "\u25CF";
                 const statusColor = () => {
-                  if (!isRunning) return isError ? pal().error : pal().success;
+                  if (isCancelled) return pal().muted;
+                  if (!isActiveRunning) return isError ? pal().error : pal().success;
                   const t2 = (Math.sin(now() % 2e3 / 2e3 * Math.PI * 2 - Math.PI / 2) + 1) / 2;
                   const a = rgb(pal().muted), b = rgb(pal().warning);
                   if (!a || !b) return pal().warning;
@@ -1446,9 +1693,9 @@ function SubAgentPanel(props) {
                   const bl = Math.round(a.b + (b.b - a.b) * t2);
                   return "#" + [r, g, bl].map((v) => Math.max(0, Math.min(255, v)).toString(16).padStart(2, "0")).join("");
                 };
-                const timeColor = () => isRunning ? pal().warning : isError ? pal().error : pal().muted;
+                const timeColor = () => isActiveRunning ? pal().warning : isError ? pal().error : pal().muted;
                 const tokenText = () => !isExpanded() && entry.tokens !== void 0 && entry.tokens > 0 ? ` ${fmtTokens(entry.tokens)}` : "";
-                const timeText = () => !isExpanded() && (elapsed() >= 2e3 || entry.endedAt !== void 0) ? fmtDurationShort(elapsed(), isRunning) : "";
+                const timeText = () => !isExpanded() && (elapsed() >= 2e3 || entry.endedAt !== void 0) ? fmtDurationShort(elapsed(), isActiveRunning) : "";
                 const suffixW = () => {
                   let w = 0;
                   const t2 = timeText();
@@ -1479,23 +1726,23 @@ function SubAgentPanel(props) {
                   _$insert(_el$25, (() => {
                     var _c$2 = _$memo(() => !!timeText());
                     return () => _c$2() ? [" ", (() => {
-                      var _el$89 = _$createElement("span");
-                      _$insert(_el$89, timeText);
-                      _$effect((_$p) => _$setProp(_el$89, "style", {
+                      var _el$82 = _$createElement("span");
+                      _$insert(_el$82, timeText);
+                      _$effect((_$p) => _$setProp(_el$82, "style", {
                         fg: timeColor()
                       }, _$p));
-                      return _el$89;
+                      return _el$82;
                     })()] : null;
                   })(), null);
                   _$insert(_el$25, (() => {
                     var _c$3 = _$memo(() => !!tokenText());
                     return () => _c$3() ? (() => {
-                      var _el$90 = _$createElement("span");
-                      _$insert(_el$90, tokenText);
-                      _$effect((_$p) => _$setProp(_el$90, "style", {
+                      var _el$83 = _$createElement("span");
+                      _$insert(_el$83, tokenText);
+                      _$effect((_$p) => _$setProp(_el$83, "style", {
                         fg: pal().muted
                       }, _$p));
-                      return _el$90;
+                      return _el$83;
                     })() : null;
                   })(), null);
                   _$effect((_p$) => {
@@ -1558,14 +1805,14 @@ function SubAgentPanel(props) {
                       _$insertNode(_el$39, _el$40);
                       _$insert(_el$39, () => t("status.label"), _el$40);
                       _$insert(_el$41, () => " ".repeat(expandedPad(t("status.label"))));
-                      _$insert(_el$42, () => isRunning ? t("status.running") : isError ? t("status.error") : t("status.done"));
+                      _$insert(_el$42, () => isActiveRunning ? t("status.running") : isCancelled ? t("status.cancelled") : isError ? t("status.error") : t("status.done"));
                       _$effect((_p$) => {
                         var _v$9 = {
                           fg: pal().primary
                         }, _v$0 = {
                           fg: pal().muted
                         }, _v$1 = {
-                          fg: isRunning ? pal().warning : isError ? pal().error : pal().success
+                          fg: isActiveRunning ? pal().warning : isCancelled ? pal().muted : isError ? pal().error : pal().success
                         };
                         _v$9 !== _p$.e && (_p$.e = _$setProp(_el$39, "style", _v$9, _p$.e));
                         _v$0 !== _p$.t && (_p$.t = _$setProp(_el$41, "style", _v$0, _p$.t));
@@ -1590,7 +1837,7 @@ function SubAgentPanel(props) {
                         _$insertNode(_el$45, _el$46);
                         _$insert(_el$45, () => t("time.label"), _el$46);
                         _$insert(_el$47, () => " ".repeat(expandedPad(t("time.label"))));
-                        _$insert(_el$48, () => fmtDurationShort(elapsed(), isRunning));
+                        _$insert(_el$48, () => fmtDurationShort(elapsed(), isActiveRunning));
                         _$effect((_p$) => {
                           var _v$10 = {
                             fg: pal().primary
@@ -1681,16 +1928,54 @@ function SubAgentPanel(props) {
                         return entry.cost !== void 0;
                       },
                       get children() {
-                        var _el$61 = _$createElement("text"), _el$62 = _$createTextNode(`  `), _el$63 = _$createElement("span"), _el$64 = _$createTextNode(`: `), _el$65 = _$createElement("span"), _el$66 = _$createElement("span"), _el$67 = _$createTextNode(`$`);
+                        return (() => {
+                          const cost = entry.cost;
+                          return (() => {
+                            var _el$84 = _$createElement("text"), _el$85 = _$createTextNode(`  `), _el$86 = _$createElement("span"), _el$87 = _$createTextNode(`: `), _el$88 = _$createElement("span"), _el$89 = _$createElement("span"), _el$90 = _$createTextNode(`$`);
+                            _$insertNode(_el$84, _el$85);
+                            _$insertNode(_el$84, _el$86);
+                            _$insertNode(_el$84, _el$88);
+                            _$insertNode(_el$84, _el$89);
+                            _$insertNode(_el$86, _el$87);
+                            _$insert(_el$86, () => t("cost.label"), _el$87);
+                            _$insert(_el$88, () => " ".repeat(expandedPad(t("cost.label"))));
+                            _$insertNode(_el$89, _el$90);
+                            _$insert(_el$89, () => cost.toFixed(4), null);
+                            _$effect((_p$) => {
+                              var _v$29 = {
+                                fg: pal().primary
+                              }, _v$30 = {
+                                fg: pal().muted
+                              }, _v$31 = {
+                                fg: pal().muted
+                              };
+                              _v$29 !== _p$.e && (_p$.e = _$setProp(_el$86, "style", _v$29, _p$.e));
+                              _v$30 !== _p$.t && (_p$.t = _$setProp(_el$88, "style", _v$30, _p$.t));
+                              _v$31 !== _p$.a && (_p$.a = _$setProp(_el$89, "style", _v$31, _p$.a));
+                              return _p$;
+                            }, {
+                              e: void 0,
+                              t: void 0,
+                              a: void 0
+                            });
+                            return _el$84;
+                          })();
+                        })();
+                      }
+                    }), _$createComponent(Show, {
+                      get when() {
+                        return entry.model;
+                      },
+                      get children() {
+                        var _el$61 = _$createElement("text"), _el$62 = _$createTextNode(`  `), _el$63 = _$createElement("span"), _el$64 = _$createTextNode(`: `), _el$65 = _$createElement("span"), _el$66 = _$createElement("span");
                         _$insertNode(_el$61, _el$62);
                         _$insertNode(_el$61, _el$63);
                         _$insertNode(_el$61, _el$65);
                         _$insertNode(_el$61, _el$66);
                         _$insertNode(_el$63, _el$64);
-                        _$insert(_el$63, () => t("cost.label"), _el$64);
-                        _$insert(_el$65, () => " ".repeat(expandedPad(t("cost.label"))));
-                        _$insertNode(_el$66, _el$67);
-                        _$insert(_el$66, () => entry.cost.toFixed(4), null);
+                        _$insert(_el$63, () => t("model.label"), _el$64);
+                        _$insert(_el$65, () => " ".repeat(expandedPad(t("model.label"))));
+                        _$insert(_el$66, () => truncate(entry.model, expandedValAvail()));
                         _$effect((_p$) => {
                           var _v$19 = {
                             fg: pal().primary
@@ -1712,18 +1997,20 @@ function SubAgentPanel(props) {
                       }
                     }), _$createComponent(Show, {
                       get when() {
-                        return entry.model;
+                        return entry.todoTotal !== void 0;
                       },
                       get children() {
-                        var _el$68 = _$createElement("text"), _el$69 = _$createTextNode(`  `), _el$70 = _$createElement("span"), _el$71 = _$createTextNode(`: `), _el$72 = _$createElement("span"), _el$73 = _$createElement("span");
-                        _$insertNode(_el$68, _el$69);
-                        _$insertNode(_el$68, _el$70);
-                        _$insertNode(_el$68, _el$72);
-                        _$insertNode(_el$68, _el$73);
-                        _$insertNode(_el$70, _el$71);
-                        _$insert(_el$70, () => t("model.label"), _el$71);
-                        _$insert(_el$72, () => " ".repeat(expandedPad(t("model.label"))));
-                        _$insert(_el$73, () => truncate(entry.model, expandedValAvail()));
+                        var _el$67 = _$createElement("text"), _el$68 = _$createTextNode(`  `), _el$69 = _$createElement("span"), _el$70 = _$createTextNode(`: `), _el$71 = _$createElement("span"), _el$72 = _$createElement("span"), _el$73 = _$createTextNode(`/`);
+                        _$insertNode(_el$67, _el$68);
+                        _$insertNode(_el$67, _el$69);
+                        _$insertNode(_el$67, _el$71);
+                        _$insertNode(_el$67, _el$72);
+                        _$insertNode(_el$69, _el$70);
+                        _$insert(_el$69, () => t("todo.label"), _el$70);
+                        _$insert(_el$71, () => " ".repeat(expandedPad(t("todo.label"))));
+                        _$insertNode(_el$72, _el$73);
+                        _$insert(_el$72, () => entry.todoDone, _el$73);
+                        _$insert(_el$72, () => entry.todoTotal, null);
                         _$effect((_p$) => {
                           var _v$22 = {
                             fg: pal().primary
@@ -1732,33 +2019,55 @@ function SubAgentPanel(props) {
                           }, _v$24 = {
                             fg: pal().muted
                           };
-                          _v$22 !== _p$.e && (_p$.e = _$setProp(_el$70, "style", _v$22, _p$.e));
-                          _v$23 !== _p$.t && (_p$.t = _$setProp(_el$72, "style", _v$23, _p$.t));
-                          _v$24 !== _p$.a && (_p$.a = _$setProp(_el$73, "style", _v$24, _p$.a));
+                          _v$22 !== _p$.e && (_p$.e = _$setProp(_el$69, "style", _v$22, _p$.e));
+                          _v$23 !== _p$.t && (_p$.t = _$setProp(_el$71, "style", _v$23, _p$.t));
+                          _v$24 !== _p$.a && (_p$.a = _$setProp(_el$72, "style", _v$24, _p$.a));
                           return _p$;
                         }, {
                           e: void 0,
                           t: void 0,
                           a: void 0
                         });
-                        return _el$68;
+                        return _el$67;
                       }
                     }), _$createComponent(Show, {
                       get when() {
-                        return entry.todoTotal !== void 0;
+                        return entry.sessionId;
                       },
                       get children() {
-                        var _el$74 = _$createElement("text"), _el$75 = _$createTextNode(`  `), _el$76 = _$createElement("span"), _el$77 = _$createTextNode(`: `), _el$78 = _$createElement("span"), _el$79 = _$createElement("span"), _el$80 = _$createTextNode(`/`);
+                        var _el$74 = _$createElement("text"), _el$75 = _$createTextNode(`  `), _el$76 = _$createElement("span"), _el$77 = _$createTextNode(`: `), _el$78 = _$createElement("span"), _el$79 = _$createElement("span"), _el$80 = _$createElement("span");
                         _$insertNode(_el$74, _el$75);
                         _$insertNode(_el$74, _el$76);
                         _$insertNode(_el$74, _el$78);
                         _$insertNode(_el$74, _el$79);
+                        _$insertNode(_el$74, _el$80);
+                        _$setProp(_el$74, "onMouseUp", async () => {
+                          const sessionId = entry.sessionId;
+                          if (!sessionId) return;
+                          const result = await copyText(sessionId);
+                          if (result.copied) {
+                            props.api.ui.toast({
+                              variant: "success",
+                              title: entry.title || entry.agent,
+                              message: t("session.toast.copied"),
+                              duration: 2500
+                            });
+                            return;
+                          }
+                          props.api.ui.toast({
+                            variant: "warning",
+                            title: entry.title || entry.agent,
+                            message: `${sessionId}
+
+${t("session.toast.copy_failed")}`,
+                            duration: 8e3
+                          });
+                        });
                         _$insertNode(_el$76, _el$77);
-                        _$insert(_el$76, () => t("todo.label"), _el$77);
-                        _$insert(_el$78, () => " ".repeat(expandedPad(t("todo.label"))));
-                        _$insertNode(_el$79, _el$80);
-                        _$insert(_el$79, () => entry.todoDone, _el$80);
-                        _$insert(_el$79, () => entry.todoTotal, null);
+                        _$insert(_el$76, () => t("session.label"), _el$77);
+                        _$insert(_el$78, () => " ".repeat(expandedPad(t("session.label"))));
+                        _$insert(_el$79, () => truncate(entry.sessionId, expandedValAvail() - visualWidth(" \u2398")));
+                        _$insertNode(_el$80, _$createTextNode(` \u2398`));
                         _$effect((_p$) => {
                           var _v$25 = {
                             fg: pal().primary
@@ -1766,59 +2075,13 @@ function SubAgentPanel(props) {
                             fg: pal().muted
                           }, _v$27 = {
                             fg: pal().muted
+                          }, _v$28 = {
+                            fg: pal().warning
                           };
                           _v$25 !== _p$.e && (_p$.e = _$setProp(_el$76, "style", _v$25, _p$.e));
                           _v$26 !== _p$.t && (_p$.t = _$setProp(_el$78, "style", _v$26, _p$.t));
                           _v$27 !== _p$.a && (_p$.a = _$setProp(_el$79, "style", _v$27, _p$.a));
-                          return _p$;
-                        }, {
-                          e: void 0,
-                          t: void 0,
-                          a: void 0
-                        });
-                        return _el$74;
-                      }
-                    }), _$createComponent(Show, {
-                      get when() {
-                        return entry.sessionId;
-                      },
-                      get children() {
-                        var _el$81 = _$createElement("text"), _el$82 = _$createTextNode(`  `), _el$83 = _$createElement("span"), _el$84 = _$createTextNode(`: `), _el$85 = _$createElement("span"), _el$86 = _$createElement("span"), _el$87 = _$createElement("span");
-                        _$insertNode(_el$81, _el$82);
-                        _$insertNode(_el$81, _el$83);
-                        _$insertNode(_el$81, _el$85);
-                        _$insertNode(_el$81, _el$86);
-                        _$insertNode(_el$81, _el$87);
-                        _$setProp(_el$81, "onMouseUp", () => {
-                          if (entry.sessionId) {
-                            props.api.ui.toast({
-                              title: entry.title || entry.agent,
-                              message: `${entry.sessionId}
-
-${t("session.toast.copy")}`,
-                              duration: 8e3
-                            });
-                          }
-                        });
-                        _$insertNode(_el$83, _el$84);
-                        _$insert(_el$83, () => t("session.label"), _el$84);
-                        _$insert(_el$85, () => " ".repeat(expandedPad(t("session.label"))));
-                        _$insert(_el$86, () => truncate(entry.sessionId, expandedValAvail() - visualWidth(" \u2398")));
-                        _$insertNode(_el$87, _$createTextNode(` \u2398`));
-                        _$effect((_p$) => {
-                          var _v$28 = {
-                            fg: pal().primary
-                          }, _v$29 = {
-                            fg: pal().muted
-                          }, _v$30 = {
-                            fg: pal().muted
-                          }, _v$31 = {
-                            fg: pal().warning
-                          };
-                          _v$28 !== _p$.e && (_p$.e = _$setProp(_el$83, "style", _v$28, _p$.e));
-                          _v$29 !== _p$.t && (_p$.t = _$setProp(_el$85, "style", _v$29, _p$.t));
-                          _v$30 !== _p$.a && (_p$.a = _$setProp(_el$86, "style", _v$30, _p$.a));
-                          _v$31 !== _p$.o && (_p$.o = _$setProp(_el$87, "style", _v$31, _p$.o));
+                          _v$28 !== _p$.o && (_p$.o = _$setProp(_el$80, "style", _v$28, _p$.o));
                           return _p$;
                         }, {
                           e: void 0,
@@ -1826,7 +2089,7 @@ ${t("session.toast.copy")}`,
                           a: void 0,
                           o: void 0
                         });
-                        return _el$81;
+                        return _el$74;
                       }
                     }), _$createComponent(Show, {
                       get when() {
@@ -1834,29 +2097,21 @@ ${t("session.toast.copy")}`,
                       },
                       get children() {
                         return (() => {
-                          const dismissLabel = () => `- ${t("dismiss.label")}`;
                           const openPrefix = () => "  \u2192 ";
                           const openFull = () => entry.sessionId ? openPrefix() + t("open.label") : "";
                           const openW = () => entry.sessionId ? visualWidth(openFull()) : 0;
-                          const spacerW = () => Math.max(
-                            1,
-                            panelWidth() - openW() - visualWidth(dismissLabel()) - 2
-                            /* indent */
-                          );
+                          const cancelLabel = () => ` ${t("cancel.label")}`;
+                          const dismissLabel = () => ` ${t("dismiss.label")}`;
+                          const rightW = (isRunning ? visualWidth(dismissLabel()) : 0) + (isRunning && entry.sessionId ? visualWidth(cancelLabel()) : 0);
+                          const spacerW = () => Math.max(1, panelWidth() - openW() - rightW - 2);
                           return (() => {
-                            var _el$91 = _$createElement("box");
+                            var _el$91 = _$createElement("box"), _el$95 = _$createElement("text");
+                            _$insertNode(_el$91, _el$95);
                             _$setProp(_el$91, "flexDirection", "row");
                             _$insert(_el$91, _$createComponent(Show, {
                               get when() {
                                 return entry.sessionId;
                               },
-                              get fallback() {
-                                return (() => {
-                                  var _el$98 = _$createElement("text");
-                                  _$insertNode(_el$98, _$createTextNode(`  `));
-                                  return _el$98;
-                                })();
-                              },
                               get children() {
                                 var _el$92 = _$createElement("text"), _el$93 = _$createElement("span"), _el$94 = _$createElement("span");
                                 _$insertNode(_el$92, _el$93);
@@ -1887,39 +2142,51 @@ ${t("session.toast.copy")}`,
                                 });
                                 return _el$92;
                               }
+                            }), _el$95);
+                            _$insert(_el$95, () => " ".repeat(spacerW()));
+                            _$insert(_el$91, _$createComponent(Show, {
+                              get when() {
+                                return isRunning && entry.sessionId;
+                              },
+                              get children() {
+                                var _el$96 = _$createElement("text"), _el$97 = _$createElement("span");
+                                _$insertNode(_el$96, _el$97);
+                                _$setProp(_el$96, "onMouseOver", () => setHoveredCancel(entry.id));
+                                _$setProp(_el$96, "onMouseOut", () => setHoveredCancel(void 0));
+                                _$setProp(_el$96, "onMouseUp", () => cancelEntry(entry));
+                                _$insert(_el$97, cancelLabel);
+                                _$effect((_$p) => _$setProp(_el$97, "style", {
+                                  fg: hoveredCancel() === entry.id ? pal().warning : pal().error
+                                }, _$p));
+                                return _el$96;
+                              }
                             }), null);
                             _$insert(_el$91, _$createComponent(Show, {
                               when: isRunning,
                               get children() {
-                                return [(() => {
-                                  var _el$95 = _$createElement("text");
-                                  _$insert(_el$95, () => " ".repeat(spacerW()));
-                                  _$effect((_$p) => _$setProp(_el$95, "style", {
-                                    fg: pal().muted
-                                  }, _$p));
-                                  return _el$95;
-                                })(), (() => {
-                                  var _el$96 = _$createElement("text"), _el$97 = _$createElement("span");
-                                  _$insertNode(_el$96, _el$97);
-                                  _$setProp(_el$96, "onMouseOver", () => setHoveredDismiss(entry.id));
-                                  _$setProp(_el$96, "onMouseOut", () => setHoveredDismiss(void 0));
-                                  _$setProp(_el$96, "onMouseUp", () => {
-                                    upsertEntry({
-                                      id: entry.id,
-                                      title: entry.title,
-                                      agent: entry.agent,
-                                      prompt: entry.prompt,
-                                      status: "done"
-                                    });
+                                var _el$98 = _$createElement("text"), _el$99 = _$createElement("span");
+                                _$insertNode(_el$98, _el$99);
+                                _$setProp(_el$98, "onMouseOver", () => setHoveredDismiss(entry.id));
+                                _$setProp(_el$98, "onMouseOut", () => setHoveredDismiss(void 0));
+                                _$setProp(_el$98, "onMouseUp", () => {
+                                  upsertEntry({
+                                    id: entry.id,
+                                    title: entry.title,
+                                    agent: entry.agent,
+                                    prompt: entry.prompt,
+                                    status: "done"
                                   });
-                                  _$insert(_el$97, dismissLabel);
-                                  _$effect((_$p) => _$setProp(_el$97, "style", {
-                                    fg: hoveredDismiss() === entry.id ? pal().warning : pal().muted
-                                  }, _$p));
-                                  return _el$96;
-                                })()];
+                                });
+                                _$insert(_el$99, dismissLabel);
+                                _$effect((_$p) => _$setProp(_el$99, "style", {
+                                  fg: hoveredDismiss() === entry.id ? pal().warning : pal().muted
+                                }, _$p));
+                                return _el$98;
                               }
                             }), null);
+                            _$effect((_$p) => _$setProp(_el$95, "style", {
+                              fg: pal().muted
+                            }, _$p));
                             return _el$91;
                           })();
                         })();
@@ -2233,7 +2500,7 @@ var tui = async (api) => {
       }
       let count = 0;
       for (const [, entry] of entries) {
-        if (entry.status === "running") {
+        if (entry.status === "running" || entry.status === "cancel_requested") {
           entry.status = "done";
           entry.endedAt = Date.now();
           count++;