The stats bar: context + cost beneath the composer, per-turn detail

One quiet row beneath the composer/question shell (not flush to the
screen bottom; static height, outside the morphing shell):

- LEFT: context window + session cost, clickable → per-turn detail
  popover (context, total, unpriced count, one row per turn with
  model/steps/cost). All folds from core/prices.ts — sessionCost,
  contextWindow, turnCost — no cost math in components.
- RIGHT: model + "Thinking —" — a placeholder slot for the coming
  model/thinking-level CONTROL (later work with its contract changes);
  display-only today, model read from the last turn's usage,
  pretty-printed (Glm 5.3 Flash).
- Data: the record's turns log, seeded on mount, refreshed when the
  local stream settles, kept fresh by the existing record re-syncs.
  No turns yet → "—" everywhere; unpriceable turns never fold into a
  fake $0 (the doctrine).
- formatUsd/formatTokens moved to components/usage-format.ts (shared
  with the activity dock); prettyModel joins them, pure + tested.

tests/render-activity-dock.test.tsx

@@ -1,7 +1,8 @@
 import { renderToStaticMarkup } from "react-dom/server";
 import { describe, it } from "node:test";
 import assert from "node:assert/strict";
-import { ActivityDock, formatElapsed, formatTokens, formatUsd, toBlobs, type ActivityFeed } from "../components/activity-dock.tsx";
+import { ActivityDock, formatElapsed, toBlobs, type ActivityFeed } from "../components/activity-dock.tsx";
+import { formatTokens, formatUsd } from "../components/usage-format.ts";
 
 // The dock's pure layer: folds, formatting, and blob order — then the SSR
 // render (blobs, "—" doctrine, the abort affordance, the narrow badge).

tests/render-stats-bar.test.tsx

@@ -0,0 +1,57 @@
+import { renderToStaticMarkup } from "react-dom/server";
+import { describe, it } from "node:test";
+import assert from "node:assert/strict";
+import { StatsBar } from "../components/stats-bar.tsx";
+import { prettyModel } from "../components/usage-format.ts";
+import type { TurnUsage } from "../src/core/contracts.ts";
+
+// The stats bar: folds only (no cost math in the component), the "—"
+// doctrine for absent data, honest cost (never a fake $0), and the
+// model/thinking placeholder chip for the coming control.
+
+function step(inputTokens: number, outputTokens: number, over: Record<string, number | undefined> = {}) {
+	return { inputTokens, outputTokens, cacheReadTokens: undefined, cacheWriteTokens: undefined, reasoningTokens: undefined, ...over };
+}
+
+function turn(over: Partial<TurnUsage> = {}): TurnUsage {
+	return {
+		messageId: "m1",
+		at: "2026-09-09T12:00:00Z",
+		model: "z-ai/glm-5.3-flash",
+		steps: [step(10_000, 1_000)],
+		...over,
+	};
+}
+
+describe("stats bar", () => {
+	it("renders — everywhere when the record has no turns yet (doctrine)", () => {
+		const html = renderToStaticMarkup(<StatsBar turns={[]} />);
+		assert.match(html, /data-testid="stats-bar"/);
+		assert.match(html, /data-testid="stats-context">—</);
+		assert.match(html, /data-testid="stats-cost">—</);
+		assert.match(html, /data-testid="stats-model">—</);
+		assert.match(html, /Thinking —</);
+	});
+
+	it("folds context + cost from the turns log (core/prices, no local math)", () => {
+		const html = renderToStaticMarkup(<StatsBar turns={[turn(), turn()]} />);
+		// last turn's last call: 10k in + 1k out = 11k; limit 1,310,720 → "1.3M"
+		assert.match(html, /data-testid="stats-context">11k \/ 1\.3M</);
+		// each turn: 10k fresh input ×0.15 + 1k output ×0.5 = $0.002 → two = $0.0040
+		assert.match(html, /data-testid="stats-cost">\$0\.0040</);
+		// model chip: pretty name from the last turn's model id
+		assert.match(html, /data-testid="stats-model">Glm 5\.3 Flash</);
+	});
+
+	it("shows — for cost when every turn is unpriceable, never a fake $0", () => {
+		const html = renderToStaticMarkup(<StatsBar turns={[turn({ model: "nope/unknown" })]} />);
+		assert.match(html, /data-testid="stats-cost">—</);
+		// unknown model also kills the context limit
+		assert.match(html, /data-testid="stats-context">—</);
+	});
+
+	it("prettyModel strips vendor + date suffix, capitalizes", () => {
+		assert.equal(prettyModel("z-ai/glm-5.3-flash"), "Glm 5.3 Flash");
+		assert.equal(prettyModel("qwen/qwen3.8-max-0902"), "Qwen3.8 Max");
+	});
+});