@kabmo-labs/kabmo 0.0.0-stage → 0.0.1

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/card-header.ts

@@ -0,0 +1,160 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * What a tool card's header says: its title and the one line under it.
+ *
+ * This was a chain of `else if` inside the card, which made the header
+ * inseparable from the markup and pushed the file past the repo's size ceiling.
+ * It is a pure function of the tool call now, so the naming rules can be read
+ * (and tested) without mounting anything.
+ *
+ * The title comes from the tool's own name; the subtitle is the most specific
+ * identifier available — a device's action, an eval's own label, an MCP tool's
+ * subject, the target path. A subtitle is never a raw `xd://` URL: the device
+ * names the action, and the URL is transport.
+ */
+
+import type { ToolCallData } from '@/shared/types/chat';
+import { toTitleCase } from '@/shared/lib/chat/title-case';
+import { parseAskQuestions } from '@/shared/lib/chat/ask-questions';
+import { procOpLabel, procPathOf, procViewOf } from '@/shared/lib/omp/session/proc';
+import { waitViewOf } from '@/shared/lib/omp/session/wait';
+import { isXdDocRead, xdDocPath } from '@/client/components/workspace/chat-timeline/tool-renderers/registry';
+import { resolveTargetFile } from '@/client/components/workspace/chat-timeline/tool-renderers';
+import {
+  evalInputTitle,
+  mcpSubjectOf,
+  mcpToolNameOf,
+  xdevOf,
+} from '@/client/components/workspace/chat-timeline/tool-renderers/shared/card-helpers';
+
+export interface ToolCardHeader {
+  title: string;
+  subtitle?: string;
+}
+
+/** One line under the title, capped so it never eats the header row. */
+function clip(value: string, max = 80): string {
+  return value.length > max ? `${value.slice(0, max - 1)}…` : value;
+}
+
+function subtitleFromTitle(title: string): { title: string; subtitle?: string } | null {
+  const parts = title.split(/\s+[—\-:]\s+/);
+  if (parts.length < 2) return null;
+  return { title: toTitleCase(parts[0].trim()), subtitle: parts.slice(1).join(' — ').trim() };
+}
+
+export function toolCardHeader(tool: ToolCallData, toolKey: string): ToolCardHeader {
+  // ── proc:// calls: the URL names the process and the operation ────────────
+  // The transport is `read`/`write`, so without this the card said "Write" for
+  // a service stop and "Read" for a job status. The op comes from the result
+  // when omp reports one (`stop`, `stdin`, `mode`, `cancel`) and from the path
+  // otherwise.
+  if (toolKey === 'proc' || procPathOf(tool)) {
+    const view = procViewOf(tool);
+    const id = view?.daemon?.name ?? view?.job?.id ?? view?.id ?? '';
+    const op = procOpLabel(view?.op ?? '');
+    return {
+      title: 'Proc',
+      subtitle: [op, id].filter(Boolean).join(' · ') || undefined,
+    };
+  }
+
+  // ── read xd://<device>: the URL IS the identity ───────────────────────────
+  // A device CALL's target is transport and is hidden (`toolCardSubtitle`), but
+  // this is the documentation OF that device — `xd://lsp` is what was read, and
+  // the card would otherwise be a bare "Read" with nothing naming it.
+  if (isXdDocRead(tool)) {
+    return { title: 'Read', subtitle: xdDocPath(tool) };
+  }
+
+  // ── device calls: the device's own action names it ────────────────────────
+  if (toolKey === 'lsp' || toolKey === 'ast_edit') {
+    const xdev = xdevOf(tool);
+    const action = xdev?.args?.action;
+    const file = xdev?.args?.file ?? xdev?.args?.paths?.[0];
+    return {
+      title: toolKey === 'lsp' ? 'LSP' : 'AST Edit',
+      subtitle: [action, file].filter(Boolean).join(' · ') || undefined,
+    };
+  }
+  if (toolKey === 'resolve' || toolKey === 'reject') {
+    return { title: toolKey === 'resolve' ? 'Resolve Proposal' : 'Reject Proposal' };
+  }
+
+  // ── todo / ask ────────────────────────────────────────────────────────────
+  // A todo's progress is a FACT, not a title line: `toolSummary` derives it from
+  // `details.phases` — the same source the Todo panel reads — so it renders as a
+  // chip. Naming it in the subtitle too would be the second reader of one
+  // quantity, and the two disagreed: this used to parse the result's TEXT, which
+  // a `todo` call does not always carry.
+  if (toolKey === 'todo' || tool.name === 'todo' || tool.type === 'todo') {
+    return { title: 'Todo' };
+  }
+  if (toolKey === 'ask') {
+    const asked = parseAskQuestions(tool).length;
+    return { title: 'Question', subtitle: asked > 0 ? `Asked ${asked} question${asked === 1 ? '' : 's'}` : undefined };
+  }
+
+  // ── eval: `input.title` is omp's own label for the cell ──────────────────
+  const evalTitle = toolKey === 'eval' ? evalInputTitle(tool) : undefined;
+  if (evalTitle) return { title: evalTitle, subtitle: undefined };
+
+  // ── MCP: the tool names the action, never the transport ──────────────────
+  const mcpName = mcpToolNameOf(tool);
+  if (mcpName) {
+    const subject = mcpSubjectOf(tool);
+    return { title: toTitleCase(mcpName), subtitle: subject ? clip(subject) : undefined };
+  }
+
+  // ── wait: the card says WHAT it blocks on, not just "Wait" ────────────────
+  // The generic path printed the tool name and nothing else, so a card that
+  // blocked for two minutes was indistinguishable from a call that never ran.
+  // The subtitle names the job (or the message) the wait was for; the clock is
+  // a fact chip, not a title line.
+  if (toolKey === 'wait') {
+    const view = waitViewOf(tool);
+    const job = view?.jobs[0];
+    const subject = job?.label?.split('\n')[0]?.trim() || job?.id || view?.waited?.from;
+    return { title: 'Wait', subtitle: subject ? clip(subject) : undefined };
+  }
+
+  // ── generic: a "name — subject" title splits, otherwise the name stands ──
+  const fromTitle = tool.title ? subtitleFromTitle(tool.title) : null;
+  if (fromTitle) return { title: fromTitle.title, subtitle: fromTitle.subtitle };
+
+  // The `task` tool carries its subagent in `tasks[0]`, not in its title.
+  if (toolKey === 'task' && tool.input && typeof tool.input === 'object') {
+    const tasks = (tool.input as Record<string, unknown>).tasks;
+    const first = Array.isArray(tasks) ? tasks[0] : undefined;
+    if (first && typeof first === 'object') {
+      const name = (first as Record<string, unknown>).name;
+      const agent = (first as Record<string, unknown>).agent;
+      if (typeof name === 'string' && name) {
+        return { title: toTitleCase(tool.title || 'Task'), subtitle: `${name}${typeof agent === 'string' && agent ? ` · ${agent}` : ''}` };
+      }
+    }
+  }
+
+  if (tool.title) return { title: toTitleCase(tool.title) };
+  return { title: toTitleCase(toolKey || tool.name || 'Tool Call') };
+}
+
+/**
+ * The subtitle to render: the header's own, else the target file, else the raw
+ * detail. A value that is only an `xd://` URL is never shown — the device
+ * already named the action in the title, and the URL is transport. The target
+ * file is filtered the same way, because `resolveTargetFile` reads `tool.target`
+ * and a device call's target IS the URL.
+ */
+export function toolCardSubtitle(tool: ToolCallData, header: ToolCardHeader): string | undefined {
+  if (header.subtitle && (!header.subtitle.startsWith('xd://') || isXdDocRead(tool))) return header.subtitle;
+  const target = resolveTargetFile(tool);
+  if (target && !target.startsWith('xd://')) return target;
+  if (header.subtitle) return undefined;
+  if (tool.detail && !tool.detail.startsWith('xd://')) return tool.detail;
+  return undefined;
+}

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/card-helpers.tsx

@@ -0,0 +1,175 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * Presentation helpers for a tool call card: the glyph per tool family, the
+ * icon and label an `eval` names itself with, and the raw text a card falls
+ * back to when it has no specialized panel.
+ *
+ * Pure and DOM-free — the card used to carry all of this inline, which pushed
+ * it past the repo's 350-line ceiling and made the header logic inseparable
+ * from the markup.
+ */
+
+import type { ReactNode } from 'preact/compat';
+import {
+  Bell,
+  Boxes,
+  Brain,
+  BrainCircuit,
+  Camera,
+  Check,
+  Code2,
+  Cpu,
+  FileCode,
+  FileText,
+  GitPullRequest,
+  Globe,
+  HelpCircle,
+  Hourglass,
+  ListTodo,
+  Search,
+  Server,
+  Shield,
+  Terminal,
+  Wrench,
+} from 'lucide-preact';
+import type { ToolCallData } from '@/shared/types/chat';
+import { languageBrandIcon } from '@/client/components/common/file-icon';
+import { tryParseJson } from '@/shared/lib/code/syntax-highlight';
+
+/** Glyph for a tool family. Every alias of one tool shares its glyph, so the
+ *  table is keyed by the canonical name where one exists. */
+const ICON_BY_KEY: Record<string, ReactNode> = {
+  bash: <Terminal size={14} />,
+  terminal: <Terminal size={14} />,
+  edit: <FileCode size={14} />,
+  write: <FileCode size={14} />,
+  edit_file: <FileCode size={14} />,
+  create_file: <FileCode size={14} />,
+  ast_edit: <FileCode size={14} />,
+  read: <FileText size={14} />,
+  read_file: <FileText size={14} />,
+  view_file: <FileText size={14} />,
+  glob: <Search size={14} />,
+  grep: <Search size={14} />,
+  search_fs: <Search size={14} />,
+  ast_grep: <Search size={14} />,
+  web_search: <Globe size={14} />,
+  todo: <ListTodo size={14} />,
+  task: <ListTodo size={14} />,
+  eval: <Code2 size={14} />,
+  lsp: <Cpu size={14} />,
+  resolve: <Check size={14} />,
+  reject: <Check size={14} />,
+  hub: <Server size={14} />,
+  proc: <Server size={14} />,
+  ask: <HelpCircle size={14} />,
+  wait: <Hourglass size={14} />,
+  think: <BrainCircuit size={14} />,
+  security_scan: <Shield size={14} />,
+  checkpoint: <Camera size={14} />,
+  rewind: <Camera size={14} />,
+  github: <GitPullRequest size={14} />,
+  memory_edit: <Brain size={14} />,
+  retain: <Brain size={14} />,
+  recall: <Brain size={14} />,
+  reflect: <Brain size={14} />,
+  learn: <Brain size={14} />,
+};
+
+export function toolIcon(key: string): ReactNode {
+  if (key.startsWith('mcp__')) return <Boxes size={14} />;
+  return ICON_BY_KEY[key] ?? <Wrench size={14} />;
+}
+
+/** The reminder badge's glyph, so the card does not import an icon for one use. */
+export const REMINDER_ICON = <Bell size={10} />;
+
+function inputRecord(tool: ToolCallData): Record<string, unknown> | undefined {
+  return tool.input && typeof tool.input === 'object' && tool.input !== null
+    ? (tool.input as Record<string, unknown>)
+    : undefined;
+}
+
+/** `input.title` of an `eval` call — omp's own label for the cell. The card
+ *  header names the eval with it rather than the generic tool name. */
+export function evalInputTitle(tool: ToolCallData): string | undefined {
+  const title = inputRecord(tool)?.title;
+  return typeof title === 'string' && title.trim() ? title.trim() : undefined;
+}
+
+/** Brand mark for an `eval` call's `language` (`js`, `py`, …); null when the
+ *  language is unknown or absent, so the generic code glyph stands in. */
+export function evalLanguageIcon(tool: ToolCallData): ReactNode {
+  const language = inputRecord(tool)?.language;
+  return typeof language === 'string' && language ? languageBrandIcon(language, 14) : null;
+}
+
+/** Raw text a card shows when it has no specialized panel: the command, the
+ *  arguments, or the path it named. */
+export function commandOrInputOf(tool: ToolCallData): string {
+  if (tool.command) return tool.command;
+  if (typeof tool.input === 'string') return tool.input;
+  if (tool.input && typeof tool.input === 'object') return JSON.stringify(tool.input, null, 2);
+  if (tool.target || tool.detail) return tool.target || tool.detail || '';
+  return '';
+}
+
+/** Inner `xd://mcp__<tool>` (or `mcp__<tool>` name) carried by an MCP call.
+ *  Returns the bare MCP tool name, e.g. `codegraph_explore`. */
+export function mcpToolNameOf(tool: ToolCallData): string | undefined {
+  const path = typeof inputRecord(tool)?.path === 'string' ? (inputRecord(tool)!.path as string) : tool.target || '';
+  const raw = path.startsWith('xd://')
+    ? path.slice(5)
+    : typeof tool.name === 'string' && tool.name.startsWith('mcp__')
+      ? tool.name
+      : '';
+  const name = raw.split(/[/?#]/)[0].trim();
+  return name.startsWith('mcp__') ? name.slice(5) : undefined;
+}
+
+/** Human subject for an MCP call: the intent line wins, else first meaningful
+ *  argument (query/pattern/path/…), else nothing. The arguments may arrive as a
+ *  JSON string in `content` (the `write xd://mcp__…` transport), which is
+ *  parsed so its keys are searchable the same way. */
+export function mcpSubjectOf(tool: ToolCallData): string | undefined {
+  if (tool.intent) return tool.intent;
+  const input = inputRecord(tool);
+  if (!input) return undefined;
+  const content = typeof input.content === 'string' ? input.content : '';
+  const parsed = content ? tryParseJson(content) : null;
+  const data = parsed?.isValid && parsed.data && typeof parsed.data === 'object'
+    ? (parsed.data as Record<string, unknown>)
+    : input;
+  const keys = ['query', 'q', 'pattern', 'pat', 'name', 'sql', 'path', 'symbol', 'url', 'command'];
+  for (const key of keys) {
+    const value = data[key];
+    if (typeof value === 'string' && value) return value;
+  }
+  return undefined;
+}
+
+/** The diff text a result carries, from `details.diff`/`details.patch` or the
+ *  MOCK path's `diff.diffText`. */
+export function diffTextOf(tool: ToolCallData): string | undefined {
+  if (tool.diff?.diffText) return tool.diff.diffText;
+  const details = tool.details;
+  if (details && typeof details === 'object') {
+    if (typeof details.patch === 'string') return details.patch;
+    if (typeof details.diff === 'string') return details.diff;
+  }
+  return undefined;
+}
+
+export interface XdevDetails {
+  args?: { action?: string; file?: string; paths?: string[] };
+}
+
+/** `details.xdev` of an oh-my-pi virtual device call, if present. */
+export function xdevOf(tool: ToolCallData): XdevDetails | undefined {
+  const xdev = tool.details?.xdev;
+  return xdev && typeof xdev === 'object' ? (xdev as XdevDetails) : undefined;
+}

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/read-line-meta.test.ts

@@ -0,0 +1,102 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * `extractLineMeta` decides which number the gutter starts at for a `read`
+ * result, and its heuristics are tried in a fixed order. The ordering is the
+ * contract: an explicit `displayContent.lineNumbers` gutter must survive even
+ * when a coarser `startLine` is also present, and the derived fallbacks
+ * (truncation window, input offset, a `:55-100` range in the path, an elision
+ * notice inside the text) must only fire when nothing more specific does.
+ *
+ * Pure function, no mounting. Each case pins one rung of that ladder.
+ */
+
+import { describe, expect, test } from 'bun:test';
+import { extractLineMeta } from '@/client/components/workspace/chat-timeline/tool-renderers/shared/read-line-meta';
+import type { ToolCallData } from '@/shared/types/chat';
+
+const tool = (overrides: Partial<ToolCallData> = {}): ToolCallData =>
+  ({ id: 'c1', type: 'read', title: 'read', ...overrides }) as ToolCallData;
+
+describe('extractLineMeta', () => {
+  test('returns nothing for a call with no line hints at all', () => {
+    expect(extractLineMeta(tool())).toEqual({});
+  });
+
+  test('prefers the displayContent gutter over a coarser details gutter', () => {
+    const meta = extractLineMeta(
+      tool({
+        details: {
+          displayContent: { lineNumbers: [10, 11], startLine: 10 },
+          lineNumbers: [1, 2],
+          startLine: 1,
+        },
+      }),
+    );
+    expect(meta).toEqual({ startLine: 10, lineNumbers: [10, 11] });
+  });
+
+  test('keeps an explicit gutter even when no startLine accompanies it', () => {
+    const meta = extractLineMeta(tool({ details: { displayContent: { lineNumbers: [1, 2] } } }));
+    expect(meta).toEqual({ startLine: undefined, lineNumbers: [1, 2] });
+  });
+
+  test('falls back to the details gutter when displayContent has none', () => {
+    const meta = extractLineMeta(tool({ details: { lineNumbers: [5, 6], startLine: 5 } }));
+    expect(meta).toEqual({ startLine: 5, lineNumbers: [5, 6] });
+  });
+
+  test('takes displayContent.startLine before any details startLine', () => {
+    expect(extractLineMeta(tool({ details: { displayContent: { startLine: 42 }, startLine: 7 } }))).toEqual({ startLine: 42 });
+  });
+
+  test('walks details.startLine -> start_line -> offset in order', () => {
+    expect(extractLineMeta(tool({ details: { startLine: 7, start_line: 8, offset: 9 } }))).toEqual({ startLine: 7 });
+    expect(extractLineMeta(tool({ details: { start_line: 8, offset: 9 } }))).toEqual({ startLine: 8 });
+    expect(extractLineMeta(tool({ details: { offset: 9 } }))).toEqual({ startLine: 9 });
+  });
+
+  test('ignores a zero/negative startLine so it can fall through', () => {
+    expect(extractLineMeta(tool({ details: { startLine: 0, offset: 9 } }))).toEqual({ startLine: 9 });
+  });
+
+  test('reads the truncation window start when no explicit line is set', () => {
+    expect(
+      extractLineMeta(tool({ details: { meta: { truncation: { shownRange: { start: 54 } } } } })),
+    ).toEqual({ startLine: 54 });
+    expect(extractLineMeta(tool({ details: { shownRange: { start: 55 } } }))).toEqual({ startLine: 55 });
+  });
+
+  test('reads the start line off the input, including a numeric string', () => {
+    expect(extractLineMeta(tool({ input: { start_line: 3 } }))).toEqual({ startLine: 3 });
+    expect(extractLineMeta(tool({ input: { startLine: '12' } }))).toEqual({ startLine: 12 });
+    expect(extractLineMeta(tool({ input: { from: 1 } }))).toEqual({ startLine: 1 });
+  });
+
+  test('a specific details line beats an input offset', () => {
+    expect(extractLineMeta(tool({ details: { startLine: 7 }, input: { start_line: 3 } }))).toEqual({ startLine: 7 });
+  });
+
+  test('derives the line from a range in the path or title', () => {
+    expect(extractLineMeta(tool({ input: { path: 'app/types/chat.ts:55-100' } }))).toEqual({ startLine: 55 });
+    expect(extractLineMeta(tool({ title: 'read src/a.ts:12' }))).toEqual({ startLine: 12 });
+    expect(extractLineMeta(tool(), 'src/b.ts:99-100')).toEqual({ startLine: 99 });
+  });
+
+  test('an input start_line beats a range in the same input path', () => {
+    expect(extractLineMeta(tool({ input: { start_line: 3, path: 'a.ts:99-100' } }))).toEqual({ startLine: 3 });
+  });
+
+  test('reads an elision notice out of the raw content as the last resort', () => {
+    expect(extractLineMeta(tool(), undefined, '[Showing lines 54-103 of 208...]')).toEqual({ startLine: 54 });
+  });
+
+  test('a path range beats the content notice', () => {
+    expect(
+      extractLineMeta(tool({ input: { path: 'a.ts:7' } }), undefined, '[Showing lines 54-103 of 208...]'),
+    ).toEqual({ startLine: 7 });
+  });
+});

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/read-line-meta.ts

@@ -0,0 +1,95 @@
+import type { ToolCallData } from '@/shared/types/chat';
+
+export interface LineMeta {
+  startLine?: number;
+  lineNumbers?: (number | string | null | undefined)[];
+}
+
+/**
+ * Resolve the starting line number (and any explicit line-number gutter) that a
+ * `read` tool result should render against. Pure derivation from the tool call
+ * payload — the ordering of the heuristics below is load-bearing.
+ */
+export function extractLineMeta(
+  tool?: ToolCallData,
+  targetFilePath?: string,
+  rawContent?: string
+): LineMeta {
+  const details = (tool?.details ?? {}) as Record<string, any>;
+  const input = (tool?.input && typeof tool.input === 'object' ? tool.input : {}) as Record<string, any>;
+
+  // 1. Explicit lineNumbers array in details or displayContent
+  const displayContent = details.displayContent;
+  if (displayContent && Array.isArray(displayContent.lineNumbers) && displayContent.lineNumbers.length > 0) {
+    return {
+      startLine: typeof displayContent.startLine === 'number' ? displayContent.startLine : undefined,
+      lineNumbers: displayContent.lineNumbers,
+    };
+  }
+  if (Array.isArray(details.lineNumbers) && details.lineNumbers.length > 0) {
+    return {
+      startLine: typeof details.startLine === 'number' ? details.startLine : undefined,
+      lineNumbers: details.lineNumbers,
+    };
+  }
+
+  // 2. Explicit startLine in displayContent or details
+  if (typeof displayContent?.startLine === 'number' && displayContent.startLine > 0) {
+    return { startLine: displayContent.startLine };
+  }
+  if (typeof details.startLine === 'number' && details.startLine > 0) {
+    return { startLine: details.startLine };
+  }
+  if (typeof details.start_line === 'number' && details.start_line > 0) {
+    return { startLine: details.start_line };
+  }
+  if (typeof details.offset === 'number' && details.offset > 0) {
+    return { startLine: details.offset };
+  }
+
+  // 3. Truncation shownRange start
+  const shownRangeStart =
+    details.meta?.truncation?.shownRange?.start ??
+    details.truncation?.shownRange?.start ??
+    details.meta?.shownRange?.start ??
+    details.shownRange?.start;
+  if (typeof shownRangeStart === 'number' && shownRangeStart > 0) {
+    return { startLine: shownRangeStart };
+  }
+
+  // 4. Input startLine / offset / from
+  const inputStart = input.start_line ?? input.startLine ?? input.offset ?? input.StartLine ?? input.from;
+  if (typeof inputStart === 'number' && inputStart > 0) {
+    return { startLine: inputStart };
+  }
+  if (typeof inputStart === 'string' && /^\d+$/.test(inputStart.trim())) {
+    const parsed = parseInt(inputStart.trim(), 10);
+    if (parsed > 0) return { startLine: parsed };
+  }
+
+  // 5. Line range in target / input path / title: e.g. "app/types/chat.ts:55-100"
+  const pathCandidates = [
+    typeof input.path === 'string' ? input.path : '',
+    tool?.target || '',
+    tool?.title || '',
+    targetFilePath || '',
+  ];
+  for (const candidate of pathCandidates) {
+    const match = candidate.match(/:(\d+)(?:-\d+)?(?:\s|$)/);
+    if (match) {
+      const parsed = parseInt(match[1], 10);
+      if (parsed > 0) return { startLine: parsed };
+    }
+  }
+
+  // 6. Elision notice inside content: e.g. "[Showing lines 54-103 of 208...]"
+  if (rawContent) {
+    const match = rawContent.match(/\[(?:Showing\s+)?lines?\s+(\d+)(?:-\d+)?/i);
+    if (match) {
+      const parsed = parseInt(match[1], 10);
+      if (parsed > 0) return { startLine: parsed };
+    }
+  }
+
+  return {};
+}

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/tool-input.test.ts

@@ -0,0 +1,55 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * `getToolInputPath` / `getToolInputAction` are the only readers of a tool
+ * call's raw arguments, which omp sends as an object but the MOCK path sends as
+ * a JSON string. Both helpers must answer `undefined` for anything that is not
+ * a string field — a JSON-string payload must not be parsed, and a numeric
+ * `path` must not be coerced — because the panels fall back to `tool.target` /
+ * `tool.title` on `undefined`, and a wrong truthy value silently paints the
+ * wrong file or action.
+ *
+ * Pure functions, no mounting.
+ */
+
+import { describe, expect, test } from 'bun:test';
+import {
+  getToolInputAction,
+  getToolInputPath,
+} from '@/client/components/workspace/chat-timeline/tool-renderers/shared/tool-input';
+
+describe('getToolInputPath', () => {
+  test('reads the path off an object input', () => {
+    expect(getToolInputPath({ path: 'src/a.ts' })).toBe('src/a.ts');
+  });
+
+  test('returns undefined for the MOCK path, which sends a JSON string', () => {
+    expect(getToolInputPath('{"path":"src/a.ts"}')).toBeUndefined();
+  });
+
+  test('returns undefined when path is absent or not a string', () => {
+    expect(getToolInputPath({})).toBeUndefined();
+    expect(getToolInputPath({ path: 42 })).toBeUndefined();
+    expect(getToolInputPath(undefined)).toBeUndefined();
+    expect(getToolInputPath(null as never)).toBeUndefined();
+  });
+});
+
+describe('getToolInputAction', () => {
+  test('reads the action off an object input', () => {
+    expect(getToolInputAction({ action: 'init' })).toBe('init');
+  });
+
+  test('returns undefined for a JSON-string input', () => {
+    expect(getToolInputAction('{"action":"init"}')).toBeUndefined();
+  });
+
+  test('returns undefined when action is absent or not a string', () => {
+    expect(getToolInputAction({})).toBeUndefined();
+    expect(getToolInputAction({ action: 1 })).toBeUndefined();
+    expect(getToolInputAction(undefined)).toBeUndefined();
+  });
+});

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/tool-input.ts

@@ -0,0 +1,18 @@
+import type { ToolCallData } from '@/shared/types/chat';
+
+/**
+ * Extract a `path` string from a tool call's raw arguments, which omp sends as
+ * an object but the MOCK path may send as a JSON string. Returns undefined when
+ * the argument is absent or not a string.
+ */
+export function getToolInputPath(input: ToolCallData['input']): string | undefined {
+  if (input && typeof input === 'object' && typeof input.path === 'string') return input.path;
+  return undefined;
+}
+
+/** Extract a string `action` from a tool call's raw arguments (omp sends an
+ *  object; the MOCK path may send a JSON string). Returns undefined otherwise. */
+export function getToolInputAction(input: ToolCallData['input']): string | undefined {
+  if (input && typeof input === 'object' && typeof input.action === 'string') return input.action;
+  return undefined;
+}

package/src/client/components/workspace/chat-timeline/tool-renderers/shared/truncate.test.ts

@@ -0,0 +1,53 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * `truncateTailLines` is the display-only guard that keeps a single tool result
+ * from pouring thousands of rows into the DOM. The contract these pin is the
+ * pair a caller reads back: `text` is exactly the tail that survives, and
+ * `skipped` is the number of leading lines that did not — because callers print
+ * "… N earlier lines hidden" from it and slice a parallel gutter by the same
+ * count. Getting `skipped` wrong misaligns every row number that follows.
+ *
+ * Pure function, no mounting: called directly, including the default ceiling.
+ */
+
+import { describe, expect, test } from 'bun:test';
+import {
+  MAX_OUTPUT_LINES,
+  truncateTailLines,
+} from '@/client/components/workspace/chat-timeline/tool-renderers/shared/truncate';
+
+describe('truncateTailLines', () => {
+  test('reports nothing hidden for an empty payload', () => {
+    expect(truncateTailLines('')).toEqual({ text: '', skipped: 0 });
+  });
+
+  test('returns a payload shorter than the ceiling untouched', () => {
+    const text = ['a', 'b', 'c'].join('\n');
+    expect(truncateTailLines(text, 5)).toEqual({ text, skipped: 0 });
+  });
+
+  test('keeps the tail and counts the leading lines it dropped', () => {
+    const text = ['1', '2', '3', '4', '5'].join('\n');
+    expect(truncateTailLines(text, 2)).toEqual({ text: '4\n5', skipped: 3 });
+  });
+
+  test('treats a payload exactly at the ceiling as nothing to hide', () => {
+    const text = ['1', '2', '3'].join('\n');
+    expect(truncateTailLines(text, 3)).toEqual({ text, skipped: 0 });
+  });
+
+  test('splits CRLF output the same way, so Windows logs align too', () => {
+    expect(truncateTailLines('a\r\nb\r\nc\r\nd', 2)).toEqual({ text: 'c\nd', skipped: 2 });
+  });
+
+  test('defaults to MAX_OUTPUT_LINES when no ceiling is given', () => {
+    const text = Array.from({ length: MAX_OUTPUT_LINES + 1 }, (_, i) => `line ${i}`).join('\n');
+    const result = truncateTailLines(text);
+    expect(result.skipped).toBe(1);
+    expect(result.text.startsWith('line 1\n')).toBe(true);
+  });
+});