@capagents/forgeqe 1.1.6 → 1.1.7

package/HOW_TO_USE.md

@@ -463,8 +463,8 @@ The chat gets a short summary and a card with both paths as links, and **Open th
 The Activities column shows what the agents do as they do it:
 
 - the status line: who is working, a progress bar for the plan or a suite's cases, for how long, and **■ Stop**; under it, the whole width, what is happening now (*Agent: Azure DevOps API · QI-Payments/_apis/build/builds…*);
-- **Plan**: the agent's own task list as soon as it writes one, then each browser step or suite case: ○ pending, ◐ in progress, ✓ done, ✗ failed and why. ForgeQE's agent writes a plan for any request of three steps or more and updates it as it goes;
-- **Activity**: **Now** (the task in progress) and **Next** (the next task), then every tool call, browser step, and note. A call shows ◐ the moment it starts and becomes ✓ or ✗ in the same row when it ends, so a long API query or test run is never invisible. Reads and searches that the conversation leaves out at the brief detail level are listed here. A call takes one row and a note up to three; focus the panel to scroll through everything or filter it.
+- **Plan**: the agent's own task list as soon as it writes one, then each browser step or suite case: ○ pending, a spinner while in progress, ✓ done, ✗ failed and why. ForgeQE's agent writes a plan for any request of three steps or more and updates it as it goes;
+- **Activity**: **Now** (the task in progress) and **Next** (the next task), then every tool call, browser step, and note. A call shows a spinner the moment it starts and becomes ✓ or ✗ in the same row when it ends, so a long API query or test run is never invisible. Reads and searches that the conversation leaves out at the brief detail level are listed here. A call takes one row and a note up to three; focus the panel to scroll through everything or filter it. Each request starts under a line with its time and what you asked (*── 14:02  can you generate a defect report… ──*) and ends with how it went (*✓ Done in 1m 12s · 16 activities*, or ✗ Failed, ■ Stopped, ? Waiting for your answer), so one request's activities are never read as another's; earlier requests stay above, to scroll back to. The Plan shows the current request only.
 
 Over the conversation: **Files** (each file read ◉, written ✚, or edited ✎, newest first), **Context** (how full the model's context window is, and the skills, product knowledge, domain, and MCP servers in it), and **Tokens** (total, input, output, cached). When that half is under 80 columns they fold into one line: *Files 4 (1 changed) · Context 26% · Skills 2 · 52.9K tokens*.
 

package/docs/user-guide.html

@@ -719,8 +719,8 @@ Add a GitHub Actions workflow that runs tests/cases.yaml on every PR, and make i
 <p>The Activities column shows what the agents do as they do it:</p>
 <ul>
 <li>the status line: who is working, a progress bar for the plan or a suite's cases, for how long, and <strong>■ Stop</strong>; under it, the whole width, what is happening now (<em>Agent: Azure DevOps API · QI-Payments/_apis/build/builds…</em>);</li>
-<li><strong>Plan</strong>: the agent's own task list as soon as it writes one, then each browser step or suite case: ○ pending, ◐ in progress, ✓ done, ✗ failed and why. ForgeQE's agent writes a plan for any request of three steps or more and updates it as it goes;</li>
-<li><strong>Activity</strong>: <strong>Now</strong> (the task in progress) and <strong>Next</strong> (the next task), then every tool call, browser step, and note. A call shows ◐ the moment it starts and becomes ✓ or ✗ in the same row when it ends, so a long API query or test run is never invisible. Reads and searches that the conversation leaves out at the brief detail level are listed here. A call takes one row and a note up to three; focus the panel to scroll through everything or filter it.</li>
+<li><strong>Plan</strong>: the agent's own task list as soon as it writes one, then each browser step or suite case: ○ pending, a spinner while in progress, ✓ done, ✗ failed and why. ForgeQE's agent writes a plan for any request of three steps or more and updates it as it goes;</li>
+<li><strong>Activity</strong>: <strong>Now</strong> (the task in progress) and <strong>Next</strong> (the next task), then every tool call, browser step, and note. A call shows a spinner the moment it starts and becomes ✓ or ✗ in the same row when it ends, so a long API query or test run is never invisible. Reads and searches that the conversation leaves out at the brief detail level are listed here. A call takes one row and a note up to three; focus the panel to scroll through everything or filter it. Each request starts under a line with its time and what you asked (<em>── 14:02  can you generate a defect report… ──</em>) and ends with how it went (<em>✓ Done in 1m 12s · 16 activities</em>, or ✗ Failed, ■ Stopped, ? Waiting for your answer), so one request's activities are never read as another's; earlier requests stay above, to scroll back to. The Plan shows the current request only.</li>
 </ul>
 <p>Over the conversation: <strong>Files</strong> (each file read ◉, written ✚, or edited ✎, newest first), <strong>Context</strong> (how full the model's context window is, and the skills, product knowledge, domain, and MCP servers in it), and <strong>Tokens</strong> (total, input, output, cached). When that half is under 80 columns they fold into one line: <em>Files 4 (1 changed) · Context 26% · Skills 2 · 52.9K tokens</em>.</p>
 <p><strong>Buttons.</strong> Under the input: <strong>✦ Refine</strong> (Ctrl-R; it fills in once there is text to refine), <strong>⌕ Search</strong> (Ctrl-P, the command palette), and <strong>▦ Panels</strong> (Ctrl-O); while a request runs, <strong>■ Stop</strong> (Esc) takes Refine's place. With the panels open, <strong>▦ Focus panels</strong> (Shift-Tab) and <strong>✕ Close</strong> (Ctrl-O) are in their status line. On a narrow terminal, <strong>◧ Details</strong> (Ctrl-O) and <strong>⇄ Profile</strong> (Tab) are under the input. Each is clickable.</p>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capagents/forgeqe",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "description": "ForgeQE: a browser agent CLI that runs goals and test cases in local Chrome or Chromium, or BrowserStack and TestMu AI/LambdaTest when configured, and turns passing runs into tests in your repo",
   "license": "MIT",
   "type": "module",

package/src/mcp/server.ts

@@ -24,6 +24,13 @@ export type McpServerOptions = {
   progressMs?: number
 }
 
+/** A ForgeQE tool call that has no line of its own, named for the Activity panel by its tool and its subject. */
+export function callLabel(name: string, args: Record<string, unknown>): string {
+  const subject = [args.title, args.goal, args.source, args.sources, args.run_dir, args.command].find((v) => typeof v === "string" && v.trim()) as string | undefined
+  const flat = subject?.replace(/\s+/g, " ").trim()
+  return `ForgeQE · ${name.replace(/_/g, " ")}${flat ? ` (${flat.length > 70 ? `${flat.slice(0, 69)}…` : flat})` : ""}`
+}
+
 /** JSON-RPC dispatch for MCP: initialize, ping, tools/list, tools/call, and cancellation. */
 export function createMcpServer(opts: McpServerOptions) {
   const running = new Map<string | number, AbortController>()
@@ -63,10 +70,13 @@ export function createMcpServer(opts: McpServerOptions) {
           }
         : undefined
       const callId = `${tool.name}-${String(id)}-${started}`
-      const said = (ok: boolean) => {
-        if (tool.line && emit) emit({ type: "call", text: tool.line(params.arguments || {}), ok, id: callId })
-      }
-      if (tool.line && emit) emit({ type: "call-start", text: tool.line(params.arguments || {}), id: callId })
+      // Every call is said as it starts and ends. A tool with no line of its own shows its result another way (a card,
+      // a run), so its call is named for the Activity panel only: "ForgeQE · write report (Open defects, 13 October)".
+      const args = params.arguments || {}
+      const label = tool.line ? tool.line(args) : callLabel(tool.name, args)
+      const quiet = tool.line ? {} : { quiet: true }
+      const said = (ok: boolean) => emit?.({ type: "call", text: label, ok, id: callId, ...quiet })
+      emit?.({ type: "call-start", text: label, id: callId, ...quiet })
       let out: unknown
       try {
         out = await tool.run(params.arguments || {}, { ...base, emit, signal: controller.signal })

package/src/mcp/tools.ts

@@ -102,9 +102,12 @@ export type ToolEvent =
   /** write_report saved a report: its page and its Markdown. */
   | { type: "report"; title: string; html: string; markdown: string }
   /** A finished call of a tool that has no card of its own, as one line: "Azure DevOps API · QI-Claims/_apis/build/builds (top 5)". */
-  | { type: "call"; text: string; ok: boolean; id?: string }
-  /** The same call as it starts, so a long one is visible while it runs; its `call` with the same `id` follows. */
-  | { type: "call-start"; text: string; id: string }
+  | { type: "call"; text: string; ok: boolean; id?: string; quiet?: boolean }
+  /**
+   * The same call as it starts, so a long one is visible while it runs; its `call` with the same `id` follows.
+   * `quiet`: a tool that shows its own result (a card, a run): the call is for the Activity panel only.
+   */
+  | { type: "call-start"; text: string; id: string; quiet?: boolean }
 
 const API_LABEL: Record<string, string> = { azure_devops: "Azure DevOps", jira: "Jira", xray: "Xray", confluence: "Confluence" }
 
@@ -114,7 +117,12 @@ const API_LABEL: Record<string, string> = { azure_devops: "Azure DevOps", jira:
  */
 export function queryLine(args: Record<string, any>): string {
   const name = `${API_LABEL[String(args.system)] || String(args.system || "API")} API`
-  if (args.wiql) return `${name} · WIQL (${clip(String(args.wiql).replace(/\s+/g, " ").replace(/^SELECT .*? FROM WorkItems WHERE /i, ""), 90)})`
+  if (args.wiql) {
+    // The project first: it is what tells one search from the next, and the @project clause then says nothing more.
+    const where = String(args.wiql).replace(/\s+/g, " ").replace(/^SELECT .*? FROM WorkItems WHERE /i, "")
+    const query = args.project ? where.replace(/^\[System\.TeamProject\] = @project AND /i, "") : where
+    return `${name} · WIQL${args.project ? ` · ${args.project}` : ""} (${clip(query, 90)})`
+  }
   if (args.query) return `${name} · GraphQL (${clip(String(args.query).replace(/\s+/g, " "), 90)})`
   const raw = String(args.path || "")
   const url = /^https?:\/\//.test(raw) ? raw.replace(/^https?:\/\/[^/]+\/(?:[^/]+\/(?=[^/]+\/_apis\/))?/, "") : raw.replace(/^\//, "")

package/src/tui/App.tsx

@@ -30,7 +30,7 @@ import { initWorkspace } from "../init.ts"
 import { ShortcutsPanel } from "./shortcuts.tsx"
 import { ago, getStarted, projectLine, setupSentence, type Fact, type GetStarted, recentWork, startActions, type RecentItem, type StartAction } from "./landing.ts"
 import { TIPS, formatDuration, formatTokens, packageVersion, shortCwd, theme } from "./theme.ts"
-import { emptyProduced, Line, Produced, producedCard, settleCall, TestsSetting, TranscriptLine, trimLines } from "./transcript.tsx"
+import { emptyProduced, Line, Produced, producedCard, settleCall, sinceRequest, TestsSetting, TranscriptLine, trimLines } from "./transcript.tsx"
 import { Dialog, dialogSpec } from "./dialogs.ts"
 import { activityFromLog, clip, modelLabel } from "./text.ts"
 import { featuresText } from "../capabilities/render.ts"
@@ -444,7 +444,7 @@ export function App({ options }: { options: TuiOptions }) {
       reloadAfterAuth()
       return
     }
-    const controller = begin("Signing in…")
+    const controller = begin("Signing in…", system ? `Sign in to ${system}` : "Sign in")
     controller.signal.addEventListener("abort", () => settleEntry(null), { once: true })
     let finalStatus = "fail"
     try {
@@ -972,7 +972,7 @@ export function App({ options }: { options: TuiOptions }) {
         if (!aborted()) setActivity(`Agent: ${clip(e.text, 60)}…`)
         return
       case "call":
-        pushTool(e.text, e.ok, e.id)
+        pushTool(e.text, e.ok, e.id, !e.quiet)
         if (!aborted()) setActivity(nowWorking())
         return
       case "agent": {
@@ -1037,6 +1037,9 @@ export function App({ options }: { options: TuiOptions }) {
         return
       case "report":
         producedRef.current.reports.push({ title: e.title, html: e.html })
+        // What the report wrote is a file the request made: it is in Files with the rest.
+        for (const f of [e.markdown, e.html]) useFile(inspRef.current, { path: path.relative(process.cwd(), f) || f, action: "write" })
+        bump()
         return
     }
   }
@@ -1078,10 +1081,12 @@ export function App({ options }: { options: TuiOptions }) {
     ask,
   })
 
-  const begin = (activityText: string) => {
+  /** `request`: what was asked, which heads this request's lines in Activity so they are not read as the last one's. */
+  const begin = (activityText: string, request: string) => {
     const controller = new AbortController()
     abortRef.current = controller
     started.current = Date.now()
+    pushLine({ kind: "request", text: request.replace(/\s+/g, " ").trim(), pane: "activity", quiet: true, at: started.current })
     usedRef.current = new Map()
     producedRef.current = emptyProduced()
     newRequest(inspRef.current)
@@ -1095,8 +1100,16 @@ export function App({ options }: { options: TuiOptions }) {
   }
 
   const finish = (finalStatus: string, followUps: FollowUp[] = []) => {
-    // A call the request ended inside of (stopped, or its result never came) is not left spinning in Activity.
-    setLines((prev) => (prev.some((l) => l.kind === "running") ? prev.map((l) => (l.kind === "running" ? { ...l, kind: "tool" as const, text: `${l.text} · ${finalStatus === "stopped" ? "stopped" : "no result"}` } : l)) : prev))
+    // A call the request ended inside of (stopped, or its result never came) is not left spinning in Activity; then the
+    // request's closing line says how it ended, how long it took, and how many activities it had.
+    const took = started.current != null ? formatDuration(Date.now() - started.current) : ""
+    const ended = (["done", "fail", "stopped", "idle"] as const).find((x) => x === finalStatus) || "fail"
+    const endId = idRef.current++
+    setLines((prev) => {
+      const settled = prev.some((l) => l.kind === "running") ? prev.map((l) => (l.kind === "running" ? { ...l, kind: "tool" as const, text: `${l.text} · ${finalStatus === "stopped" ? "stopped" : "no result"}` } : l)) : prev
+      const n = sinceRequest(settled)
+      return trimLines([...settled, { id: endId, kind: "requestEnd", text: `${took ? `in ${took} · ` : ""}${n} ${n === 1 ? "activity" : "activities"}`, pane: "activity", quiet: true, ended }])
+    })
     setNext(nextSteps(producedRef.current, { testsOn: testsRef.current.on, followUps }))
     progressDone(inspRef.current, finalStatus === "stopped")
     bump()
@@ -1120,7 +1133,7 @@ export function App({ options }: { options: TuiOptions }) {
       directNoted.current = true
       push("sys", `ForgeQE's agent is off (${why}), so the text runs as a browser goal.${why.includes("agent runtime") ? ` ${INSTALL_HINT}` : " Press Tab for a live profile."} /features lists what ForgeQE can do.`)
     }
-    const controller = begin(cfg.llm.provider === "mock" ? "Running the offline demo…" : "Starting…")
+    const controller = begin(cfg.llm.provider === "mock" ? "Running the offline demo…" : "Starting…", goal)
     testsRef.current = { on: false, why: why.includes("agent runtime") ? "the agent runtime Scribe needs is not installed" : "ForgeQE's agent is off in the offline profile" }
     let finalStatus = "fail"
     try {
@@ -1135,7 +1148,7 @@ export function App({ options }: { options: TuiOptions }) {
   }
 
   const askAgent = async (text: string, cfg: AppConfig) => {
-    const controller = begin("Thinking…")
+    const controller = begin("Thinking…", text)
     const meterStart = meterSnapshot()
     setThinking(true)
     const setup = sessionSetup(cfg, options.repo)
@@ -1784,7 +1797,7 @@ export function App({ options }: { options: TuiOptions }) {
       <box style={{ flexDirection: "column", width: paneWidth, height: rowsAvailable, flexShrink: 0 }}>
         <StatusBar running={running} who={insp.who} activity={activity} elapsed={elapsed} status={status} width={paneWidth} onStop={stop} progress={suiteProgress || planProgress(insp)} actions={paneButtons} />
         <box style={{ height: 1, flexShrink: 0 }} />
-        {plan ? <PlanPanel s={insp} width={paneWidth} height={plan} selected={sel} onFocus={focusOn("plan")} /> : null}
+        {plan ? <PlanPanel s={insp} width={paneWidth} height={plan} selected={sel} onFocus={focusOn("plan")} animate={running} /> : null}
         <ActivityPanel
           lines={activityLines}
           scrollRef={activityScroll}

package/src/tui/inspector.tsx

@@ -6,7 +6,7 @@ import { fitButtons, Spinner, type Button } from "./components.tsx"
 import { filesByUse, type FileUse, type Inspector, type Progress } from "./session.ts"
 import { clip, tailCut } from "./text.ts"
 import { formatTokens, theme } from "./theme.ts"
-import type { Line } from "./transcript.tsx"
+import { isMarker, type Line } from "./transcript.tsx"
 
 /**
  * The split view's panels. Each is a rounded box with its title in the border, in its section's colour from the
@@ -171,18 +171,19 @@ const PROGRESS_MARK: Record<Progress["status"], [string, string]> = {
   skipped: ["■", theme.faint],
 }
 
-export type PlanLine = { mark: string; color: string; text: string; textColor: string }
+/** `live`: a task in progress or a step running, drawn with a spinner while the request runs. */
+export type PlanLine = { mark: string; color: string; text: string; textColor: string; live?: boolean }
 
 export function planLines(s: Inspector): PlanLine[] {
   const lines: PlanLine[] = []
   for (const p of s.plan) {
     const [mark, color] = PLAN_MARK[p.status] || PLAN_MARK.pending!
-    lines.push({ mark, color, text: p.text, textColor: p.status === "completed" || p.status === "cancelled" ? theme.muted : theme.text })
+    lines.push({ mark, color, text: p.text, textColor: p.status === "completed" || p.status === "cancelled" ? theme.muted : theme.text, ...(p.status === "in_progress" ? { live: true } : {}) })
   }
   if (s.progress.items.length && s.plan.length) lines.push({ mark: "─", color: theme.border, text: s.progress.title, textColor: theme.faint })
   for (const i of s.progress.items) {
     const [mark, color] = PROGRESS_MARK[i.status]
-    lines.push({ mark, color, text: i.detail ? `${i.label} — ${i.detail}` : i.label, textColor: i.status === "fail" ? theme.err : i.status === "running" ? theme.text : theme.muted })
+    lines.push({ mark, color, text: i.detail ? `${i.label} — ${i.detail}` : i.label, textColor: i.status === "fail" ? theme.err : i.status === "running" ? theme.text : theme.muted, ...(i.status === "running" ? { live: true } : {}) })
   }
   return lines
 }
@@ -201,7 +202,7 @@ export function windowRows(total: number, rows: number, selected?: number): [num
 }
 
 /** The agent's to-do list, then the browser steps or suite cases; the latest that fit, or around the selected one. */
-export function PlanPanel(props: { s: Inspector; width: number; height: number; selected?: number; onFocus?: () => void }) {
+export function PlanPanel(props: { s: Inspector; width: number; height: number; selected?: number; onFocus?: () => void; animate?: boolean }) {
   const { s, width, height } = props
   const lines = planLines(s)
   const done = s.plan.filter((p) => p.status === "completed").length
@@ -213,10 +214,9 @@ export function PlanPanel(props: { s: Inspector; width: number; height: number;
         const active = first + i === props.selected
         return (
           <box key={first + i} style={{ flexDirection: "row", height: 1, flexShrink: 0, backgroundColor: active ? theme.button : undefined }}>
-            <text>
-              <span fg={l.color}>{`${l.mark} `}</span>
-              <span fg={active ? theme.text : l.textColor}>{clip(l.text, Math.max(10, width - 8))}</span>
-            </text>
+            {/* What is being worked on now spins, so it reads as live; a task left open after the request does not. */}
+            <box style={{ width: 2, flexShrink: 0 }}>{l.live && props.animate ? <Spinner kind="dots" color={l.color} /> : <text fg={l.color}>{l.mark}</text>}</box>
+            <text fg={active ? theme.text : l.textColor}>{clip(l.text, Math.max(10, width - 8))}</text>
           </box>
         )
       })}
@@ -227,7 +227,8 @@ export function PlanPanel(props: { s: Inspector; width: number; height: number;
 /** Each kind of activity line: its mark, the mark's colour, and the text's colour. */
 const ACTIVITY_STYLE: Record<string, [string, string, string]> = {
   running: ["◐", theme.warn, theme.text],
-  tool: ["⚙", theme.faint, theme.muted],
+  // A finished call: ✓, so it never reads as the ○ of a task still to do.
+  tool: ["✓", theme.ok, theme.muted],
   file: ["✎", theme.accent, theme.text],
   code: ["▸", theme.memory, theme.memory],
   timing: ["+", theme.warn, theme.warn],
@@ -255,6 +256,42 @@ function ToolCall({ parts: [name, args], width }: { parts: [string, string]; wid
   )
 }
 
+const ENDED: Record<NonNullable<Line["ended"]>, [string, string, string]> = {
+  done: ["✓", "Done", theme.ok],
+  fail: ["✗", "Failed", theme.err],
+  stopped: ["■", "Stopped", theme.warn],
+  idle: ["?", "Waiting for your answer", theme.warn],
+}
+
+/** "── 14:02  can you generate a defect report… ─────": where a request's activities start. */
+function RequestStart({ line, width, first }: { line: Line; width: number; first: boolean }) {
+  const d = new Date(line.at || Date.now())
+  const time = `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`
+  // The rule runs the whole row: the mark column and the text's.
+  const room = Math.max(12, (width || 60) + 3)
+  const text = clip(line.text, Math.max(8, room - time.length - 8))
+  const fill = Math.max(2, room - 3 - time.length - 2 - text.length - 1)
+  return (
+    <text style={{ height: 1, flexShrink: 0, marginTop: first ? 0 : 1 }}>
+      <span fg={theme.border}>{"── "}</span>
+      <span fg={theme.accent}>{time}</span>
+      <span fg={theme.text}>{`  ${text} `}</span>
+      <span fg={theme.border}>{"─".repeat(fill)}</span>
+    </text>
+  )
+}
+
+/** "✓ Done in 1m 12s · 16 activities": how a request ended. */
+function RequestEnd({ line, width }: { line: Line; width: number }) {
+  const [mark, label, color] = ENDED[line.ended || "done"]
+  return (
+    <text style={{ height: 1, flexShrink: 0 }}>
+      <span fg={color}>{`${mark} ${label}`}</span>
+      <span fg={theme.faint}>{` ${clip(line.text, Math.max(8, (width || 60) - label.length))}`}</span>
+    </text>
+  )
+}
+
 /** Rows an activity line may take: a call is one row; narration and results up to three. */
 const NOTE_ROWS = 3
 
@@ -262,15 +299,24 @@ const NOTE_ROWS = 3
  * One activity line, its mark in a column of its own so wrapped text stays under the text. `width` is the text's
  * columns: a call is cut to one row and anything else to three, so a burst of output never takes the panel over.
  */
-export function ActivityRow({ line, width = 0 }: { line: Line; width?: number }) {
+export function ActivityRow({ line, width = 0, first = false }: { line: Line; width?: number; first?: boolean }) {
+  if (line.kind === "request") return <RequestStart line={line} width={width} first={first} />
+  if (line.kind === "requestEnd") return <RequestEnd line={line} width={width} />
   const [mark, markColor, textColor] = ACTIVITY_STYLE[line.kind] || ["·", theme.faint, theme.muted]
   const oneRow = line.kind === "tool" || line.kind === "running" || line.kind === "file"
   const fit = (t: string, rows: number) => (width > 0 ? clip(t.replace(/\s+/g, " "), width * rows) : t)
   return (
     <box style={{ flexDirection: "row", flexShrink: 0 }}>
-      <text fg={markColor} style={{ width: 2, flexShrink: 0 }}>
-        {mark}
-      </text>
+      {line.kind === "running" ? (
+        // A call in progress spins until its result takes the row.
+        <box style={{ width: 2, flexShrink: 0 }}>
+          <Spinner kind="dots" color={markColor} />
+        </box>
+      ) : (
+        <text fg={markColor} style={{ width: 2, flexShrink: 0 }}>
+          {mark}
+        </text>
+      )}
       {(line.kind === "tool" || line.kind === "running") && toolArgs(line.text) ? (
         // "Azure DevOps · pipelines build (action list, project QI-Claims)": the call readable, its arguments quiet.
         <ToolCall parts={toolArgs(line.text)!} width={width} />
@@ -292,9 +338,10 @@ export const ACTIVITY_FILTERS = [
 ] as const
 export type ActivityFilter = (typeof ACTIVITY_FILTERS)[number]["id"]
 
+/** The lines a filter keeps; where each request starts and ends always stays, so a filtered line is never orphaned. */
 export function filterActivity(lines: Line[], filter: ActivityFilter): Line[] {
   const kinds = ACTIVITY_FILTERS.find((f) => f.id === filter)?.kinds
-  return kinds ? lines.filter((l) => (kinds as readonly string[]).includes(l.kind)) : lines
+  return kinds ? lines.filter((l) => isMarker(l) || (kinds as readonly string[]).includes(l.kind)) : lines
 }
 
 /**
@@ -335,7 +382,9 @@ export function ActivityPanel(props: {
   const room = Math.max(10, props.width - 12)
   const shown = filterActivity(props.lines, filter)
   const label = ACTIVITY_FILTERS.find((f) => f.id === filter)!.label
-  const count = filter === "all" ? (shown.length ? ` · ${shown.length}` : "") : ` · ${label} ${shown.length} of ${props.lines.length}`
+  // Counts are of activities: the lines marking where requests start and end are not.
+  const real = (ls: Line[]) => ls.filter((l) => !isMarker(l)).length
+  const count = filter === "all" ? (real(shown) ? ` · ${real(shown)}` : "") : ` · ${label} ${real(shown)} of ${real(props.lines)}`
   return (
     <Panel title={`Activity${count}`} color={SECTION.activity} width={props.width} height={props.height} focused={props.focused} keys="↑↓ pgup pgdn scroll · esc chat" onFocus={props.onFocus}>
       {props.focused || filter !== "all" ? (
@@ -354,11 +403,13 @@ export function ActivityPanel(props: {
         </box>
       ) : null}
       {props.now?.now ? (
-        <text style={{ height: 1, flexShrink: 0 }}>
-          <span fg={theme.muted}>{"Now   "}</span>
-          <span fg={theme.warn}>{"◐ "}</span>
-          <span fg={theme.text}>{clip(props.now.now, room)}</span>
-        </text>
+        <box style={{ flexDirection: "row", height: 1, flexShrink: 0 }}>
+          <text fg={theme.muted}>{"Now   "}</text>
+          <box style={{ width: 2, flexShrink: 0 }}>
+            <Spinner kind="dots" color={theme.warn} />
+          </box>
+          <text fg={theme.text}>{clip(props.now.now, room)}</text>
+        </box>
       ) : null}
       {props.now?.next ? (
         <text style={{ height: 1, flexShrink: 0 }}>
@@ -367,16 +418,16 @@ export function ActivityPanel(props: {
           <span fg={theme.muted}>{clip(props.now.next, room)}</span>
         </text>
       ) : null}
-      {shown.length ? (
+      {real(shown) ? (
         <scrollbox ref={props.scrollRef} stickyScroll stickyStart="bottom" style={{ flexGrow: 1 }} focused={false}>
-          {shown.map((line) => (
-            <ActivityRow key={line.id} line={line} width={Math.max(10, props.width - 8)} />
+          {shown.map((line, i) => (
+            <ActivityRow key={line.id} line={line} width={Math.max(10, props.width - 8)} first={i === 0} />
           ))}
         </scrollbox>
       ) : (
         <box style={{ flexGrow: 1, justifyContent: "center", alignItems: "center" }}>
           <text fg={theme.faint}>
-            {clip(props.lines.length ? `Nothing under ${label} yet` : "Tool calls, browser steps, and the agents' reasoning show here", Math.max(10, props.width - 4))}
+            {clip(real(props.lines) ? `Nothing under ${label} yet` : "Tool calls, browser steps, and the agents' reasoning show here", Math.max(10, props.width - 4))}
           </text>
         </box>
       )}

package/src/tui/transcript.tsx

@@ -17,7 +17,7 @@ import { clip } from "./text.ts"
 
 export type Line = {
   id: number
-  kind: "sys" | "user" | "thought" | "timing" | "memory" | "tool" | "file" | "code" | "ok" | "err" | "summary" | "suitesummary" | "reply" | "card" | "running"
+  kind: "sys" | "user" | "thought" | "timing" | "memory" | "tool" | "file" | "code" | "ok" | "err" | "summary" | "suitesummary" | "reply" | "card" | "running" | "request" | "requestEnd"
   text: string
   summary?: RunSummary
   suite?: SuiteResult
@@ -29,6 +29,24 @@ export type Line = {
   quiet?: boolean
   /** A tool call's id: its "running" line becomes the call's result line when the call finishes. */
   call?: string
+  /** A request's first line in Activity ("request"): when it started. */
+  at?: number
+  /** A request's last line in Activity ("requestEnd"): how it ended. */
+  ended?: "done" | "fail" | "stopped" | "idle"
+}
+
+/** Activity lines that mark where a request starts and ends; they are not activities themselves. */
+export const isMarker = (l: Line) => l.kind === "request" || l.kind === "requestEnd"
+
+/** The activities since the last request started, markers left out: what the request did. */
+export function sinceRequest(lines: Line[]): number {
+  let n = 0
+  for (let i = lines.length - 1; i >= 0; i--) {
+    const l = lines[i]!
+    if (l.kind === "request") break
+    if (l.pane === "activity" && !isMarker(l)) n++
+  }
+  return n
 }
 
 /** Lines kept: the oldest quiet ones go first, so a busy run never pushes the conversation out. */