gentle-pi 3.2.1 → 3.4.0

package/tests/session-changes-shell.test.ts

@@ -36,3 +36,30 @@ test("reload and new evidence refresh Changes without Git or live file reads",as
 	assert.equal(typeof f.widgets.get("gentle-shell-changes"),"function");
 	await f.fire("session_shutdown");
 });
+test("the changes overlay labels each session tree with its root's branch instead of detached",async()=>{
+	const evidence=(root:string,id:string)=>({type:"custom",customType:SESSION_CHANGE_ENTRY,data:{sessionId:"session",evidence:{id,root,path:"own.ts",before:{kind:"absent"},after:{kind:"text",text:"own\n"}}}});
+	const entries=[evidence("/repo","child:1"),evidence("/other","child:2")];
+	const handlers=new Map<string,Function[]>();
+	const commands=new Map<string,any>();
+	const gitRoots:string[]=[];
+	const pi:any={on:(key,fn)=>handlers.set(key,[...(handlers.get(key)??[]),fn]),events:{on:()=>()=>{},emit(){}},appendEntry(){},registerTool(){},registerShortcut(){},registerMessageRenderer(){},registerCommand:(key,registration)=>commands.set(key,registration)};
+	let view:any; let renders=0;
+	const ctx:any={hasUI:true,cwd:"/repo",sessionManager:{getSessionId:()=>"session",getEntries:()=>entries},
+		ui:{setFooter(){},getEditorComponent:()=>({}),setWorkingVisible(){},setWidget(){},notify(){},
+			custom:async(factory:any)=>{view=factory({terminal:{rows:40,columns:120},requestRender:()=>renders++},{fg:(_c:string,t:string)=>t,bold:(t:string)=>t},{},()=>{});return new Promise(()=>{});}}};
+	shell(pi,{},{resolveWorktree:()=>({root:"/repo",commonDir:"/git"}),devBinary:()=>undefined,
+		gitRunner:(root:string)=>async(args:string[])=>{gitRoots.push(root);await new Promise(r=>setImmediate(r));
+			if(args[0]==="symbolic-ref")return root==="/repo"?{stdout:"feature\n",code:0}:{stdout:"",code:1};
+			return {stdout:"deadbeef\n",code:0};}});
+	for(const fn of handlers.get("session_start")??[])await fn({},ctx);
+	void commands.get("gentle:changes").handler("",ctx);
+	await new Promise(r=>setImmediate(r));
+	assert.ok(view,"the overlay opened");
+	for(let i=0;i<6;i++)await new Promise(r=>setImmediate(r));
+	const rendered=view.render(120).join("\n");
+	assert.match(rendered,/feature · repo/,"the repo tree carries its branch");
+	assert.match(rendered,/detached · other/,"a genuinely detached root still reads detached");
+	assert.deepEqual([...new Set(gitRoots)].sort(),["/other","/repo"],"git is asked once per root, only while the overlay is open");
+	assert.ok(renders>0,"a resolved label asks the overlay to repaint");
+	for(const fn of handlers.get("session_shutdown")??[])await fn({},ctx);
+});

package/tests/session-worktree-registry.test.ts

@@ -133,3 +133,44 @@ test("only standard path-bearing calls have registration candidates; shell and p
 	for (const name of ["bash", "powershell", "custom", "subagent_run"]) assert.equal(toolWorktreePath(name, { path: "/linked", command: "cd /linked", task: "/linked" }), undefined);
 	assert.equal(toolWorktreePath("read", { path: 42 }), undefined);
 });
+
+// C2 (odd/tasks/usage-click-and-changes-attribution.md): a repo nested inside
+// another repo (the live session's ~/work/NaN-builders inside ~/work) must
+// resolve to the INNER repo, never the outer one, because Git itself walks
+// up from the file's own directory and stops at the first .git it finds.
+function nestedFixture(t: test.TestContext) {
+	const dir = realpathSync(mkdtempSync(join(tmpdir(), "session-worktrees-nested-")));
+	t.after(() => rmSync(dir, { recursive: true, force: true }));
+	const outer = join(dir, "work");
+	const inner = join(outer, "NaN-builders");
+	const empty = join(dir, "empty");
+	mkdirSync(empty);
+	const env = Object.fromEntries(Object.entries(process.env).filter(([key]) => !key.startsWith("GIT_")));
+	Object.assign(env, { GIT_CONFIG_GLOBAL: join(empty, "config"), GIT_CONFIG_NOSYSTEM: "1", GIT_ATTR_NOSYSTEM: "1" });
+	writeFileSync(join(empty, "config"), "");
+	const git = (cwd: string, args: string[]) => execFileSync("git", ["-C", cwd, "-c", `core.hooksPath=${empty}`, "-c", "commit.gpgsign=false", ...args], { env, stdio: ["ignore", "pipe", "pipe"] });
+	// Outer repo: no commits, matching the live evidence's `~/work` exactly.
+	git(dir, ["init", "--initial-branch=main", `--template=${empty}`, outer]);
+	// Inner repo: its own .git, a real branch and a commit.
+	git(dir, ["init", "--initial-branch=feature", `--template=${empty}`, inner]);
+	git(inner, ["-c", "user.name=Test", "-c", "user.email=test@example.invalid", "commit", "--allow-empty", "-m", "Fixture"]);
+	mkdirSync(join(inner, "odd", "tasks"), { recursive: true });
+	writeFileSync(join(inner, "odd", "tasks", "jpg-png-converter.md"), "converted\n");
+	return { dir, outer, inner };
+}
+
+test("nearest-repository resolution: an inner repo's files never resolve to an outer ancestor repo", (t) => {
+	const f = nestedFixture(t);
+	const forFile = resolveSessionWorktree(join("NaN-builders", "odd", "tasks", "jpg-png-converter.md"), f.outer);
+	assert.equal(forFile?.root, f.inner, "the file's own nearest repository must win, not the outer ~/work repo");
+	// The inner repo's own root and files resolve to itself too, whether
+	// addressed from the outer cwd or the inner cwd directly.
+	const forRoot = resolveSessionWorktree("NaN-builders", f.outer);
+	assert.equal(forRoot?.root, f.inner);
+	const fromInnerCwd = resolveSessionWorktree(join("odd", "tasks", "jpg-png-converter.md"), f.inner);
+	assert.equal(fromInnerCwd?.root, f.inner);
+	// The outer repo is still resolvable for its own files.
+	const outerFile = join(f.outer, "README.md");
+	writeFileSync(outerFile, "outer\n");
+	assert.equal(resolveSessionWorktree("README.md", f.outer)?.root, f.outer);
+});

package/tests/shell-bar.test.ts

@@ -2,17 +2,19 @@ import assert from "node:assert/strict";
 import test from "node:test";
 import { visibleWidth } from "@earendil-works/pi-tui";
 import {
+	buildShellHeaderModel,
 	formatCost,
 	formatTokens,
 	gaugeTone,
 	renderGauge,
 	renderShellBar,
+	renderShellHeaderBar,
+	renderShellHeaderRule,
 	renderShellSidebarBar,
 	shellEnabled,
 	type ShellBarModel,
 	type ShellBarTheme,
 } from "../lib/shell-bar.ts";
-import { parseNanQuota } from "../lib/shell-usage.ts";
 
 // The Gentle Shell bar replaces pi's three-line footer with one line of
 // segments. Rendering is pure so it can be verified without a TUI.
@@ -53,28 +55,6 @@ function model(overrides: Partial<ShellBarModel> = {}): ShellBarModel {
 	};
 }
 
-// The grouped NaN fixture the panel test uses, so both surfaces are asserted
-// against the same payload, the same order and the same percentages.
-const GROUPED_NAN_QUOTA = {
-	periodEnd: "2026-10-01T00:00:00.000Z",
-	models: [
-		{ model: "glm5.3-flash", cap: 2_000_000_000, tokensUsed: 200_000_000 },
-		{ model: "glm5.3", cap: 3_000_000_000, tokensUsed: 0, periodEnd: "2026-10-17T05:53:20.000Z" },
-		{ model: "glm5.2", cap: 3_000_000_000, tokensUsed: 0, periodEnd: "2026-10-17T05:53:20.000Z" },
-		{ model: "deepseek-v4-flash", cap: 3_000_000_000, tokensUsed: 300_000_000 },
-	],
-};
-
-// The sidebar prints the card body between its borders; the Usage rows are the
-// metered block between the Usage heading and Integrations, minus the context
-// meter, which is not a subscription allowance.
-function sidebarUsageRows(lines: string[]): string[] {
-	const body = lines.filter((line) => line.startsWith("│ ")).map((line) => line.slice(2, -2).trim());
-	const start = body.indexOf("Usage");
-	const end = body.indexOf("Integrations");
-	return body.slice(start + 1, end).filter((line) => /[▰▱]/.test(line) && !line.startsWith("Context"));
-}
-
 test("renderGauge fills cells proportionally to the percentage", () => {
 	assert.equal(renderGauge(45, 8), "▰▰▰▰▱▱▱▱");
 	assert.equal(renderGauge(0, 8), "▱▱▱▱▱▱▱▱");
@@ -158,57 +138,9 @@ test("renderShellBar meters the model the session is using inside a multi-model
 	assert.doesNotMatch(glm, /deepseek-v4-flash ▰/);
 	const [other] = renderShellBar(model({ modelId: "deepseek-v4-flash", usage }), plainTheme, 200);
 	assert.match(other, /deepseek-v4-flash ▰▱▱▱▱▱▱▱ 18%$/);
-	const sidebar = renderShellSidebarBar(model({ modelId: "glm5.3-flash", usage }), plainTheme, 60).join("\n");
-	assert.match(sidebar, /glm5\.3-flash +▰▱▱▱▱▱▱▱ +10%/, "the sidebar lists the session model's own allowance");
-});
-
-// The sidebar is the surface that never needs opening, so a provider with
-// per-model allowances shows the panel's model rows there too — most consumed
-// family first, its models inside it — and leaves the aggregate totals and the
-// reset dates to the bar and the panel.
-test("sidebar groups the NaN allowances by subscription without totals or resets", () => {
-	const usage = parseNanQuota(GROUPED_NAN_QUOTA, 0);
-	const lines = renderShellSidebarBar(model({ modelId: "glm5.3-flash", usage }), plainTheme, 60);
-	const rows = sidebarUsageRows(lines);
-	assert.deepEqual(rows.map((row) => row.replace(/\s*[▰▱].*$/, "")), ["deepseek-v4-flash", "glm5.3-flash"]);
-	assert.deepEqual(rows.map((row) => Number.parseInt(row.match(/(\d+)%$/)![1] ?? "", 10)), [10, 10]);
-	assert.equal(rows.some((row) => / 0%$/.test(row)), false, "a window that consumed nothing only spends space");
-	assert.equal(lines.join("\n").includes("total"), false, "an aggregate row only costs space");
-	assert.equal(lines.join("\n").includes("resets in"), false, "the reset dates belong to the panel");
-	for (const width of [24, 46, 60]) {
-		assert.ok(renderShellSidebarBar(model({ usage }), plainTheme, width).every((line) => visibleWidth(line) <= width));
-	}
 });
 
-test("sidebar treats one metered NaN allowance as a per-model provider", () => {
-	const usage = parseNanQuota({
-		periodEnd: "2026-10-01T00:00:00.000Z",
-		models: [{ model: "glm5.3-flash", cap: 2_000_000_000, tokensUsed: 400_000_000, windowHours: 4, windowTokens: 400_000_000, windowTokensUsed: 120_000_000, windowResetsAt: 1_788_620_161 }],
-	}, 0);
-	const lines = renderShellSidebarBar(model({ modelId: "glm5.3-flash", usage }), plainTheme, 60);
-	const rows = sidebarUsageRows(lines).map((row) => row.replace(/\s+/g, " "));
-	// A single allowance is still the panel's rows, not the bar's one-line meter:
-	// the rolling window it reports is a row of its own here too, and the reset
-	// stays in the panel.
-	assert.deepEqual(rows, ["glm5.3-flash ▰▰▱▱▱▱▱▱ 20%", "glm5.3-flash 4h ▰▰▱▱▱▱▱▱ 30%"]);
-	assert.equal(lines.join("\n").includes("resets in"), false);
-});
-
-test("sidebar keeps one aggregate line for a provider without raw allowances", () => {
-	const usage = {
-		provider: "openai-codex",
-		plan: "pro",
-		fetchedAt: 0,
-		limits: [{ name: "codex", limitReached: false, windows: [
-			{ label: "5h", usedPercent: 62, windowSeconds: 18_000, resetAt: null },
-			{ label: "week", usedPercent: 31, windowSeconds: 604_800, resetAt: null },
-		] }],
-	};
-	const lines = renderShellSidebarBar(model({ usage }), plainTheme, 60);
-	assert.deepEqual(sidebarUsageRows(lines), ["codex 5h ▰▰▰▰▰▱▱▱ 62% · week 31%"]);
-});
-
-test("sidebar drops an aggregate allowance that consumed nothing", () => {
+test("renderShellBar keeps its own zero-window contract independent of the sidebar", () => {
 	const usage = {
 		provider: "openai-codex",
 		plan: "pro",
@@ -218,58 +150,9 @@ test("sidebar drops an aggregate allowance that consumed nothing", () => {
 			{ label: "week", usedPercent: 0, windowSeconds: 604_800, resetAt: null },
 		] }],
 	};
-	const lines = renderShellSidebarBar(model({ usage }), plainTheme, 60);
-	assert.deepEqual(sidebarUsageRows(lines), []);
-	const text = lines.join("\n");
-	assert.match(text, /Usage/);
-	assert.match(text, /Context/);
-	assert.match(text, /Cost/);
-	// The bar keeps its own contract: only the sidebar gives zero rows the boot.
 	assert.match(renderShellBar(model({ usage }), plainTheme, 200)[0], /codex 5h ▱▱▱▱▱▱▱▱ 0% · week 0%$/);
 });
 
-test("sidebar keeps the Usage group when nothing was consumed", () => {
-	const usage = parseNanQuota({
-		periodEnd: "2026-10-01T00:00:00.000Z",
-		models: [
-			{ model: "glm5.3", cap: 3_000_000_000, tokensUsed: 0 },
-			{ model: "glm5.2", cap: 3_000_000_000, tokensUsed: 0 },
-		],
-	}, 0);
-	const lines = renderShellSidebarBar(model({ usage }), plainTheme, 60);
-	const text = lines.join("\n");
-	assert.deepEqual(sidebarUsageRows(lines), []);
-	assert.match(text, /Usage/);
-	assert.match(text, /Context/);
-	assert.match(text, /Cost/);
-	assert.match(text, /Integrations/);
-});
-
-test("sidebar hides exactly the rows that would print 0%, rounding included", () => {
-	// The row's own rounding is the only threshold: a fraction below half a
-	// percent is a 0% row and leaves; half a percent keeps its row and prints 1%.
-	const usage = (usedPercent: number) => ({
-		provider: "openai-codex",
-		plan: "pro",
-		fetchedAt: 0,
-		limits: [{ name: "codex", limitReached: false, windows: [{ label: "5h", usedPercent, windowSeconds: 18_000, resetAt: null }] }],
-	});
-	assert.deepEqual(sidebarUsageRows(renderShellSidebarBar(model({ usage: usage(0.4) }), plainTheme, 60)), []);
-	assert.deepEqual(sidebarUsageRows(renderShellSidebarBar(model({ usage: usage(0.5) }), plainTheme, 60)), ["codex 5h ▱▱▱▱▱▱▱▱ 1%"]);
-});
-
-test("sidebar reads a limit without windows as nothing to draw, not as zero consumption", () => {
-	const usage = {
-		provider: "openai-codex",
-		plan: "pro",
-		fetchedAt: 0,
-		limits: [{ name: "codex", limitReached: false, windows: [] }],
-	};
-	const lines = renderShellSidebarBar(model({ usage }), plainTheme, 60);
-	assert.deepEqual(sidebarUsageRows(lines), []);
-	assert.match(lines.join("\n"), /Cost/);
-});
-
 test("renderShellBar shows an unknown context as a question mark after compaction", () => {
 	const [line] = renderShellBar(model({ contextPercent: null }), plainTheme, 160);
 	assert.match(line, /ctx ▱▱▱▱▱▱▱▱ \?%/);
@@ -326,13 +209,20 @@ test("shellEnabled honors GENTLE_PI_SHELL=0", () => {
 	assert.equal(shellEnabled({ GENTLE_PI_SHELL: "false" }), false);
 });
 
-test("sidebar unifies project, captured changes, usage and integrations in one frame", () => {
+test("renderShellSidebarBar paints the Status card frame with border and the title with accent", () => {
+	const lines = renderShellSidebarBar(model(), taggedTheme, 46);
+	assert.match(lines[0], /^<border>╭<\/border>/);
+	assert.match(lines[0], /<accent>✿ Status<\/accent>/);
+	assert.match(lines[lines.length - 1], /^<border>╰<\/border>/);
+});
+
+test("sidebar unifies project, captured changes and integrations in one frame", () => {
 	const data = model({ changes: { files: 2, added: 7, deleted: 3, notice: "capture warning" }, statuses: ["MCP connected"] });
 	const lines = renderShellSidebarBar(data, plainTheme, 46);
 	const text = lines.join("\n");
 	assert.equal(lines.filter((line) => line.startsWith("╭")).length, 1);
 	let previous = -1;
-	for (const heading of ["Status", "Project", "Changes", "Usage", "Integrations"]) {
+	for (const heading of ["Status", "Project", "Changes", "Integrations"]) {
 		const index = text.indexOf(heading);
 		assert.ok(index > previous, heading);
 		previous = index;
@@ -340,7 +230,7 @@ test("sidebar unifies project, captured changes, usage and integrations in one f
 	assert.match(text, /2 files.*\+7.*−3/);
 	assert.match(text, /capture warning/);
 	assert.match(text, /\/gentle:changes/);
-	assert.match(text, /gpt-5\.5/);
+	assert.match(text, /main/);
 	for (const width of [1, 8, 24, 46]) assert.ok(renderShellSidebarBar(data, plainTheme, width).every((line) => visibleWidth(line) <= width));
 	const empty = renderShellSidebarBar(model(), plainTheme, 46).join("\n");
 	assert.match(empty, /No captured changes/);
@@ -359,3 +249,189 @@ test("sidebar profile wraps long names without changing the compact bar", () =>
 	}
 	assert.deepEqual(renderShellBar(active, plainTheme, 120), renderShellBar(base, plainTheme, 120));
 });
+
+test("sidebar Status card drops Model, Effort, Context, Cost and Usage, keeping Project, Changes and Integrations", () => {
+	const usage = {
+		provider: "openai-codex",
+		plan: "pro",
+		fetchedAt: 0,
+		limits: [{ name: "codex", limitReached: false, windows: [{ label: "5h", usedPercent: 62, windowSeconds: 18_000, resetAt: null }] }],
+	};
+	const data = model({ profile: "team", sessionName: "session", usage, changes: { files: 1, added: 2, deleted: 1 }, statuses: ["MCP connected"] });
+	const text = renderShellSidebarBar(data, plainTheme, 60).join("\n");
+	assert.doesNotMatch(text, /Usage/);
+	assert.doesNotMatch(text, /Model/);
+	assert.doesNotMatch(text, /Effort/);
+	assert.doesNotMatch(text, /Context/);
+	assert.doesNotMatch(text, /Cost/);
+	assert.doesNotMatch(text, /\$9\.49/);
+	assert.doesNotMatch(text, /codex 5h/);
+	for (const heading of ["Status", "Project", "Changes", "Integrations"]) assert.match(text, new RegExp(heading));
+	assert.match(text, /Branch.*main/);
+	assert.match(text, /Session.*session/);
+	assert.match(text, /Profile.*team/);
+});
+
+// The live header row above the fullscreen rail: identity on the left (brand,
+// location, model · effort · profile), the per-frame counters right-aligned
+// (context gauge, cost). Never the working/thinking state or extension
+// statuses — those stay in the prompt and the Status card.
+
+test("buildShellHeaderModel keeps only the header's fields from the bar model", () => {
+	const header = buildShellHeaderModel(model({ profile: "team", statuses: ["MCP: 3 servers"] }));
+	assert.deepEqual(header, {
+		cwd: "~/work/gentle-pi",
+		branch: "main",
+		dirty: undefined,
+		modelId: "gpt-5.5",
+		effort: "medium",
+		profile: "team",
+		contextPercent: 45,
+		costTotal: 9.49,
+		subscription: true,
+		usage: undefined,
+	});
+	assert.ok(!("statuses" in header), "extension statuses never reach the header");
+});
+
+test("renderShellHeaderBar draws the brand, identity, and right-aligned counters (plus the standing usage segment) in one line", () => {
+	const header = buildShellHeaderModel(model({ profile: "team" }));
+	const { text: line } = renderShellHeaderBar(header, plainTheme, 120);
+	const left = "✿ Gentle Shell ⟡ ~/work/gentle-pi main ⟡ gpt-5.5 · medium · team";
+	const right = "ctx ▰▰▰▰▱▱▱▱ 45% ⟡ $9.49 sub ⟡ usage";
+	assert.equal(line, left + " ".repeat(120 - visibleWidth(left) - visibleWidth(right)) + right);
+	assert.equal(visibleWidth(line), 120);
+});
+
+test("renderShellHeaderBar never shows working state or extension statuses", () => {
+	const header = buildShellHeaderModel(model({ statuses: ["MCP: 3 servers", "working…"] }));
+	const { text: line } = renderShellHeaderBar(header, plainTheme, 120);
+	assert.doesNotMatch(line, /MCP: 3 servers/);
+	assert.doesNotMatch(line, /working/);
+});
+
+test("renderShellHeaderBar colors the brand bold and by role", () => {
+	const bolding = { fg: (color: string, text: string) => `<${color}>${text}</${color}>`, bold: (text: string) => `**${text}**` };
+	const header = buildShellHeaderModel(model());
+	const { text: line } = renderShellHeaderBar(header, bolding, 120);
+	assert.match(line, /<accent>\*\*✿ Gentle Shell\*\*<\/accent>/);
+});
+
+test("renderShellHeaderBar drops the profile, then the effort, then the whole location before the right group", () => {
+	const withProfile = buildShellHeaderModel(model({ profile: "team" }));
+	const { text: wide } = renderShellHeaderBar(withProfile, plainTheme, 120);
+	assert.match(wide, /gpt-5\.5 · medium · team/);
+	assert.match(wide, /~\/work\/gentle-pi main/);
+	assert.match(wide, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub ⟡ usage$/);
+
+	// 100 cols: the profile no longer fits, but effort and location still do.
+	const { text: noProfile } = renderShellHeaderBar(withProfile, plainTheme, 100);
+	assert.doesNotMatch(noProfile, /team/);
+	assert.match(noProfile, /gpt-5\.5 · medium/);
+	assert.match(noProfile, /~\/work\/gentle-pi main/);
+	assert.equal(visibleWidth(noProfile), 100);
+
+	// 90 cols: effort goes too, only the bare model id remains next to location.
+	const { text: noEffort } = renderShellHeaderBar(withProfile, plainTheme, 90);
+	assert.doesNotMatch(noEffort, /medium/);
+	assert.doesNotMatch(noEffort, /team/);
+	assert.match(noEffort, /gpt-5\.5/);
+	assert.match(noEffort, /~\/work\/gentle-pi main/);
+	assert.equal(visibleWidth(noEffort), 90);
+
+	// 82 cols: the whole location segment goes; brand and model survive with the counters.
+	const { text: noLocation } = renderShellHeaderBar(withProfile, plainTheme, 82);
+	assert.doesNotMatch(noLocation, /~\/work\/gentle-pi/);
+	assert.match(noLocation, /gpt-5\.5/);
+	assert.match(noLocation, /✿ Gentle Shell/);
+	assert.match(noLocation, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub ⟡ usage$/);
+	assert.equal(visibleWidth(noLocation), 82);
+
+	// 60 cols: even the standing usage segment is gone now; brand+model and ctx/cost survive.
+	const { text: noUsage } = renderShellHeaderBar(withProfile, plainTheme, 60);
+	assert.doesNotMatch(noUsage, /~\/work\/gentle-pi/);
+	assert.doesNotMatch(noUsage, /usage/);
+	assert.match(noUsage, /gpt-5\.5/);
+	assert.match(noUsage, /✿ Gentle Shell/);
+	assert.match(noUsage, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub$/);
+	assert.equal(visibleWidth(noUsage), 60);
+});
+
+test("renderShellHeaderBar returns an empty string only once the brand itself cannot fit", () => {
+	assert.equal(renderShellHeaderBar(buildShellHeaderModel(model()), plainTheme, 3).text, "");
+	assert.match(renderShellHeaderBar(buildShellHeaderModel(model()), plainTheme, 40).text, /✿ Gentle Shell/);
+});
+
+// T8: the usage segment. It rides after cost in the right group, shows every
+// window of the active provider's main limit, and degrades (gauges, then
+// secondary windows, then the whole segment) before ctx/cost is ever touched.
+
+const USAGE_TWO_WINDOWS = {
+	provider: "openai-codex",
+	plan: "pro",
+	fetchedAt: 0,
+	limits: [{ name: "codex", limitReached: false, windows: [
+		{ label: "5h", usedPercent: 26, windowSeconds: 18_000, resetAt: null },
+		{ label: "week", usedPercent: 12, windowSeconds: 604_800, resetAt: null },
+	] }],
+};
+
+test("renderShellHeaderBar shows every usage window with its gauge and the shortcut hint, after cost", () => {
+	const header = buildShellHeaderModel(model({ usage: USAGE_TWO_WINDOWS }));
+	const { text, usageSpan } = renderShellHeaderBar(header, plainTheme, 140, "alt+u");
+	assert.match(text, /\$9\.49 sub ⟡ usage 5h ▰▰▱▱▱▱▱▱ 26% · week ▰▱▱▱▱▱▱▱ 12% · alt\+u$/);
+	assert.ok(usageSpan);
+	assert.equal(text.slice(usageSpan.start, usageSpan.end), "usage 5h ▰▰▱▱▱▱▱▱ 26% · week ▰▱▱▱▱▱▱▱ 12% · alt+u");
+});
+
+test("renderShellHeaderBar shows 'usage · <shortcut>' with no data, and drops the hint when the shortcut is disabled", () => {
+	const withHint = renderShellHeaderBar(buildShellHeaderModel(model({ usage: undefined })), plainTheme, 140, "alt+u");
+	assert.match(withHint.text, /usage · alt\+u$/);
+	const noHint = renderShellHeaderBar(buildShellHeaderModel(model({ usage: undefined })), plainTheme, 140, undefined);
+	assert.match(noHint.text, /usage$/);
+	assert.doesNotMatch(noHint.text, /alt\+u/);
+});
+
+test("renderShellHeaderBar degrades the usage segment (gauges, then secondary windows, then the whole segment) before touching ctx/cost", () => {
+	const header = buildShellHeaderModel(model({ usage: USAGE_TWO_WINDOWS }));
+	const full = renderShellHeaderBar(header, plainTheme, 140, "alt+u").text;
+	assert.match(full, /5h ▰▰▱▱▱▱▱▱ 26% · week ▰▱▱▱▱▱▱▱ 12%/);
+
+	// 100 cols: the gauges no longer fit, but both windows still show as text
+	// (a positive match on the bare "5h 26% · week 12%" run rules out any
+	// gauge glyph sneaking in between them; ctx's own gauge is unrelated).
+	const noGauges = renderShellHeaderBar(header, plainTheme, 100, "alt+u").text;
+	assert.match(noGauges, /usage 5h 26% · week 12% · alt\+u$/);
+	assert.match(noGauges, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub/, "ctx/cost are untouched while usage still degrades");
+	assert.equal(visibleWidth(noGauges), 100);
+
+	// 80 cols: only the first window remains.
+	const primaryOnly = renderShellHeaderBar(header, plainTheme, 80, "alt+u").text;
+	assert.match(primaryOnly, /usage 5h 26% · alt\+u$/);
+	assert.doesNotMatch(primaryOnly, /week/);
+	assert.match(primaryOnly, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub/);
+	assert.equal(visibleWidth(primaryOnly), 80);
+
+	// 70 cols: the whole usage segment is gone, ctx/cost remain intact.
+	const noUsage = renderShellHeaderBar(header, plainTheme, 70, "alt+u").text;
+	assert.doesNotMatch(noUsage, /usage/);
+	assert.match(noUsage, /ctx ▰▰▰▰▱▱▱▱ 45% ⟡ \$9\.49 sub$/);
+	assert.equal(visibleWidth(noUsage), 70);
+});
+
+test("renderShellHeaderBar's usage span always points at the usage text, not ctx/cost", () => {
+	const header = buildShellHeaderModel(model({ usage: USAGE_TWO_WINDOWS }));
+	for (const width of [140, 100, 90]) {
+		const { text, usageSpan } = renderShellHeaderBar(header, plainTheme, width, "alt+u");
+		if (!usageSpan) continue;
+		assert.match(text.slice(usageSpan.start, usageSpan.end), /^usage/);
+		assert.equal(usageSpan.end, visibleWidth(text), "the usage segment always ends at the right edge");
+	}
+});
+
+test("renderShellHeaderRule paints one full-width line in the editor frame color", () => {
+	assert.equal(renderShellHeaderRule(taggedTheme, 4), "<border>────</border>", "the rule uses the editor frame's border role");
+	assert.equal(renderShellHeaderRule(plainTheme, 12), "─".repeat(12), "the rule spans the full width");
+	assert.equal(renderShellHeaderRule(plainTheme, 0), "");
+	assert.equal(renderShellHeaderRule(plainTheme, -3), "", "negative widths clamp to an empty rule");
+});

package/tests/shell-card.test.ts

@@ -54,10 +54,12 @@ test("renderCard collapses to the frame and the first body line with an expand h
 });
 
 test("renderCard uses the card tone across the full frame while preserving content roles", () => {
+	// INFO paints the rose frame: the rounded border in the plain border role,
+	// the title in accent — the same look every sidebar card already used.
 	const info = renderCard(card(), taggedTheme, 80, { expanded: true });
-	assert.match(info[0], /^<customMessageLabel>╭<\/customMessageLabel><customMessageLabel>─ <\/customMessageLabel><customMessageLabel>✿ Gentle AI<\/customMessageLabel> <muted>·<\/muted> <muted>review preflight<\/muted><customMessageLabel> ─+<\/customMessageLabel><customMessageLabel>╮<\/customMessageLabel>$/);
-	assert.match(info[1], /^<customMessageLabel>│<\/customMessageLabel> <text>.*<customMessageLabel>│<\/customMessageLabel>$/);
-	assert.match(info[info.length - 1], /^<customMessageLabel>╰<\/customMessageLabel><customMessageLabel>─+╯<\/customMessageLabel>$/);
+	assert.match(info[0], /^<border>╭<\/border><border>─ <\/border><accent>✿ Gentle AI<\/accent> <muted>·<\/muted> <muted>review preflight<\/muted><border> ─+<\/border><border>╮<\/border>$/);
+	assert.match(info[1], /^<border>│<\/border> <text>.*<border>│<\/border>$/);
+	assert.match(info[info.length - 1], /^<border>╰<\/border><border>─+╯<\/border>$/);
 
 	const warning = renderCard(card({ tone: CARD_TONE.WARNING, subtitle: undefined }), taggedTheme, 80, { expanded: true });
 	assert.match(warning[0], /^<warning>╭<\/warning>/);

package/tests/shell-changes-view.test.ts

@@ -62,6 +62,30 @@ function mouseButton(type: TuiMouseEvent["type"], button: TuiMouseEvent["button"
 	return { type, button, x, y, screenX: x, screenY: y, width: 80, height, shift: false, alt: false, ctrl: false };
 }
 
+// H1 (odd/tasks/usage-click-and-changes-attribution.md): the same shared
+// hover role every other clickable surface uses, and it never overrides the
+// already-selected row's own role.
+test("WorktreeChangesView paints the shared hover role over an unselected row, never the selected one", async () => {
+	const trees = ["/main", "/linked"].map((root) => ({ root, branch: root === "/main" ? "main" : undefined, model: changesModel([file("same.ts", 1, 0)]) }));
+	const component = new WorktreeChangesView(trees, {
+		theme: taggedTheme, rows: 10,
+		loadDiff: async () => "",
+		onOpen: () => {},
+		onClose: () => {}, requestRender() {}, onRefresh() {},
+	});
+	component.render(80);
+	// Row y=1 is the selected group header (/main, index 0); row y=2 is /linked's header.
+	const hoverOther = component.handleMouse(mouseButton("move", "none", 3, 2, 10));
+	assert.deepEqual(hoverOther, { handled: true, render: true });
+	assert.match(component.render(80)[2]!, /<warning>[^<]*detached/, "hovering the unselected row paints the shared hover role");
+	assert.doesNotMatch(component.render(80)[1]!, /<warning>/, "the selected row keeps its own role");
+
+	const hoverSelected = component.handleMouse(mouseButton("move", "none", 3, 1, 10));
+	assert.deepEqual(hoverSelected, { handled: true, render: true });
+	assert.doesNotMatch(component.render(80)[1]!, /<warning>/, "hovering the selected row still never paints the hover role");
+	assert.doesNotMatch(component.render(80)[2]!, /<warning>/, "leaving the other row clears its hover");
+});
+
 test("worktree accordion keeps groups and nested files beside a framed lazy diff", async () => {
 	const trees = ["/main", "/linked"].map((root) => ({ root, branch: root === "/main" ? "main" : undefined, model: changesModel([file("same.ts", 1, 0)]) }));
 	const loaded: string[] = [];
@@ -503,6 +527,29 @@ test("ChangesView opens the selected file and closes on escape or q", async () =
 	assert.equal(events.filter((event) => event === "close").length, 2);
 });
 
+// H1 (odd/tasks/usage-click-and-changes-attribution.md): the same shared
+// hover role every other clickable surface uses, and it never overrides the
+// already-selected row's own role.
+test("ChangesView paints the shared hover role over an unselected file row, never the selected one", async () => {
+	const { view: component } = view({ theme: taggedTheme });
+	await settle();
+	component.render(80);
+	// Row y=1 is the selected file (lib/a.ts, index 0); row y=2 is lib/b.ts.
+	const hoverOther = component.handleMouse(mouseButton("move", "none", 3, 2, 12));
+	assert.deepEqual(hoverOther, { handled: true, render: true });
+	assert.match(component.render(80)[2]!, /<warning>[^<]*lib\/b\.ts/, "the hovered, unselected row paints the shared hover role");
+	assert.doesNotMatch(component.render(80)[1]!, /<warning>/, "the selected row keeps its own role instead");
+
+	const hoverSelected = component.handleMouse(mouseButton("move", "none", 3, 1, 12));
+	assert.deepEqual(hoverSelected, { handled: true, render: true });
+	assert.doesNotMatch(component.render(80)[1]!, /<warning>/, "hovering the selected row still never paints the hover role");
+	assert.doesNotMatch(component.render(80)[2]!, /<warning>/, "leaving lib/b.ts clears its hover paint");
+
+	const left = component.handleMouse(mouseButton("move", "none", 60, 1, 12)); // outside the list pane entirely
+	assert.deepEqual(left, { handled: true, render: true });
+	assert.doesNotMatch(component.render(80).join("\n"), /<warning>/, "moving off the list clears any hover");
+});
+
 test("ChangesView click selects a file without opening it", async () => {
 	const { view: component, events } = view();
 	await settle();