transcript-viewer 0.13.0__tar.gz → 0.14.0__tar.gz

transcript_viewer-0.13.0/README.md → transcript_viewer-0.14.0/PKG-INFO

@@ -1,3 +1,16 @@
+Metadata-Version: 2.5
+Name: transcript-viewer
+Version: 0.14.0
+Summary: Browse agent transcripts in a local, dependency-free web viewer.
+License: MIT
+Requires-Python: >=3.12
+Requires-Dist: atif-make>=0.7.1
+Provides-Extra: ai
+Requires-Dist: anthropic>=0.40; extra == 'ai'
+Provides-Extra: parquet
+Requires-Dist: atif-make[parquet]>=0.5.0; extra == 'parquet'
+Description-Content-Type: text/markdown
+
 # transcript-viewer
 
 Browse agent transcripts in a local web viewer — what Claude Code, Codex and
@@ -166,11 +179,21 @@ If that directory is still there, the first run moves it to
 `~/.transcript-viewer` — index, annotations and stored keys together — and says
 so. Nothing is left behind and nothing is copied twice.
 
-A run that delegated shows a **timeline** above its steps: one lane per
-subagent, laid out on the clock. A lane is called what the agent was asked to
+A run that delegated shows what it farmed out, above its steps, as a **list**
+or a **timeline**. The list leads because the common question is what was asked
+and what came back, and the median subagent here is two steps — a bar for which
+says almost nothing. It carries the task, the kind, the steps, how long it took
+and the tools it reached for, sorted however you ask.
+
+The timeline is for when the question is *when*, and alongside what. A row is
+shared by everything that did not overlap, so a second row exists only because
+two things ran at once: thirty subagents in one session pack into eight rows,
+and a session of fifteen packs into one, which is the honest picture of a run
+that never did two things at a time. Either way a subagent is called what it was asked to
 do — "Review backend for bugs and DRY" rather than "general-purpose" — wherever
 that was written down, which is 50 of the 53 Claude Code subagents here; the
-kind is the fallback and the tooltip. It exists for the one thing a nested box
+kind is the fallback, and reads as a handle rather than as prose so the
+difference is visible. It exists for the one thing a nested box
 cannot say — that two subagents were running at the same moment, which 25 pairs
 in the corpus this was built against were. Two bars in the same column of the
 chart is what says it; overlap gets no colour of its own, since a second

transcript_viewer-0.13.0/PKG-INFO → transcript_viewer-0.14.0/README.md

@@ -1,16 +1,3 @@
-Metadata-Version: 2.5
-Name: transcript-viewer
-Version: 0.13.0
-Summary: Browse agent transcripts in a local, dependency-free web viewer.
-License: MIT
-Requires-Python: >=3.12
-Requires-Dist: atif-make>=0.7.1
-Provides-Extra: ai
-Requires-Dist: anthropic>=0.40; extra == 'ai'
-Provides-Extra: parquet
-Requires-Dist: atif-make[parquet]>=0.5.0; extra == 'parquet'
-Description-Content-Type: text/markdown
-
 # transcript-viewer
 
 Browse agent transcripts in a local web viewer — what Claude Code, Codex and
@@ -179,11 +166,21 @@ If that directory is still there, the first run moves it to
 `~/.transcript-viewer` — index, annotations and stored keys together — and says
 so. Nothing is left behind and nothing is copied twice.
 
-A run that delegated shows a **timeline** above its steps: one lane per
-subagent, laid out on the clock. A lane is called what the agent was asked to
+A run that delegated shows what it farmed out, above its steps, as a **list**
+or a **timeline**. The list leads because the common question is what was asked
+and what came back, and the median subagent here is two steps — a bar for which
+says almost nothing. It carries the task, the kind, the steps, how long it took
+and the tools it reached for, sorted however you ask.
+
+The timeline is for when the question is *when*, and alongside what. A row is
+shared by everything that did not overlap, so a second row exists only because
+two things ran at once: thirty subagents in one session pack into eight rows,
+and a session of fifteen packs into one, which is the honest picture of a run
+that never did two things at a time. Either way a subagent is called what it was asked to
 do — "Review backend for bugs and DRY" rather than "general-purpose" — wherever
 that was written down, which is 50 of the 53 Claude Code subagents here; the
-kind is the fallback and the tooltip. It exists for the one thing a nested box
+kind is the fallback, and reads as a handle rather than as prose so the
+difference is visible. It exists for the one thing a nested box
 cannot say — that two subagents were running at the same moment, which 25 pairs
 in the corpus this was built against were. Two bars in the same column of the
 chart is what says it; overlap gets no colour of its own, since a second

{transcript_viewer-0.13.0 → transcript_viewer-0.14.0}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "transcript-viewer"
-version = "0.13.0"
+version = "0.14.0"
 description = "Browse agent transcripts in a local, dependency-free web viewer."
 readme = "README.md"
 requires-python = ">=3.12"

{transcript_viewer-0.13.0 → transcript_viewer-0.14.0}/src/transcript_viewer/page.html

@@ -431,6 +431,41 @@ pre{background:var(--sunk);border-radius:7px;padding:10px;overflow:auto;font-siz
 /* Conversations that belong to the record rather than to any step. */
 .loose{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
 .loose-head{font:11px var(--font-mono);color:var(--muted);margin-bottom:8px}
+/* The list. Diwan's library row, at the density of a table: one grid template
+   shared by the head and every row, so the columns line up. */
+.lanelist{margin:2px 0 0}
+.lrow{display:grid;grid-template-columns:1fr 118px 52px 58px 150px;gap:0 12px;
+  align-items:baseline;padding:7px 8px;border-radius:5px;cursor:pointer}
+.lrow:hover{background:var(--soft)}
+.lrow.head{cursor:default;padding-bottom:5px;margin-bottom:2px;
+  border-bottom:1px solid var(--line)}
+.lrow.head:hover{background:transparent}
+.lh{font:10px var(--font-mono);color:var(--faint);letter-spacing:.04em;
+  text-transform:uppercase;cursor:pointer;white-space:nowrap}
+.lh.on{color:var(--accent)}
+.lh.num{text-align:right}
+.lname{font-size:13px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;
+  white-space:nowrap}
+/* Nothing was written down for this one; the kind is standing in for a name. */
+.lname.untitled{font-family:var(--font-mono);font-size:12px;color:var(--muted)}
+.lkind{font:11px var(--font-mono);color:var(--accent);overflow:hidden;
+  text-overflow:ellipsis;white-space:nowrap}
+.lrow .num{font:11.5px var(--font-mono);color:var(--muted);text-align:right}
+.ltools{font:10.5px var(--font-mono);color:var(--faint);overflow:hidden;
+  text-overflow:ellipsis;white-space:nowrap}
+
+/* A packed row holds whatever did not overlap, so it has a number rather than
+   a name — the names are in the list, where there is room for them. */
+.lane.packed{grid-template-columns:58px 1fr;gap:0 12px;align-items:center}
+.lane-axis.packed{grid-template-columns:58px 1fr;gap:0 12px}
+.bandlayer.packed{left:70px}
+.rownum{font:10px var(--font-mono);color:var(--faint);width:100%;text-align:right}
+.lane.packed .track{height:22px}
+.lane.packed .bar{height:14px}
+
+/* Which of the two views, in the box's own header. */
+.laneview{margin-left:auto;display:flex;gap:6px;flex:none}
+.laneview .chip{font-size:11px;padding:2px 9px}
 .lanes-legend{display:flex;align-items:center;gap:14px;margin-top:10px;padding-top:9px;
   border-top:1px solid var(--line);font-size:11px;color:var(--muted);flex-wrap:wrap}
 .lanes-legend i{display:inline-block;width:16px;height:8px;border-radius:2px;
@@ -2538,6 +2573,31 @@ function laneIndex(t) {
   return lanes;
 }
 
+/* Share a row with anything that does not overlap.
+
+   Thirty subagents drew thirty rows, and twenty-nine of them said only that
+   the run was long. Packed, the same session is eight rows — and the count now
+   means something: a second row exists only because two things ran at once, so
+   the shape of the chart is the parallelism rather than a decoration on top of
+   it. One real session of fifteen subagents packs to a single row, which is the
+   honest picture of a run that never did two things at a time.
+
+   The lowest free row, which is the usual way to pack intervals. */
+function packLanes(lanes) {
+  const timed = lanes.filter((l) => l.span).sort((a, b) => a.span[0] - b.span[0]);
+  const rows = [];
+  for (const lane of timed) {
+    let row = rows.findIndex((busyUntil) => lane.span[0] >= busyUntil);
+    if (row === -1) row = rows.push(0) - 1;
+    rows[row] = lane.span[1];
+    lane.row = row;
+  }
+  // Anything without times cannot be placed against the others; give it its own.
+  let extra = rows.length;
+  for (const lane of lanes) if (!lane.span) lane.row = extra++;
+  return Math.max(1, extra);
+}
+
 /* Stretches of time where more than one subagent was running. */
 function together(lanes) {
   const edges = [];
@@ -2626,6 +2686,23 @@ function axisMarks(lo, hi) {
 
 let LANES = [];
 
+/* Which of the two views the box is showing. A list by default: the common
+   question is what was farmed out and what came back, and the median subagent
+   here is two steps — a bar for which says almost nothing. The timeline is for
+   when the question is when, and alongside what. */
+let LANEVIEW = (() => {
+  try { return localStorage.getItem("transcript-viewer.delegation") || "list"; }
+  catch (e) { return "list"; }
+})();
+
+function setLaneView(v) {
+  LANEVIEW = v;
+  try { localStorage.setItem("transcript-viewer.delegation", v); } catch (e) {}
+  const at = main.scrollTop;
+  render();
+  main.scrollTop = at;
+}
+
 function drawLanes(t) {
   LANES = laneIndex(t);
   if (!LANES.length) return "";
@@ -2633,95 +2710,183 @@ function drawLanes(t) {
   const timed = LANES.filter((l) => l.span);
   const parent = spanMs(t.steps);
   const onClock = timed.length > 0 && parent;
+  const bands = onClock ? together(timed) : [];
+
+  let shown = "", whole = "", note = "", body = "";
+
+  if (LANEVIEW === "list") {
+    body = laneList(t);
+    note = onClock ? "" : "these steps carry no times";
+    if (onClock) {
+      const lo = Math.min(parent[0], ...timed.map((l) => l.span[0]));
+      const hi = Math.max(parent[1], ...timed.map((l) => l.span[1]));
+      // A list has no axis, so nothing was shortened: the span is the span.
+      shown = duration(hi - lo);
+    }
+  } else if (!onClock) {
+    // No times to lay anything out against; place each where it was called from.
+    const steps = Math.max(1, (t.steps || []).length);
+    body = laneTracks(
+      LANES.map((lane) => ({
+        lane,
+        html: `<button class="bar" style="left:${(lane.fromIndex / steps) * 100}%;
+          width:${Math.max(100 / steps, 0.6)}%" title="${esc(lane.name || lane.kind)}"
+          onmouseenter="laneCard(event,'${esc(lane.id)}')" onmouseleave="laneCard(null)"
+          onclick="openLane('${esc(lane.id)}')"></button>`,
+      })),
+      LANES.length,
+      `<span class="bar main" style="left:0;width:100%"></span>`,
+      "",
+      "",
+    );
+    note = "laid out by step · these steps carry no times";
+  } else {
+    const lo = Math.min(parent[0], ...timed.map((l) => l.span[0]));
+    const hi = Math.max(parent[1], ...timed.map((l) => l.span[1]));
+
+    const busy = timed.map((l) => l.span);
+    for (const v of (t.steps || []).map(at).filter((x) => x !== null)) busy.push([v, v]);
+    const scale = timeScale(lo, hi, busy);
+    const rowCount = packLanes(LANES);
+
+    const place = (span) => {
+      const left = scale.posOf(span[0]);
+      return { left, width: Math.max(scale.posOf(span[1]) - left, 0.4) };
+    };
 
-  const tight = LANES.length > 12 ? " tight" : "";
-  const steps = (t.steps || []).length;
-
-  if (!onClock) {
-    // No times to lay anything out against. Say so and place each lane where it
-    // was called from, rather than implying durations the log never recorded.
-    const rows = LANES.map((lane) => laneRow(lane, tight,
-      `<button class="bar" style="left:${(lane.fromIndex / Math.max(1, steps)) * 100}%;
-         width:${Math.max(100 / Math.max(1, steps), 0.6)}%" title="${esc(lane.kind)}"
-         onmouseenter="laneCard(event,'${esc(lane.id)}')" onmouseleave="laneCard(null)"
-         onclick="openLane('${esc(lane.id)}')"></button>`)).join("");
-    return laneShell({
-      count: LANES.length,
-      rows,
-      mainRow: laneRow({ kind: "main thread", steps, main: true }, tight,
-        `<span class="bar main" style="left:0;width:100%"></span>`),
-      marks: "",
-      // No clock to lay anything against, so no duration is claimed and no
-      // overlap either: without times, two bars sitting side by side would
-      // say something the log never recorded.
-      note: "laid out by step · these steps carry no times",
+    const bars = LANES.map((lane) => {
+      const at2 = lane.span ? place(lane.span) : { left: 0, width: 0.4 };
+      return {
+        lane,
+        html: `<button class="bar" style="left:${at2.left}%;width:${at2.width}%"
+          title="${esc(lane.name || lane.kind)}${
+            lane.span ? " · " + esc(duration(lane.span[1] - lane.span[0])) : ""
+          }" onmouseenter="laneCard(event,'${esc(lane.id)}')"
+          onmouseleave="laneCard(null)" onclick="openLane('${esc(lane.id)}')"></button>`,
+      };
     });
+
+    const mainAt = place(parent);
+    const marks = axisMarks(0, scale.kept)
+      .map((m) => `<span style="left:${(m.pos / 100) * scale.room}%">${esc(m.label)}</span>`)
+      .join("");
+    const worth = scale.gaps.slice().sort((a, b) => b.ms - a.ms).slice(0, 8);
+    const breaks = worth
+      .map((g) => `<span class="gapmark" style="left:${g.at}%"
+        title="nothing running for ${esc(g.took)}"></span>`)
+      .join("");
+
+    body = laneTracks(
+      bars,
+      rowCount,
+      `<span class="bar main" style="left:${mainAt.left}%;width:${mainAt.width}%"></span>`,
+      marks,
+      breaks,
+    );
+
+    const [a, b] = durationPair(scale.kept, hi - lo);
+    shown = a;
+    whole = b;
+    note = scale.gaps.length ? `${duration(scale.skipped)} of waiting hidden` : "";
   }
 
-  // Everything the run touched, parent and children alike.
-  const lo = Math.min(parent[0], ...timed.map((l) => l.span[0]));
-  const hi = Math.max(parent[1], ...timed.map((l) => l.span[1]));
-
-  // What was actually happening, so the quiet stretches can be skipped.
-  const busy = timed.map((l) => l.span);
-  const points = (t.steps || []).map(at).filter((v) => v !== null).sort((a, b) => a - b);
-  for (const v of points) busy.push([v, v]);
-
-  const scale = timeScale(lo, hi, busy);
-  const bands = together(timed);
-
-  // Every quiet stretch is skipped; only the large ones are marked. Drawing a
-  // line for all 152 of one session's turned the chart into vertical stripes,
-  // and a mark every few pixels tells a reader nothing they can act on.
-  const worth = scale.gaps
-    .slice()
-    .sort((a, b) => b.ms - a.ms)
-    .slice(0, 8);
-  const breaks = worth.map((g) =>
-    `<span class="gapmark" style="left:${g.at}%" title="nothing running for ${esc(g.took)}"></span>`
-  ).join("");
+  const parts = laneHeader({ count: LANES.length, shown, whole, overlaps: bands.length });
+  const hint = LANEVIEW === "list" ? "click a row to open it" : "click a bar to open it";
 
-  const bar = (span, cls) => {
-    const left = scale.posOf(span[0]);
-    return { left, width: Math.max(scale.posOf(span[1]) - left, 0.4) };
-  };
+  return `
+    <details id="lanes" open>
+      <summary>
+        <b>Delegation</b>
+        <span class="fine">${parts.join(" · ")}</span>
+        <span class="laneview" onclick="event.preventDefault()">
+          ${[["list", "List"], ["time", "Timeline"]].map(([k, label]) =>
+            `<span class="chip${LANEVIEW === k ? " on" : ""}"
+              onclick="event.preventDefault();event.stopPropagation();setLaneView('${k}')"
+              >${label}</span>`).join("")}
+        </span>
+      </summary>
+      <div class="lanes-body">
+        ${body}
+        <div class="lanes-legend">
+          ${LANEVIEW === "time"
+            ? `<span><i style="background:var(--ink);opacity:.85"></i>main thread</span>
+               <span><i style="background:var(--accent);opacity:.85"></i>subagent</span>`
+            : ""}
+          <span class="lanes-note">${[note, hint].filter(Boolean).join(" · ")}</span>
+        </div>
+      </div>
+    </details>`;
+}
 
-  const mainAt = bar(parent, "main");
-  const mainRow = laneRow({ kind: "main thread", steps, main: true }, tight,
-    `<span class="bar main" style="left:${mainAt.left}%;width:${mainAt.width}%"></span>`);
-
-  const rows = LANES.map((lane) => {
-    const at = bar(lane.span);
-    return laneRow(lane, tight,
-      `<button class="bar" style="left:${at.left}%;width:${at.width}%"
-        title="${esc(lane.kind + (lane.said ? " — " + lane.said : ""))} · ${esc(duration(lane.span[1] - lane.span[0]))}"
-        onmouseenter="laneCard(event,'${esc(lane.id)}')" onmouseleave="laneCard(null)"
-        onclick="openLane('${esc(lane.id)}')"></button>`);
-  }).join("");
+/* What was farmed out, and what came back. Sorted as the reader asks. */
+let LANESORT = "start";
 
-  const marks = axisMarks(0, scale.kept).map((m) => {
-    // Positions are on the kept time, which is what the axis measures.
-    return { pos: (m.pos / 100) * scale.room, label: m.label };
-  });
+function setLaneSort(k) {
+  LANESORT = LANESORT === k ? k + "-" : k;
+  const at = main.scrollTop;
+  render();
+  main.scrollTop = at;
+}
 
-  // What the axis leaves out, in the reader's terms. How many separate gaps
-  // were collapsed is a fact about the drawing, not about the run, so it is not
-  // said; how much time is missing from the picture very much is.
-  const hidden = scale.gaps.length ? `${duration(scale.skipped)} of waiting hidden` : "";
-  const note = [hidden, "click a bar to open it"].filter(Boolean).join(" · ");
-
-  const [shownAs, wholeAs] = durationPair(scale.kept, hi - lo);
-  return laneShell({
-    count: LANES.length,
-    shown: shownAs,
-    whole: wholeAs,
-    rows,
-    mainRow,
-    marks: marks.map((m) => `<span style="left:${m.pos}%">${esc(m.label)}</span>`).join(""),
-    note,
-    layer: breaks,
-    overlaps: bands.length,
+function laneList(t) {
+  const key = LANESORT.replace(/-$/, "");
+  const down = LANESORT.endsWith("-");
+  const rows = LANES.slice().sort((a, b) => {
+    const of = (l) =>
+      key === "steps" ? l.steps
+      : key === "took" ? (l.span ? l.span[1] - l.span[0] : -1)
+      : key === "name" ? (l.name || l.kind).toLowerCase()
+      : (l.span ? l.span[0] : l.fromIndex);
+    const x = of(a), y = of(b);
+    const n = x < y ? -1 : x > y ? 1 : 0;
+    return down ? -n : n;
   });
+
+  const head = (k, label, cls) =>
+    `<span class="lh ${cls || ""}${key === k ? " on" : ""}"
+      onclick="setLaneSort('${k}')">${label}${key === k ? (down ? " ↓" : " ↑") : ""}</span>`;
+
+  return `
+    <div class="lanelist">
+      <div class="lrow head">
+        ${head("name", "what it was asked to do")}
+        <span class="lh">kind</span>
+        ${head("steps", "steps", "num")}
+        ${head("took", "took", "num")}
+        <span class="lh">tools</span>
+      </div>
+      ${rows.map((l) => `
+        <div class="lrow" onclick="openLane('${esc(l.id)}')"
+          onmouseenter="laneCard(event,'${esc(l.id)}')" onmouseleave="laneCard(null)">
+          <span class="lname${l.said ? "" : " untitled"}">${esc(l.name || l.kind)}</span>
+          <span class="lkind">${esc(l.kind)}</span>
+          <span class="num">${num(l.steps)}</span>
+          <span class="num">${l.span ? esc(duration(l.span[1] - l.span[0])) : "—"}</span>
+          <span class="ltools">${l.tools.length ? esc(l.tools.slice(0, 3).join(" ")) : "—"}</span>
+        </div>`).join("")}
+    </div>`;
+}
+
+/* The tracks: one row per packed lane, the main thread above them. */
+function laneTracks(bars, rowCount, mainBar, marks, breaks) {
+  const rows = [];
+  for (let r = 0; r < rowCount; r++) {
+    const inner = bars.filter(({ lane }) => lane.row === r).map((b) => b.html).join("");
+    rows.push(`<div class="lane packed">
+      <div class="lane-name"><span class="rownum">${r + 1}</span></div>
+      <div class="track"><span class="rule"></span>${inner}</div>
+    </div>`);
+  }
+  return `
+    <div class="lane-axis packed"><div></div><div class="marks">${marks}</div></div>
+    <div class="lanes-tracks">
+      <div class="bandlayer packed">${breaks}</div>
+      <div class="lane packed">
+        <div class="lane-name"><span class="kind main">main</span></div>
+        <div class="track"><span class="rule"></span>${mainBar}</div>
+      </div>
+      ${rows.join("")}
+    </div>`;
 }
 
 /* One row: who, how many steps, and the track it sits on. */

{transcript_viewer-0.13.0 → transcript_viewer-0.14.0}/tests/page.test.js

@@ -2001,7 +2001,8 @@ test("what was skipped is stated, not swallowed", () => {
         { step_id: 2, source: "agent", timestamp: "2026-01-01T10:02:00Z" },
       ] }],
   };
-  const html = run(`return drawLanes(${JSON.stringify(t)})`);
+  // The elision belongs to the timeline; the list has no axis to cut.
+  const html = run(`LANEVIEW="time"; return drawLanes(${JSON.stringify(t)})`);
   assert.match(html, /of waiting hidden/, "a reader must be told time was left out");
   assert.match(html, /shown of/, "and that the axis is shorter than the run");
   assert.match(html, /class="gapmark"/, "and see where");
@@ -2290,3 +2291,95 @@ test("an empty address shows the library rather than a blank pane", () => {
   `);
   assert.strictEqual(out, null, "no address means no transcript");
 });
+
+// ---- packing, and the two views ----------------------------------------------
+
+test("lanes that never overlap share one row", () => {
+  const t = {
+    steps: [{ step_id: 1, source: "agent", timestamp: "2026-01-01T10:00:00Z" }],
+    subagent_trajectories: [
+      { trajectory_id: "a", agent: {}, extra: {}, steps: [
+        { step_id: 1, source: "agent", timestamp: "2026-01-01T10:00:00Z" },
+        { step_id: 2, source: "agent", timestamp: "2026-01-01T10:05:00Z" }] },
+      { trajectory_id: "b", agent: {}, extra: {}, steps: [
+        { step_id: 1, source: "agent", timestamp: "2026-01-01T10:06:00Z" },
+        { step_id: 2, source: "agent", timestamp: "2026-01-01T10:10:00Z" }] },
+      { trajectory_id: "c", agent: {}, extra: {}, steps: [
+        { step_id: 1, source: "agent", timestamp: "2026-01-01T10:11:00Z" },
+        { step_id: 2, source: "agent", timestamp: "2026-01-01T10:15:00Z" }] },
+    ],
+  };
+  const out = run(`
+    const lanes = laneIndex(${JSON.stringify(t)});
+    const rows = packLanes(lanes);
+    return { rows, on: lanes.map(l => l.row) };
+  `);
+  assert.strictEqual(out.rows, 1, "three in a row is one row, not three");
+  assert.deepStrictEqual(out.on, [0, 0, 0]);
+});
+
+test("a second row exists only because two things ran at once", () => {
+  const t = {
+    steps: [{ step_id: 1, source: "agent", timestamp: "2026-01-01T10:00:00Z" }],
+    subagent_trajectories: [
+      { trajectory_id: "a", agent: {}, extra: {}, steps: [
+        { step_id: 1, source: "agent", timestamp: "2026-01-01T10:00:00Z" },
+        { step_id: 2, source: "agent", timestamp: "2026-01-01T10:10:00Z" }] },
+      { trajectory_id: "b", agent: {}, extra: {}, steps: [
+        { step_id: 1, source: "agent", timestamp: "2026-01-01T10:05:00Z" },
+        { step_id: 2, source: "agent", timestamp: "2026-01-01T10:12:00Z" }] },
+    ],
+  };
+  const out = run(`
+    const lanes = laneIndex(${JSON.stringify(t)});
+    return { rows: packLanes(lanes), on: lanes.map(l => l.row) };
+  `);
+  assert.strictEqual(out.rows, 2);
+  assert.deepStrictEqual(out.on, [0, 1], "the overlap is what made the row");
+});
+
+test("the list is what the box shows first", () => {
+  const html = run(`LANEVIEW="list"; return drawLanes(${JSON.stringify(TWO_AT_ONCE)})`);
+  assert.match(html, /class="lanelist"/);
+  assert.match(html, /what it was asked to do/, "the task leads");
+  assert.ok(!/class="track"/.test(html), "and no chart is drawn");
+});
+
+test("the list names each one and says what it cost", () => {
+  const html = run(`LANEVIEW="list"; return drawLanes(${JSON.stringify(TWO_AT_ONCE)})`);
+  assert.match(html, /find the theme/, "the task, where there was one");
+  assert.match(html, /general-purpose/, "the kind, for the one with none");
+  assert.match(html, /Grep/, "the tools it reached for");
+});
+
+test("a subagent with nothing written down is set apart, not left blank", () => {
+  const html = run(`LANEVIEW="list"; return drawLanes(${JSON.stringify(TWO_AT_ONCE)})`);
+  assert.match(html, /class="lname untitled"/,
+    "its kind stands in for a name, and reads as a handle rather than prose");
+});
+
+test("the list sorts by what it is asked to sort by", () => {
+  const order = (sort) => run(`
+    LANEVIEW="list"; LANESORT=${JSON.stringify(sort)};
+    LANES = laneIndex(${JSON.stringify(TWO_AT_ONCE)});
+    const html = laneList({});
+    return [...html.matchAll(/class="lname[^"]*">([^<]*)</g)].map(m => m[1]);
+  `);
+  // By name, which has no ties to be arbitrary about.
+  const up = order("name");
+  const down = order("name-");
+  assert.deepStrictEqual(up, ["find the theme", "general-purpose"]);
+  assert.deepStrictEqual(down, up.slice().reverse(), "and reverses when asked twice");
+});
+
+test("switching view is remembered", () => {
+  const out = run(`
+    const saved = [];
+    localStorage.setItem = (k, v) => saved.push([k, v]);
+    render = () => {};
+    setLaneView("time");
+    return { LANEVIEW, saved };
+  `);
+  assert.strictEqual(out.LANEVIEW, "time");
+  assert.deepStrictEqual(out.saved, [["transcript-viewer.delegation", "time"]]);
+});

{transcript_viewer-0.13.0 → transcript_viewer-0.14.0}/uv.lock

@@ -388,7 +388,7 @@ wheels = [
 
 [[package]]
 name = "transcript-viewer"
-version = "0.13.0"
+version = "0.14.0"
 source = { editable = "." }
 dependencies = [
     { name = "atif-make" },