@danypops/pi-jittor 0.1.1 → 0.2.1

package/extension/src/context-report.ts

@@ -1,46 +1,60 @@
-import type { ContextSegment, ContextSegmentItem } from "@danypops/jittor";
+import type { ContextSegment } from "@danypops/jittor";
+import { buildContextRows, type ContextSegment as MalevichContextSegment } from "malevich-tui-components";
+import type { ContextBreakdown } from "./context-breakdown.ts";
 
-export interface ContextReportUsage {
-	tokens: number | null;
-	contextWindow: number;
-	percent: number | null;
-}
-
-/** Bounds how many items render per segment -- a report is a scan-at-a-glance summary, not a full dump. */
+/** Bounds how many items render per segment in the plain-text fallback -- a notify-mode report is a scan-at-a-glance summary, not a full dump (the interactive TUI view has no such cap, since it scrolls). */
 const MAX_ITEMS_PER_SEGMENT_LINE = 5;
 
 function formatTokens(tokens: number): string {
 	return tokens >= 1_000 ? `${(tokens / 1_000).toFixed(1)}k` : String(tokens);
 }
 
-function topItems(items: ContextSegmentItem[] | undefined): ContextSegmentItem[] {
-	return [...(items ?? [])].sort((left, right) => right.estimatedTokens - left.estimatedTokens).slice(0, MAX_ITEMS_PER_SEGMENT_LINE);
+function percentOf(part: number, whole: number): string {
+	return whole > 0 ? `${((part / whole) * 100).toFixed(1)}%` : "—";
+}
+
+/** Malevich's row builder is confidence-unaware (it's a generic segment/item shape); folding the tier into the label is how it survives into the rendered row text, e.g. "Active Rules [exact-cooperative]". */
+function withConfidenceLabel(segment: ContextSegment): MalevichContextSegment {
+	const items = [...(segment.items ?? [])]
+		.sort((left, right) => right.estimatedTokens - left.estimatedTokens)
+		.slice(0, MAX_ITEMS_PER_SEGMENT_LINE);
+	return {
+		key: segment.key,
+		label: `${segment.label} [${segment.confidence}]`,
+		estimatedTokens: segment.estimatedTokens,
+		items,
+		unknown: segment.unknown,
+	};
 }
 
 /**
- * Plain-text Context Hub report: real provider-reported usage first (never a character-based
- * estimate when real usage is available, matching Papyrus's own real-vs-estimate honesty
- * accounting), then every segment heaviest-first with an explicit confidence tag
- * (exact-tool/exact-cooperative/correlated/audited) so a reader never mistakes one attribution
- * tier's certainty for another's.
+ * Plain-text Context Hub report (non-TUI fallback): real usage against the model's effective
+ * (reserve-adjusted) budget first -- matching Papyrus's own real-vs-estimate honesty accounting
+ * -- an explicit overshoot warning when the known segments' estimates exceed the real total, then
+ * every segment heaviest-first. Malevich's buildContextRows renders segments in the order given,
+ * so sorting by weight is this function's own policy, not Malevich's.
  */
-export function buildContextReport(segments: readonly ContextSegment[], usage: ContextReportUsage | undefined): string {
+export function buildContextReport(breakdown: ContextBreakdown): string {
 	const lines: string[] = [];
-	if (usage?.tokens !== null && usage?.tokens !== undefined) {
-		const percent = usage.percent !== null && usage.percent !== undefined ? ` (${usage.percent.toFixed(1)}%)` : "";
-		lines.push(`Real usage: ${formatTokens(usage.tokens)} / ${formatTokens(usage.contextWindow)} tokens${percent}`);
+	if (breakdown.totalTokens !== null && breakdown.effectiveBudget !== null) {
+		lines.push(
+			`Real usage: ${formatTokens(breakdown.totalTokens)} / ${formatTokens(breakdown.effectiveBudget)} tokens (${percentOf(breakdown.totalTokens, breakdown.effectiveBudget)} of usable budget)`,
+		);
+	} else if (breakdown.totalTokens !== null) {
+		lines.push(`Real usage: ${formatTokens(breakdown.totalTokens)} tokens (model context window unknown)`);
 	} else {
 		lines.push("Real usage: not yet reported -- sizes below are estimates only");
 	}
-	const sorted = [...segments].sort((left, right) => right.estimatedTokens - left.estimatedTokens);
-	if (sorted.length === 0) {
+	if (breakdown.overshootTokens > 0)
+		lines.push(`Estimates exceed real total by ~${breakdown.overshootTokens} tok -- sizes below are approximate, not exact`);
+
+	const sorted = [...breakdown.segments].sort((left, right) => right.estimatedTokens - left.estimatedTokens).map(withConfidenceLabel);
+	const rows = buildContextRows(sorted, breakdown.totalTokens ?? undefined);
+	if (rows.length === 0) {
 		lines.push("", "(no segments observed yet)");
 		return lines.join("\n");
 	}
 	lines.push("");
-	for (const segment of sorted) {
-		lines.push(`${segment.label} — ${formatTokens(segment.estimatedTokens)} tok [${segment.confidence}]`);
-		for (const item of topItems(segment.items)) lines.push(`  ${formatTokens(item.estimatedTokens)} tok  ${item.label}`);
-	}
+	for (const row of rows) lines.push(row.isHeader ? row.text : `${"  ".repeat(row.depth)}${row.text}`);
 	return lines.join("\n");
 }

package/extension/src/context-view.ts

@@ -0,0 +1,140 @@
+import type { ContextSegment } from "@danypops/jittor";
+import type { ExtensionCommandContext, Theme, ThemeColor } from "@earendil-works/pi-coding-agent";
+import { matchesKey, type TUI, truncateToWidth } from "@earendil-works/pi-tui";
+import {
+	buildContextRows,
+	type ContextBarTheme,
+	type ContextRow,
+	type ContextRowsTheme,
+	type ContextSegment as MalevichContextSegment,
+	renderContextRowLines,
+	renderContextUsageBar,
+} from "malevich-tui-components";
+import type { ContextBreakdown } from "./context-breakdown.ts";
+import { buildContextReport } from "./context-report.ts";
+
+const VISIBLE_ROWS = 24;
+
+/**
+ * A dynamically-contributed segment set (any string key from any extension, not a fixed enum)
+ * can't use a hardcoded per-key color map the way Papyrus's own ContextViewport did for its
+ * fixed seven segments -- this cycles a small categorical palette keyed by a stable hash of the
+ * segment key, so the same key always renders the same color within one process without needing
+ * every possible contributor's key to be known in advance.
+ */
+const PALETTE: ThemeColor[] = ["accent", "success", "syntaxFunction", "warning", "syntaxKeyword", "syntaxType", "muted"];
+
+function paletteColor(key: string): ThemeColor {
+	let hash = 0;
+	for (let index = 0; index < key.length; index += 1) hash = (hash * 31 + key.charCodeAt(index)) >>> 0;
+	return PALETTE[hash % PALETTE.length]!;
+}
+
+function formatTokenCount(tokens: number): string {
+	return tokens >= 1_000 ? `${(tokens / 1_000).toFixed(1)}k` : String(tokens);
+}
+
+function percentOf(part: number, whole: number): string {
+	return whole > 0 ? `${((part / whole) * 100).toFixed(1)}%` : "—";
+}
+
+/** Folds each segment's confidence tier into its label so it survives Malevich's confidence-unaware row builder. */
+function withConfidenceLabel(segment: ContextSegment): MalevichContextSegment {
+	return {
+		key: segment.key,
+		label: `${segment.label} [${segment.confidence}]`,
+		estimatedTokens: segment.estimatedTokens,
+		items: segment.items,
+		unknown: segment.unknown,
+	};
+}
+
+class ContextViewport {
+	private offsetY = 0;
+	private readonly rows: ContextRow[];
+	private readonly segments: readonly MalevichContextSegment[];
+
+	constructor(
+		private readonly tui: TUI,
+		private readonly theme: Theme,
+		private readonly breakdown: ContextBreakdown,
+		private readonly close: () => void,
+	) {
+		// Heaviest-first: Malevich renders segments in the order given, so sorting by weight for a
+		// merged multi-producer view is this viewport's own policy, matching context-report.ts.
+		this.segments = [...breakdown.segments].sort((left, right) => right.estimatedTokens - left.estimatedTokens).map(withConfidenceLabel);
+		this.rows = buildContextRows(this.segments, breakdown.totalTokens ?? undefined);
+	}
+
+	invalidate(): void {}
+
+	render(width: number): string[] {
+		const theme = this.theme;
+		const contentWidth = Math.max(1, width);
+		const border = theme.fg("borderMuted", "─".repeat(contentWidth));
+		const lines: string[] = [border, truncateToWidth(theme.fg("accent", theme.bold("Context")), contentWidth, "")];
+
+		const { totalTokens, effectiveBudget } = this.breakdown;
+		if (totalTokens !== null && effectiveBudget !== null) {
+			lines.push(
+				truncateToWidth(
+					`${formatTokenCount(totalTokens)} / ${formatTokenCount(effectiveBudget)} tokens (${percentOf(totalTokens, effectiveBudget)} of usable budget)`,
+					contentWidth,
+					"",
+				),
+			);
+		} else if (totalTokens !== null) {
+			lines.push(truncateToWidth(`${formatTokenCount(totalTokens)} tokens (model context window unknown)`, contentWidth, ""));
+		} else {
+			lines.push(theme.fg("dim", "No real usage reported yet — sizes below are estimates only"));
+		}
+
+		const colorFor = (key: string) => (s: string) => theme.fg(paletteColor(key), s);
+		const barTheme: ContextBarTheme = { colorFor, empty: (s) => theme.fg("dim", s) };
+		lines.push(renderContextUsageBar(barTheme, this.segments, contentWidth, effectiveBudget ?? undefined, totalTokens ?? undefined));
+		if (this.breakdown.overshootTokens > 0) {
+			lines.push(
+				truncateToWidth(
+					theme.fg(
+						"warning",
+						`Estimates exceed real total by ~${this.breakdown.overshootTokens} tok — sizes below are approximate, not exact`,
+					),
+					contentWidth,
+					"",
+				),
+			);
+		}
+		lines.push("");
+
+		const rowsTheme: ContextRowsTheme = { colorFor, header: (s) => theme.bold(s) };
+		const visible = this.rows.slice(this.offsetY, this.offsetY + VISIBLE_ROWS);
+		lines.push(...renderContextRowLines(visible, contentWidth, rowsTheme));
+		if (this.rows.length === 0) lines.push(theme.fg("dim", "  (nothing observed yet)"));
+		else lines.push(theme.fg("muted", `  ${Math.min(this.offsetY + VISIBLE_ROWS, this.rows.length)}/${this.rows.length}`));
+
+		lines.push("");
+		lines.push(theme.fg("dim", "↑↓ scroll · esc close"));
+		lines.push(border);
+		return lines;
+	}
+
+	handleInput(data: string): void {
+		if (matchesKey(data, "escape") || matchesKey(data, "ctrl+c")) {
+			this.close();
+			return;
+		}
+		if (matchesKey(data, "up")) this.offsetY = Math.max(0, this.offsetY - 1);
+		else if (matchesKey(data, "down")) this.offsetY = Math.min(Math.max(0, this.rows.length - VISIBLE_ROWS), this.offsetY + 1);
+		else return;
+		this.tui.requestRender();
+	}
+}
+
+/** Interactive scrollable Context Hub view in TUI mode; the same plain-text report as /context's non-interactive path otherwise. */
+export async function showContextView(ctx: ExtensionCommandContext, breakdown: ContextBreakdown): Promise<void> {
+	if (ctx.mode !== "tui") {
+		ctx.ui.notify(buildContextReport(breakdown), "info");
+		return;
+	}
+	await ctx.ui.custom<void>((tui, theme, _keybindings, done) => new ContextViewport(tui, theme, breakdown, done));
+}

package/extension/src/footer.ts

@@ -1,13 +1,10 @@
 import { isAbsolute, relative, resolve, sep } from "node:path";
-import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
-import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
-import { ProgressBar } from "malevich-tui-components";
 import {
 	FOOTER_BAR_MAX_WIDTH,
 	FOOTER_BAR_MIN_WIDTH,
+	FOOTER_COMPACTION_BLINK_HALF_PERIOD_MS,
 	FOOTER_CONTEXT_ACCENT_FRACTION,
 	FOOTER_CONTEXT_ERROR_FRACTION,
-	FOOTER_COMPACTION_BLINK_HALF_PERIOD_MS,
 	FOOTER_CONTEXT_WARNING_FRACTION,
 	FOOTER_WIDE_TERMINAL_WIDTH,
 	MILLISECONDS_PER_DAY,
@@ -15,6 +12,9 @@ import {
 	MILLISECONDS_PER_MINUTE,
 	TELEMETRY_STALE_AFTER_MS,
 } from "@danypops/jittor";
+import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
+import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
+import { ProgressBar } from "malevich-tui-components";
 
 type FooterColor = "accent" | "dim" | "warning" | "error";
 
@@ -48,19 +48,21 @@ interface FooterContext {
 }
 
 /** A bounded quota is explicitly remaining; unbounded values never receive a fabricated bar. */
-export type ProviderBudget = {
-	kind: "bounded";
-	label: string;
-	remainingFraction: number;
-	observedAt?: number;
-	resetsAt?: number;
-	resetText?: string;
-} | {
-	kind: "unbounded";
-	label: string;
-	valueText: string;
-	observedAt?: number;
-};
+export type ProviderBudget =
+	| {
+			kind: "bounded";
+			label: string;
+			remainingFraction: number;
+			observedAt?: number;
+			resetsAt?: number;
+			resetText?: string;
+	  }
+	| {
+			kind: "unbounded";
+			label: string;
+			valueText: string;
+			observedAt?: number;
+	  };
 
 export interface CompactionProgress {
 	startedAt: number;
@@ -92,17 +94,25 @@ function footerCwd(cwd: string, home: string | undefined): string {
 	const resolvedCwd = resolve(cwd);
 	const resolvedHome = resolve(home);
 	const relativeToHome = relative(resolvedHome, resolvedCwd);
-	const inside = relativeToHome === "" || (relativeToHome !== ".." && !relativeToHome.startsWith(`..${sep}`) && !isAbsolute(relativeToHome));
+	const inside =
+		relativeToHome === "" || (relativeToHome !== ".." && !relativeToHome.startsWith(`..${sep}`) && !isAbsolute(relativeToHome));
 	if (!inside) return cwd;
 	return relativeToHome === "" ? "~" : `~${sep}${relativeToHome}`;
 }
 
 function sanitize(value: string): string {
-	return value.replace(/[\r\n\t]/g, " ").replace(/ +/g, " ").trim();
+	return value
+		.replace(/[\r\n\t]/g, " ")
+		.replace(/ +/g, " ")
+		.trim();
 }
 
 function usageTotals(context: FooterContext): UsageTotals {
-	let input = 0, output = 0, cacheRead = 0, cacheWrite = 0, cost = 0;
+	let input = 0,
+		output = 0,
+		cacheRead = 0,
+		cacheWrite = 0,
+		cost = 0;
 	for (const entry of context.sessionManager.getEntries()) {
 		if (entry.type !== "message" || entry.message?.role !== "assistant") continue;
 		const usage = entry.message.usage;
@@ -113,7 +123,7 @@ function usageTotals(context: FooterContext): UsageTotals {
 		cost += usage?.cost?.total ?? 0;
 	}
 	const prompt = input + cacheRead + cacheWrite;
-	return { input, output, cacheRead, cacheWrite, cost, ...(prompt > 0 ? { cacheHit: cacheRead / prompt * 100 } : {}) };
+	return { input, output, cacheRead, cacheWrite, cost, ...(prompt > 0 ? { cacheHit: (cacheRead / prompt) * 100 } : {}) };
 }
 
 function barWidth(width: number): number {
@@ -201,7 +211,13 @@ function resetLabel(resetsAt: number | undefined, now: number): string | undefin
  * the segment is omitted entirely rather than showing a placeholder that could never resolve.
  * `null` means not known yet but might resolve, which still earns the `?` placeholder.
  */
-function budgetSegment(budget: ProviderBudget | null | undefined, theme: FooterTheme, width: number, compact: boolean, now: number): string | undefined {
+function budgetSegment(
+	budget: ProviderBudget | null | undefined,
+	theme: FooterTheme,
+	width: number,
+	compact: boolean,
+	now: number,
+): string | undefined {
 	if (budget === undefined) return undefined;
 	const w = barWidth(width);
 	if (!budget) return `budget ${theme.fg("dim", progressBar(null, w))} ?`;
@@ -210,8 +226,8 @@ function budgetSegment(budget: ProviderBudget | null | undefined, theme: FooterT
 	if (budget.kind === "unbounded") return `${budget.label} ${budget.valueText}${staleText}`;
 	const remaining = Math.min(1, Math.max(0, budget.remainingFraction));
 	const bar = theme.fg(fillColor(1 - remaining), progressBar(remaining, w));
-	const value = `${(compact ? Math.round(remaining * 100) : (remaining * 100).toFixed(1))}% left`;
-	const reset = compact ? undefined : resetLabel(budget.resetsAt, now) ?? budget.resetText;
+	const value = `${compact ? Math.round(remaining * 100) : (remaining * 100).toFixed(1)}% left`;
+	const reset = compact ? undefined : (resetLabel(budget.resetsAt, now) ?? budget.resetText);
 	return `${budget.label} ${bar} ${value}${reset ? ` · ${reset}` : ""}${staleText}`;
 }
 
@@ -238,7 +254,12 @@ function repositorySegment(context: FooterContext, footerData: FooterData, theme
 	return theme.fg("dim", cwd);
 }
 
-function modelSegments(context: FooterContext, footerData: FooterData, theme: FooterTheme, thinkingLevel: string): { full: string; compact: string } {
+function modelSegments(
+	context: FooterContext,
+	footerData: FooterData,
+	theme: FooterTheme,
+	thinkingLevel: string,
+): { full: string; compact: string } {
 	const model = context.model;
 	const modelName = theme.bold(model?.id ?? "no-model");
 	const provider = model && footerData.getAvailableProviderCount() > 1 ? `(${model.provider}) ` : "";
@@ -312,7 +333,16 @@ export function installIntegratedFooter(ctx: ExtensionContext, state: Integrated
 		return {
 			invalidate() {},
 			render(width: number): string[] {
-				return renderFooterLines(ctx as unknown as FooterContext, footerData, theme, state.providerBudget, getThinkingLevel(), width, Date.now(), state.compaction);
+				return renderFooterLines(
+					ctx as unknown as FooterContext,
+					footerData,
+					theme,
+					state.providerBudget,
+					getThinkingLevel(),
+					width,
+					Date.now(),
+					state.compaction,
+				);
 			},
 			dispose() {
 				unsubscribe?.();