@gavin-hu/my-pi-agent 0.16.0 → 0.18.0

package/extensions/file-browse/diff-html.ts

@@ -0,0 +1,94 @@
+/**
+ * The browse pages' unified-diff body: one line per row, with the gutter, the
+ * sign, and the hunk sections.
+ *
+ * Split from `html.ts` when that module reached its named ceiling: the diff body
+ * is the one part of the page renderers with its own rule — old and new sides are
+ * highlighted as two documents per hunk, so the tokenizer carries state within a
+ * hunk and never across the unchanged lines a hunk does not show.
+ */
+
+import { escapeHtml } from "../../lib/escape.ts";
+import { highlightLines, type HighlightLanguage } from "../../lib/highlight.ts";
+import type { DiffLine } from "./diff.ts";
+
+/**
+ * The inner HTML per diff line. Hunk bodies are highlighted by rebuilding the
+ * old side (context + deleted) and the new side (context + added), so the
+ * tokenizer carries state within a hunk; meta, hunk, and note lines stay plain.
+ * State does not cross hunks, since the unchanged lines between them are absent.
+ */
+function highlightDiffText(lines: DiffLine[], language?: HighlightLanguage): string[] {
+	if (!language) return lines.map((line) => escapeHtml(line.text));
+	const out: string[] = new Array(lines.length);
+	let index = 0;
+	while (index < lines.length) {
+		const kind = lines[index].kind;
+		if (kind !== "ctx" && kind !== "add" && kind !== "del") {
+			out[index] = escapeHtml(lines[index].text);
+			index++;
+			continue;
+		}
+		const start = index;
+		const oldDoc: string[] = [];
+		const newDoc: string[] = [];
+		while (index < lines.length) {
+			const body = lines[index].kind;
+			if (body !== "ctx" && body !== "add" && body !== "del") break;
+			if (body === "ctx") {
+				oldDoc.push(lines[index].text);
+				newDoc.push(lines[index].text);
+			} else if (body === "add") {
+				newDoc.push(lines[index].text);
+			} else {
+				oldDoc.push(lines[index].text);
+			}
+			index++;
+		}
+		const oldHtml = highlightLines(oldDoc, language);
+		const newHtml = highlightLines(newDoc, language);
+		let oldIndex = 0;
+		let newIndex = 0;
+		for (let cursor = start; cursor < index; cursor++) {
+			const body = lines[cursor].kind;
+			if (body === "ctx") {
+				out[cursor] = newHtml[newIndex];
+				newIndex++;
+				oldIndex++;
+			} else if (body === "add") {
+				out[cursor] = newHtml[newIndex];
+				newIndex++;
+			} else {
+				out[cursor] = oldHtml[oldIndex];
+				oldIndex++;
+			}
+		}
+	}
+	return out;
+}
+
+/** Render unified-diff lines with a two-column gutter and per-kind styling. */
+export function renderDiffLines(lines: DiffLine[], language?: HighlightLanguage): string {
+	const html = highlightDiffText(lines, language);
+	// Every hunk is a section so its sticky header is bounded by its own body;
+	// the section also gives the keyboard a stable, non-sticky scroll target.
+	const out: string[] = [];
+	let hunks = 0;
+	let open = false;
+	lines.forEach((line, index) => {
+		if (line.kind === "hunk") {
+			if (open) out.push("</span>");
+			hunks += 1;
+			out.push(`<span class="bf-diff-hunk" id="hunk-${hunks}" data-hunk="${hunks}">`);
+			open = true;
+		}
+		const sign = line.kind === "add" ? "+" : line.kind === "del" ? "-" : line.kind === "ctx" ? " " : "";
+		const gutter = `<span class="browse-diff-no" aria-hidden="true">${line.oldNo ?? ""}</span><span class="browse-diff-no" aria-hidden="true">${line.newNo ?? ""}</span>`;
+		const marker = `<span class="browse-diff-sign" aria-hidden="true">${sign}</span>`;
+		out.push(
+			`<span class="bf-code__line bf-diff-line bf-diff-line--${line.kind}">${gutter}${marker}${html[index]}</span>`,
+		);
+	});
+	if (open) out.push("</span>");
+	return out.join("");
+}

package/extensions/file-browse/html.ts

@@ -8,11 +8,12 @@
  * the page-only `browse-*` rules from `styles.ts`.
  */
 
-import { GLYPHS } from "../../lib/tui/glyphs.ts";
-import { brandLockup, docHead, type KeyHint, keysSheet } from "../../lib/web/index.ts";
+import { brandLockup, docHead, type KeyHint, keysSheet, themeToggle } from "../../lib/web/index.ts";
 import { escapeHtml } from "../../lib/escape.ts";
+import { renderChanges, renderGit, renderLiveChrome, renderLiveStatus, type LivePage } from "./chrome.ts";
 import { formatSize, type DirEntry, type FileView, type Listing, type TreeNode } from "./files.ts";
-import { DIFF_MODES, statusLetter, type ChangedFile, type DiffLine, type DiffMode } from "./diff.ts";
+import { DIFF_MODES, statusLetter, type ChangedFile, type DiffMode } from "./diff.ts";
+import { renderDiffLines } from "./diff-html.ts";
 import type { DiffFileView, GitStatus } from "./git.ts";
 import type { ChangeIndex } from "./live.ts";
 import { detectLanguage, highlightLines, type HighlightLanguage } from "../../lib/highlight.ts";
@@ -36,16 +37,6 @@ function iconMarkup(spec: IconSpec, hidden = false): string {
 	return `<svg class="browse-cat ${spec.colorClass}"${hidden ? " hidden" : ""} aria-hidden="true" title="${escapeHtml(spec.label)}"><use href="${iconHref(spec.icon)}"/></svg>`;
 }
 
-/** The header's git chip: the branch, or the detached head; changes are the changes chip's job. */
-function renderGit(git: GitStatus | undefined): string {
-	if (!git) return "";
-	const name = git.branch ?? git.head;
-	if (!name) return "";
-	const glyph = git.branch ? GLYPHS.branch : GLYPHS.detached;
-	const aria = git.branch ? `git branch ${git.branch}` : `git detached at ${git.head ?? ""}`;
-	return `<span class="bf-chip browse-git" title="${escapeHtml(aria)}" aria-label="${escapeHtml(aria)}"><span class="browse-git__glyph" aria-hidden="true">${escapeHtml(glyph)}</span><span class="browse-git__name">${escapeHtml(name)}</span></span>`;
-}
-
 /**
  * The changed-path index for markers, plus the totals shown in the chip. It is
  * the same index the live status feed sends, so the page and its updates agree
@@ -66,55 +57,6 @@ function changeMark(summary: ChangeSummary | undefined, rel: string, isDir: bool
 		: "";
 }
 
-/** The live chrome a page renders: how often its stream is sent a frame. */
-export interface LivePage {
-	intervalMs: number;
-}
-
-/**
- * The header's connection chip. It starts hidden and says "connecting": the
- * client reveals and paints it from the event stream, so a page with JS off — or
- * with live status disabled — never shows a state it cannot keep true.
- *
- * It is deliberately not a `role="status"` region: the header is where a reader
- * looks for the page's state, not a place to announce every change to it.
- */
-function renderLiveChip(live: LivePage | undefined): string {
-	if (!live) return "";
-	return `<span class="bf-chip bf-chip--accent browse-live" id="live-state" title="Live status from the browse server" data-interval="${live.intervalMs}" hidden><span class="browse-live__glyph" aria-hidden="true">${escapeHtml(GLYPHS.browse)}</span><span class="browse-live__text">connecting</span></span>`;
-}
-
-/**
- * The footer's live line, hidden until the first frame: uptime and requests are
- * server facts the rendered page does not know at build time.
- */
-function renderLiveStatus(): string {
-	return `<span class="browse-live-line" id="live-status" hidden></span>`;
-}
-
-/**
- * The header's changes chip, linking to the diff overview. With live status on,
- * a hidden shell is always rendered so the chip can appear and disappear as the
- * working tree changes, without the client inserting elements into the header.
- */
-function renderChanges(summary: ChangeSummary | undefined, live: LivePage | undefined): string {
-	const count = summary?.count ?? 0;
-	if (count <= 0) {
-		return live
-			? `<a class="bf-chip browse-diff" id="browse-changes" href="/diff" title="View uncommitted changes" hidden></a>`
-			: "";
-	}
-	const label = `${count} change${count === 1 ? "" : "s"}`;
-	const insertions = summary?.insertions ?? 0;
-	const deletions = summary?.deletions ?? 0;
-	const totals =
-		insertions + deletions > 0
-			? ` <span class="browse-diff-totals"><span class="browse-diff-add">+${insertions}</span> <span class="browse-diff-del">−${deletions}</span></span>`
-			: "";
-	const aria = `${label} against HEAD${insertions + deletions > 0 ? `, ${insertions} insertions and ${deletions} deletions` : ""}`;
-	return `<a class="bf-chip browse-diff" id="browse-changes" href="/diff" title="View uncommitted changes" aria-label="${escapeHtml(aria)}"><span class="browse-diff__dot" aria-hidden="true">●</span>${escapeHtml(label)}${totals}</a>`;
-}
-
 function hrefFor(entry: { rel: string; isDir: boolean }): string {
 	return entry.isDir ? `/browse/${encodePath(entry.rel)}` : `/view/${encodePath(entry.rel)}`;
 }
@@ -157,9 +99,9 @@ ${SPRITE}
   ${renderGit(layout.git)}
   ${renderChanges(layout.summary, layout.live)}
   <span class="bf-chip bf-chip--accent">read-only</span>
-  ${renderLiveChip(layout.live)}
+  ${renderLiveChrome(layout.live)}
   <button type="button" class="bf-btn bf-btn--icon browse-keys-btn" id="keys-open" aria-label="Keyboard shortcuts" title="Keyboard shortcuts">?</button>
-  <button type="button" class="bf-btn bf-btn--icon bf-theme-toggle" id="theme-toggle" aria-label="Toggle light and dark theme" title="Toggle light and dark theme"><span class="theme-glyph" aria-hidden="true">☾</span></button>
+  ${themeToggle()}
 </div><div class="browse-progress" aria-hidden="true"><span class="browse-progress__fill" id="progress-fill"></span></div></header>
 <div class="bf-app__body">
   <details class="bf-app__sidebar browse-sidebar" open>
@@ -213,7 +155,7 @@ function renderTreeNode(node: TreeNode, currentRel: string, summary?: ChangeSumm
 	const href = hrefFor(node);
 	const current = node.rel === currentRel ? ` aria-current="page"` : "";
 	const twisty = isDir
-		? `<button type="button" class="bf-tree__tw bf-tree__tw--toggle" aria-expanded="${expanded}" aria-label="${escapeHtml(node.name)}">${expanded ? "▾" : "▸"}</button>`
+		? `<button type="button" class="bf-tree__tw bf-tree__tw--toggle" tabindex="-1" aria-hidden="true">${expanded ? "▾" : "▸"}</button>`
 		: `<span class="bf-tree__tw bf-tree__tw--spacer" aria-hidden="true"></span>`;
 	const dataPath = ` data-path="${escapeHtml(node.rel)}"`;
 	const name = isDir ? `${escapeHtml(node.name)}/` : escapeHtml(node.name);
@@ -222,7 +164,9 @@ function renderTreeNode(node: TreeNode, currentRel: string, summary?: ChangeSumm
 		: "";
 	const label = node.broken
 		? `<span class="browse-broken" title="broken symbolic link">${name}</span><span class="browse-link-mark">↩</span>`
-		: `<a href="${href}">${name}</a>`;
+		: isDir
+			? `<a href="${href}" aria-expanded="${expanded}" title="${escapeHtml(node.rel)}">${name}</a>`
+			: `<a href="${href}" title="${escapeHtml(node.rel)}">${name}</a>`;
 	return `<li data-open="${expanded}"><div class="bf-tree__row"${current}${dataPath}>${twisty}${iconMarkup(spec)}${label}${changeMark(summary, node.rel, isDir)}</div>${children}</li>`;
 }
 
@@ -238,7 +182,7 @@ function renderRow(entry: DirEntry, maxThumbBytes: number, thumbnails: boolean,
 		.join(" ");
 	const link = entry.broken
 		? `<span class="browse-broken" title="broken symbolic link">${name}</span>`
-		: `<a href="${hrefFor(entry)}">${name}</a>`;
+		: `<a href="${hrefFor(entry)}" title="${escapeHtml(entry.rel)}">${name}</a>`;
 	const mark = entry.isSymlink
 		? `<span class="browse-link-mark" title="${entry.broken ? "broken symbolic link" : "symbolic link"}">↩</span>`
 		: "";
@@ -337,6 +281,11 @@ function pageKeys(...extra: KeyHint[]): KeyHint[] {
 	];
 }
 
+/** Whether the page renders lines with a number beside them: plain text, or raw Markdown. */
+function numberedLines(page: FilePage): boolean {
+	return page.file.kind === "text" || (page.file.kind === "markdown" && page.markdownRaw === true);
+}
+
 /** The card-head controls: Markdown mode, line wrapping, and copy actions. */
 function renderFileActions(page: FilePage): string {
 	const isMarkdown = page.file.kind === "markdown";
@@ -357,7 +306,7 @@ function renderFileActions(page: FilePage): string {
 			: `<a class="bf-segmented__item" href="${viewHref}?raw=1">raw</a>`;
 		groups.push(`<span class="bf-segmented" role="group" aria-label="Markdown view">${rendered}${raw}</span>`);
 	}
-	if (page.file.kind === "text" || (isMarkdown && page.markdownRaw)) {
+	if (numberedLines(page)) {
 		groups.push(
 			`<button type="button" class="bf-btn" id="wrap-toggle" aria-pressed="false" title="Toggle line wrapping">wrap</button>`,
 		);
@@ -370,6 +319,11 @@ function renderFileActions(page: FilePage): string {
 	groups.push(
 		`<button type="button" class="bf-btn" data-copy="path" data-value="${escapeHtml(page.rel)}" title="Copy the root-relative path">copy path</button>`,
 	);
+	if (numberedLines(page)) {
+		groups.push(
+			`<button type="button" class="bf-btn" id="copy-reference" disabled title="Select lines in the file first">copy reference</button>`,
+		);
+	}
 	return `<span class="bf-card__actions">${groups.join("")}</span>`;
 }
 
@@ -386,10 +340,11 @@ export function renderFilePage(page: FilePage): string {
 
 	const isMarkdown = page.file.kind === "markdown";
 	const rendered = isMarkdown && !page.markdownRaw;
-	const wrappable = page.file.kind === "text" || (isMarkdown && page.markdownRaw);
+	const numbered = numberedLines(page);
 	const keys = pageKeys(
 		...(isMarkdown ? [{ keys: "r", label: "Toggle rendered and raw" }] : []),
-		...(wrappable ? [{ keys: "u", label: "Toggle line wrapping" }] : []),
+		...(numbered ? [{ keys: "u", label: "Toggle line wrapping" }] : []),
+		...(numbered ? [{ keys: "y", label: "Copy a reference to the selected lines" }] : []),
 	);
 
 	let content: string;
@@ -401,7 +356,7 @@ export function renderFilePage(page: FilePage): string {
 			});
 			content = `<article class="bf-md">${html}</article>`;
 		} else {
-			content = `<pre class="bf-code bf-code--numbered"><code>${renderCodeLines(page.file.lines, language)}</code></pre>`;
+			content = `<pre class="bf-code bf-code--numbered" data-path="${escapeHtml(page.rel)}"><code>${renderCodeLines(page.file.lines, language)}</code></pre>`;
 		}
 		if (page.file.truncated)
 			note = `<p class="bf-note">Showing the first ${page.file.lines.length} of ${page.file.totalLines} lines.</p>`;
@@ -445,87 +400,6 @@ function statusWord(letter: string): string {
 	return STATUS_LABEL[letter] ?? "changed";
 }
 
-/**
- * The inner HTML per diff line. Hunk bodies are highlighted by rebuilding the
- * old side (context + deleted) and the new side (context + added), so the
- * tokenizer carries state within a hunk; meta, hunk, and note lines stay plain.
- * State does not cross hunks, since the unchanged lines between them are absent.
- */
-function highlightDiffText(lines: DiffLine[], language?: HighlightLanguage): string[] {
-	if (!language) return lines.map((line) => escapeHtml(line.text));
-	const out: string[] = new Array(lines.length);
-	let index = 0;
-	while (index < lines.length) {
-		const kind = lines[index].kind;
-		if (kind !== "ctx" && kind !== "add" && kind !== "del") {
-			out[index] = escapeHtml(lines[index].text);
-			index++;
-			continue;
-		}
-		const start = index;
-		const oldDoc: string[] = [];
-		const newDoc: string[] = [];
-		while (index < lines.length) {
-			const body = lines[index].kind;
-			if (body !== "ctx" && body !== "add" && body !== "del") break;
-			if (body === "ctx") {
-				oldDoc.push(lines[index].text);
-				newDoc.push(lines[index].text);
-			} else if (body === "add") {
-				newDoc.push(lines[index].text);
-			} else {
-				oldDoc.push(lines[index].text);
-			}
-			index++;
-		}
-		const oldHtml = highlightLines(oldDoc, language);
-		const newHtml = highlightLines(newDoc, language);
-		let oldIndex = 0;
-		let newIndex = 0;
-		for (let cursor = start; cursor < index; cursor++) {
-			const body = lines[cursor].kind;
-			if (body === "ctx") {
-				out[cursor] = newHtml[newIndex];
-				newIndex++;
-				oldIndex++;
-			} else if (body === "add") {
-				out[cursor] = newHtml[newIndex];
-				newIndex++;
-			} else {
-				out[cursor] = oldHtml[oldIndex];
-				oldIndex++;
-			}
-		}
-	}
-	return out;
-}
-
-/** Render unified-diff lines with a two-column gutter and per-kind styling. */
-export function renderDiffLines(lines: DiffLine[], language?: HighlightLanguage): string {
-	const html = highlightDiffText(lines, language);
-	// Every hunk is a section so its sticky header is bounded by its own body;
-	// the section also gives the keyboard a stable, non-sticky scroll target.
-	const out: string[] = [];
-	let hunks = 0;
-	let open = false;
-	lines.forEach((line, index) => {
-		if (line.kind === "hunk") {
-			if (open) out.push("</span>");
-			hunks += 1;
-			out.push(`<span class="bf-diff-hunk" id="hunk-${hunks}" data-hunk="${hunks}">`);
-			open = true;
-		}
-		const sign = line.kind === "add" ? "+" : line.kind === "del" ? "-" : line.kind === "ctx" ? " " : "";
-		const gutter = `<span class="browse-diff-no" aria-hidden="true">${line.oldNo ?? ""}</span><span class="browse-diff-no" aria-hidden="true">${line.newNo ?? ""}</span>`;
-		const marker = `<span class="browse-diff-sign" aria-hidden="true">${sign}</span>`;
-		out.push(
-			`<span class="bf-code__line bf-diff-line bf-diff-line--${line.kind}">${gutter}${marker}${html[index]}</span>`,
-		);
-	});
-	if (open) out.push("</span>");
-	return out.join("");
-}
-
 /** The scope label for a mode. */
 function modeScope(mode: DiffMode): string {
 	if (mode === "staged") return "staged vs HEAD";

package/extensions/file-browse/live-client.ts

@@ -9,6 +9,12 @@
  *
  * It does nothing at all unless the server rendered the connection chip, which
  * is what makes `live: false` and JS-off leave the page exactly as it was.
+ *
+ * The folder check is the other half: the stream is shared by every open page, so
+ * it cannot say what *this* page's rows show. A page that lists a folder carries
+ * the revision of what it drew, and asks the server for the folder's current one
+ * once per interval; a difference reveals a reload control instead of touching
+ * the document, because a reload is the only honest way to add a row.
  */
 
 export const LIVE_CLIENT_JS = `	// Live status: one event stream feeds the header chips, the tree and listing
@@ -19,9 +25,14 @@ export const LIVE_CLIENT_JS = `	// Live status: one event stream feeds the heade
 		var liveLine = document.getElementById("live-status");
 		var liveGit = document.querySelector(".browse-git");
 		var liveChanges = document.getElementById("browse-changes");
-		var liveInterval = Number(liveChip.getAttribute("data-interval")) || 3000;
+		var liveInterval = Number(liveChip.getAttribute("data-interval")) || 5000;
 		var liveStale = 0;
 		var liveTone = "";
+		var liveRev = "";
+		var liveDir = liveChip.getAttribute("data-dir");
+		var liveDirRev = liveChip.getAttribute("data-rev");
+		var liveReload = document.getElementById("reload-hint");
+		var liveDirTimer = 0;
 
 		function formatSpan(ms) {
 			var seconds = Math.max(0, Math.round(ms / 1000));
@@ -88,7 +99,12 @@ export const LIVE_CLIENT_JS = `	// Live status: one event stream feeds the heade
 			});
 		}
 
+		// One revision covers the chip and the markers: a frame that did not move the
+		// change set is not painted at all, so a tick on an idle tree costs no DOM
+		// work however many rows the page drew.
 		function paintLiveChanges(changes) {
+			if (changes && changes.rev === liveRev) return;
+			liveRev = changes && changes.rev ? changes.rev : "";
 			var count = changes ? changes.count : 0;
 			if (liveChanges) {
 				liveChanges.hidden = count <= 0;
@@ -136,6 +152,32 @@ export const LIVE_CLIENT_JS = `	// Live status: one event stream feeds the heade
 			paintLiveChanges(snapshot.changes);
 		}
 
+		// The folder the page drew, checked against the disk on the frame cadence. It
+		// waits for the first frame, never runs in a hidden tab, and stops as soon as
+		// it has something to say: the control is the fix, and a reload ends the
+		// question.
+		function showLiveReload() {
+			window.clearInterval(liveDirTimer);
+			liveDirTimer = 0;
+			if (!liveReload || !liveReload.hidden) return;
+			liveReload.hidden = false;
+			liveReload.addEventListener("click", function () { window.location.reload(); });
+		}
+
+		function checkLiveDir() {
+			if (document.hidden || liveTone !== "success") return;
+			fetch("/api/dir-rev?path=" + encodeURIComponent(liveDir))
+				.then(function (response) {
+					if (!response.ok) throw new Error("check failed");
+					return response.json();
+				})
+				.then(function (answer) {
+					var rev = answer.rev;
+					if (typeof rev === "string" && rev !== liveDirRev) showLiveReload();
+				})
+				.catch(function () { /* the stream already reports a dead server */ });
+		}
+
 		if (window.EventSource) {
 			var liveStream = new EventSource("/events");
 			liveStream.addEventListener("open", function () {
@@ -152,7 +194,11 @@ export const LIVE_CLIENT_JS = `	// Live status: one event stream feeds the heade
 			window.addEventListener("pagehide", function () {
 				liveStream.close();
 				window.clearTimeout(liveStale);
+				window.clearInterval(liveDirTimer);
 			});
+			if (liveDir !== null && liveDirRev && liveReload) {
+				liveDirTimer = window.setInterval(checkLiveDir, liveInterval);
+			}
 		}
 	}
 `;

package/extensions/file-browse/live.ts

@@ -3,17 +3,20 @@
  *
  * A page that stays open holds one event stream; this module builds the snapshot
  * it is sent, the frame that carries it, and the channel that fans it out on a
- * tick. The git and diff providers already memoize, so a tick re-reads at most
- * one `git status`, and every read failure degrades to `null`: a status feed
- * must never be able to fail a page or the server that serves it.
+ * tick. A tick costs one `git status` and one `git diff --stat`: the providers'
+ * 2 s memo only coalesces a tick with a page render in the same window, so the
+ * cadence is what bounds the reads. Every read failure degrades to `null`: a
+ * status feed must never be able to fail a page or the server that serves it.
  *
  * The channel opens no socket of its own — the caller hands it a `write`/`end`
  * pair — so the whole feed is tested without one.
  */
 
 import { defaultInterval, defaultTimer } from "../../lib/timer.ts";
+import { LIVE_MAX_CLIENTS } from "./config.ts";
 import { changeDirs } from "./diff.ts";
 import type { DiffList, GitDiffProvider, GitStatus, GitStatusProvider } from "./git.ts";
+import { changeRevision } from "./rev.ts";
 
 /**
  * The changed-path index the pages render from: the totals the changes chip
@@ -50,12 +53,27 @@ export interface LiveChanges {
 	deletions: number;
 	files: string[];
 	dirs: string[];
+	/**
+	 * Identity of this change set, counts included. A page that painted the same
+	 * revision repaints nothing when the next frame arrives.
+	 */
+	rev: string;
+}
+
+/** A change index as it goes over the wire, with its revision. */
+function changesOf(index: ChangeIndex): LiveChanges {
+	const changes = {
+		count: index.count,
+		insertions: index.insertions,
+		deletions: index.deletions,
+		files: [...index.files].sort(),
+		dirs: [...index.dirs].sort(),
+	};
+	return { ...changes, rev: changeRevision(changes) };
 }
 
 /** One status frame's payload. */
 export interface LiveSnapshot {
-	/** Server wall clock when the snapshot was taken, in ms. */
-	at: number;
 	/** How long the server has been listening, in ms. */
 	uptimeMs: number;
 	/** Requests the server has answered so far, this one included. */
@@ -112,15 +130,7 @@ export function createLiveStatus(options: LiveStatusOptions): LiveStatusSource {
 				uptimeMs: Math.max(0, at - options.startedAt),
 				requests: options.requests(),
 				git,
-				changes: index
-					? {
-							count: index.count,
-							insertions: index.insertions,
-							deletions: index.deletions,
-							files: [...index.files].sort(),
-							dirs: [...index.dirs].sort(),
-						}
-					: null,
+				changes: index ? changesOf(index) : null,
 			};
 		},
 	};
@@ -158,6 +168,8 @@ export interface LiveChannelOptions {
 	intervalMs: number;
 	/** How long the last page's departure is held before `onIdle` is called, in ms. */
 	idleMs: number;
+	/** How many pages may attach at once; defaults to `LIVE_MAX_CLIENTS`. */
+	maxClients?: number;
 	/** Called once the last page has been gone for `idleMs`; omitted, the channel only idles. */
 	onIdle?: () => void;
 	/** Timer seam; defaults to an unref'd interval. */
@@ -172,6 +184,11 @@ export interface LiveChannel {
 	attach(client: LiveClient): () => void;
 	/** End every connected page, stop the ticker, and drop a pending idle stop. */
 	close(): void;
+	/**
+	 * Whether another page must be refused. The caller asks before it opens the
+	 * stream, so a refusal never has to take back a head it already wrote.
+	 */
+	atCapacity(): boolean;
 }
 
 /**
@@ -183,6 +200,7 @@ export interface LiveChannel {
 export function createLiveChannel(options: LiveChannelOptions): LiveChannel {
 	const timer = options.timer ?? defaultTicker;
 	const timeout = options.timeout ?? defaultTimeout;
+	const maxClients = options.maxClients ?? LIVE_MAX_CLIENTS;
 	const clients = new Set<LiveClient>();
 	let cancel: (() => void) | undefined;
 	let cancelIdle: (() => void) | undefined;
@@ -252,5 +270,8 @@ export function createLiveChannel(options: LiveChannelOptions): LiveChannel {
 			for (const client of clients) client.end();
 			clients.clear();
 		},
+		atCapacity() {
+			return clients.size >= maxClients;
+		},
 	};
 }