@oh-my-pi/pi-tui 18.4.0 → 18.4.2

package/src/overlays/rewind-selector.ts

@@ -21,8 +21,9 @@
  * active column when a strip is open), Left/Right slide between branch
  * variants at a fork and jump between user turns elsewhere, `f` opens a
  * filter (typing narrows the current path to matching items; Esc leaves the
- * filter with the selection kept), Enter rewinds to the outlined item, Esc
- * cancels.
+ * filter with the selection kept), Enter rewinds to the outlined item, A loads
+ * earlier turns without changing selection (stepping above the oldest replayed
+ * turn loads them too), Esc cancels.
  */
 import type { AgentTool } from "@oh-my-pi/pi-agent-core";
 import {
@@ -36,7 +37,7 @@ import {
 	truncateToWidth,
 } from "../index";
 import type { MessageRenderer } from "../chat/extension-types";
-import type { TranscriptEntryLike as TranscriptEntry } from "../chat/transcript-entry";
+import { recentTranscriptEntries, type TranscriptEntryLike as TranscriptEntry } from "../chat/transcript-entry";
 import { theme } from "../theme/theme";
 import { matchesAppToolsExpand, matchesSelectCancel, matchesSelectDown, matchesSelectUp } from "../keybinding-matchers";
 import { ChatTranscriptBuilder } from "../chat/chat-transcript-builder";
@@ -116,6 +117,10 @@ export class RewindSelectorComponent implements Component {
 	#slide: { from: number; to: number; startedAt: number } | undefined;
 	#slideTimer: NodeJS.Timeout | undefined;
 
+	/** Whole branch; the selector may currently replay only its tail. */
+	#entries: TranscriptEntry[];
+	/** True while older history is still unreplayed. */
+	#truncated = false;
 	/** Filter query while the filter prompt is open; undefined shows the full transcript. */
 	#filter: string | undefined;
 	/** Main transcript rows from the last frame; the filter matches what is on screen. */
@@ -127,8 +132,10 @@ export class RewindSelectorComponent implements Component {
 		entries: TranscriptEntry[],
 		private readonly deps: RewindSelectorDeps,
 	) {
-		this.#builder = this.#newBuilder();
-		this.#targets = appendOutlineEntries(this.#builder, entries);
+		this.#entries = entries;
+		const tail = recentTranscriptEntries(entries);
+		this.#truncated = tail.length < entries.length;
+		this.#builder = this.#replay(tail);
 		this.#selected = Math.max(0, this.#targets.length - 1);
 		this.#browser = new TranscriptBrowser({
 			getHeight: () => this.deps.ui.terminal?.rows || process.stdout.rows || 40,
@@ -142,7 +149,7 @@ export class RewindSelectorComponent implements Component {
 	}
 
 	#newBuilder(): ChatTranscriptBuilder {
-		return new ChatTranscriptBuilder({
+		const builder = new ChatTranscriptBuilder({
 			ui: this.deps.ui,
 			getTool: this.deps.getTool,
 			isBuiltInTool: this.deps.isBuiltInTool,
@@ -153,6 +160,30 @@ export class RewindSelectorComponent implements Component {
 			linkTargets: this.deps.linkTargets,
 			requestRender: this.deps.requestRender,
 		});
+		builder.setExpanded(this.#expanded);
+		return builder;
+	}
+
+	/** Build a transcript for `entries` and adopt its targets. */
+	#replay(entries: TranscriptEntry[]): ChatTranscriptBuilder {
+		const builder = this.#newBuilder();
+		this.#targets = appendOutlineEntries(builder, entries);
+		return builder;
+	}
+
+	/** Replay the whole branch, keeping the main outline on the same turn. */
+	#loadFullHistory(): void {
+		if (!this.#truncated) return;
+		const selectedId = this.#targets[this.#selected]?.turnId;
+		const previous = this.#builder;
+		this.#builder = this.#replay(this.#entries);
+		previous.dispose();
+		this.#truncated = false;
+		this.#mainVisible = undefined;
+		this.#mainRows = [];
+		const restored = selectedId ? this.#targets.findIndex(target => target.turnId === selectedId) : -1;
+		this.#selected = restored >= 0 ? restored : Math.max(0, this.#targets.length - 1);
+		this.deps.requestRender();
 	}
 
 	invalidate(): void {
@@ -186,7 +217,6 @@ export class RewindSelectorComponent implements Component {
 		for (const sibling of this.deps.siblingPaths(target.turnId)) {
 			if (sibling.entries.length === 0) continue;
 			const builder = this.#newBuilder();
-			builder.setExpanded(this.#expanded);
 			const targets = appendOutlineEntries(builder, sibling.entries);
 			const firstUser = sibling.entries.find(isUserTurnEntry);
 			const label = (firstUser && userTurnLabel(firstUser)) || sibling.rootId;
@@ -257,6 +287,8 @@ export class RewindSelectorComponent implements Component {
 			return;
 		}
 		if (matchesKey(data, "f")) {
+			// The filter must search the whole branch, not just the startup tail.
+			this.#loadFullHistory();
 			this.#filter = "";
 			this.#activeVariant = 0;
 			this.#siblingSelected = 0;
@@ -291,6 +323,10 @@ export class RewindSelectorComponent implements Component {
 			}
 			return;
 		}
+		if (data === "a" || data === "A") {
+			this.#loadFullHistory();
+			return;
+		}
 		if (matchesKey(data, "enter") || matchesKey(data, "return") || data === "\n") {
 			const target = this.#outlinedTarget();
 			if (target) this.deps.onSelect(target.entryId);
@@ -384,15 +420,19 @@ export class RewindSelectorComponent implements Component {
 
 	/**
 	 * Visible main-path target indices whose rendered text contains every
-	 * whitespace-separated query word as a whole word (case-insensitive: `ls`
-	 * matches `ls -la` but not `tools`); all visible targets for an empty query.
+	 * whitespace-separated Latin query word as a whole word (case-insensitive:
+	 * `ls` matches `ls -la` but not `tools`). Other scripts match substrings so
+	 * a Chinese query can find text inside a sentence without spaces.
+	 * All visible targets match an empty query.
 	 * Matching the rendered rows keeps results honest: collapsed tool output
 	 * only matches once Ctrl+O expands it.
 	 */
 	#filterMatches(): number[] {
 		const words = (this.#filter ?? "").toLowerCase().split(/\s+/).filter(Boolean);
-		const patterns = words.map(
-			word => new RegExp(`(?<![\\p{L}\\p{N}_])${RegExp.escape(word)}(?![\\p{L}\\p{N}_])`, "u"),
+		const patterns = words.map(word =>
+			/^[\p{Script=Latin}\p{N}_]+$/u.test(word)
+				? new RegExp(`(?<![\\p{L}\\p{N}_])${RegExp.escape(word)}(?![\\p{L}\\p{N}_])`, "u")
+				: new RegExp(RegExp.escape(word), "u"),
 		);
 		const matches: number[] = [];
 		for (let index = 0; index < this.#targets.length; index++) {
@@ -432,7 +472,10 @@ export class RewindSelectorComponent implements Component {
 		this.#move(delta, () => true);
 	}
 
-	/** Step the main selection by `delta` to the nearest visible target passing `accept`. */
+	/**
+	 * Step the main selection by `delta` to the nearest visible target passing
+	 * `accept`; stepping above the replayed tail loads the earlier history first.
+	 */
 	#move(delta: -1 | 1, accept: (target: OutlineTarget) => boolean): void {
 		let index = this.#selected + delta;
 		while (index >= 0 && index < this.#targets.length) {
@@ -446,6 +489,10 @@ export class RewindSelectorComponent implements Component {
 			}
 			index += delta;
 		}
+		if (delta < 0 && this.#truncated) {
+			this.#loadFullHistory();
+			this.#move(delta, accept);
+		}
 	}
 
 	#isMainSelectable(index: number): boolean {
@@ -492,7 +539,7 @@ export class RewindSelectorComponent implements Component {
 		const upDown = editorKeys("tui.select.up", "tui.select.down");
 		const leftRight = formatKeyHints(["left", "right"]);
 		const lateral = columns.length > 0 ? `${leftRight} branches` : `${leftRight} user turns`;
-		const keys = `${upDown} step  ${lateral}  ${formatKeyHint("f")} filter  ${formatKeyHint("enter")} rewind  ${expandKeyHint()} expand  ${editorKey("tui.select.cancel")} cancel`;
+		const keys = `${upDown} step  ${lateral}  ${formatKeyHint("f")} filter  ${formatKeyHint("enter")} rewind  ${this.#truncated ? `${formatKeyHint("a")} earlier turns  ` : ""}${expandKeyHint()} expand  ${editorKey("tui.select.cancel")} cancel`;
 		return {
 			header: [this.#header()],
 			body: {

package/src/overlays/usage-dashboard.ts

@@ -67,12 +67,19 @@ export interface CardWindowRow {
 	usedText?: string;
 }
 
+/** A connected account whose usage lookup produced no attributable report. */
+export interface UnavailableUsageAccount {
+	provider: string;
+	label: string;
+}
+
 /** Compact per-provider summary backing one card in the subscriptions grid. */
 export interface ProviderCard {
 	provider: string;
 	name: string;
-	/** Number of accounts reporting for this provider. */
+	/** Number of represented accounts, including unavailable usage lookups. */
 	accounts: number;
+	unavailableAccounts: string[];
 	/** Window rows sorted most-pressing first. */
 	windows: CardWindowRow[];
 	/** True when every account reports no limits (e.g. enterprise plans). */
@@ -104,6 +111,15 @@ function aggregateStatus(limits: readonly { status?: UsageLimit["status"] }[]):
 	return "unknown";
 }
 
+/**
+ * Card status when some connected accounts reported no usage: the missing
+ * report raises the card to a warning but never hides an exhausted quota.
+ */
+function statusWithUnavailableAccounts(windows: readonly { status?: UsageLimit["status"] }[]): UsageLimit["status"] {
+	if (windows.length === 0) return "unknown";
+	return aggregateStatus(windows) === "exhausted" ? "exhausted" : "warning";
+}
+
 /** Fraction below which a window counts as untouched (renders as 100% free). */
 const IDLE_FRACTION = 0.005;
 /**
@@ -129,7 +145,11 @@ function compactWindowTag(window: NonNullable<UsageLimit["window"]>): string {
  * most-used account's reset countdown. Cards sort most-pressing first so
  * what's burning is on top-left; fully idle providers collapse into a tick.
  */
-export function buildProviderCards(reports: UsageReport[], nowMs: number): ProviderCard[] {
+export function buildProviderCards(
+	reports: UsageReport[],
+	nowMs: number,
+	unavailableAccounts: readonly UnavailableUsageAccount[] = [],
+): ProviderCard[] {
 	const displayReports = collapseSharedUsageReports(reports);
 	const grouped = new Map<string, UsageReport[]>();
 	for (const report of displayReports) {
@@ -137,9 +157,15 @@ export function buildProviderCards(reports: UsageReport[], nowMs: number): Provi
 		list.push(report);
 		grouped.set(report.provider, list);
 	}
+	for (const account of unavailableAccounts) {
+		if (!grouped.has(account.provider)) grouped.set(account.provider, []);
+	}
 
 	const cards: ProviderCard[] = [];
 	for (const [provider, providerReports] of grouped) {
+		const unavailable = unavailableAccounts
+			.filter(account => account.provider === provider)
+			.map(account => account.label);
 		const buckets = new Map<string, { label: string; limits: UsageLimit[] }>();
 		for (const report of providerReports) {
 			for (const limit of report.limits) {
@@ -220,10 +246,12 @@ export function buildProviderCards(reports: UsageReport[], nowMs: number): Provi
 		cards.push({
 			provider,
 			name: formatProviderName(provider),
-			accounts: providerReports.length,
+			accounts: providerReports.length + unavailable.length,
+			unavailableAccounts: unavailable,
 			windows,
-			unlimited: windows.length === 0,
+			unlimited: windows.length === 0 && unavailable.length === 0,
 			idle:
+				unavailable.length === 0 &&
 				!resetCredits &&
 				daybreakAccounts.length === 0 &&
 				windows.every(window => window.fraction !== undefined && window.fraction < IDLE_FRACTION),
@@ -328,6 +356,7 @@ export function buildHeatmapLayout(points: DailyActivityPoint[], weeks: number,
 /** Callbacks and data sources for {@link UsageDashboardComponent}. */
 export interface UsageDashboardOptions {
 	reports: UsageReport[];
+	unavailableAccounts?: readonly UnavailableUsageAccount[];
 	/**
 	 * Full classic `/usage` report for the expanded detail view; re-invoked per
 	 * terminal width.
@@ -395,7 +424,7 @@ export class UsageDashboardComponent implements Component {
 		ensureThemeSync();
 		this.#options = options;
 		this.#nowMs = Date.now();
-		this.#cards = buildProviderCards(options.reports, this.#nowMs);
+		this.#cards = buildProviderCards(options.reports, this.#nowMs, options.unavailableAccounts);
 		this.#panel = new OverlayPanel("Usage");
 		this.#header = new PanelRows();
 		this.#header.setHeight(1);
@@ -464,7 +493,12 @@ export class UsageDashboardComponent implements Component {
 
 	#renderCardLines(card: ProviderCard, width: number, labels: string[][], layout: CardRowLayout): string[] {
 		const lines: string[] = [];
-		const cardStatus = card.unlimited ? "ok" : aggregateStatus(card.windows);
+		const cardStatus =
+			card.unavailableAccounts.length > 0
+				? statusWithUnavailableAccounts(card.windows)
+				: card.unlimited
+					? "ok"
+					: aggregateStatus(card.windows);
 		const accountsText = card.accounts > 1 ? theme.fg("dim", `${card.accounts} accts`) : "";
 		const titleBudget = width - 2 - visibleWidth(accountsText) - (accountsText ? 1 : 0);
 		const title = theme.bold(truncateToWidth(card.name, Math.max(4, titleBudget)));
@@ -495,6 +529,13 @@ export class UsageDashboardComponent implements Component {
 			}
 		}
 
+		for (const account of card.unavailableAccounts) {
+			const text = sanitizeDisplayLine(`${account} — usage unavailable`);
+			for (const line of wrapTextWithAnsi(text, Math.max(1, width - 2))) {
+				lines.push(`  ${theme.fg("dim", line)}`);
+			}
+		}
+
 		if (card.unlimited) {
 			lines.push(`  ${theme.fg("dim", "no limits")}`);
 			return lines;

package/src/prompt/composer-attachments.ts

@@ -50,9 +50,12 @@ const SKILL_ICONS = [...new Set(Object.values(SYMBOL_PRESETS).map(m => m["icon.e
 /** Skill names as they appear in chips: word characters and dashes, dots only between segments. */
 const SKILL_NAME_SOURCE = "[\\w-]+(?:\\.[\\w-]+)*";
 
-const SKILL_CHIP_SOURCE = `(?:${SKILL_ICONS.map(icon =>
-	/^[a-z]+$/i.test(icon) ? `(?<![A-Za-z])${RegExp.escape(icon)}` : RegExp.escape(icon),
-).join("|")}) (${SKILL_NAME_SOURCE})(?![\\w-])`;
+/** Regex source for a chip glyph; word glyphs (ASCII preset) must not continue a preceding word. */
+function glyphSource(icon: string): string {
+	return /^[a-z]+$/i.test(icon) ? `(?<![A-Za-z])${RegExp.escape(icon)}` : RegExp.escape(icon);
+}
+
+const SKILL_CHIP_SOURCE = `(?:${SKILL_ICONS.map(glyphSource).join("|")}) (${SKILL_NAME_SOURCE})(?![\\w-])`;
 
 /**
  * Replaces `/skill:<name>` tokens for known skills with compact chip labels and
@@ -96,11 +99,16 @@ export function collapseModelMentions(
 
 const CHIP_ICON_KEY = { image: "chip.image", video: "chip.video", paste: "chip.paste" } as const;
 
+/** Chip glyph the active theme renders for `kind`, including `symbols.overrides`. */
+function activeChipIcon(kind: ChipKind): string {
+	return typeof theme === "undefined"
+		? SYMBOL_PRESETS.unicode[CHIP_ICON_KEY[kind]]
+		: theme.symbol(CHIP_ICON_KEY[kind]);
+}
+
 /** Compact atomic composer token for attachment `n` in the active symbol preset. */
 export function chipLabel(kind: ChipKind, n: number): string {
-	const icon =
-		typeof theme === "undefined" ? SYMBOL_PRESETS.unicode[CHIP_ICON_KEY[kind]] : theme.symbol(CHIP_ICON_KEY[kind]);
-	return `${icon} #${n}`;
+	return `${activeChipIcon(kind)} #${n}`;
 }
 
 /** Every glyph a chip token may start with, across all symbol presets. */
@@ -111,7 +119,7 @@ const CHIP_ICONS: Record<ChipKind, readonly string[]> = {
 };
 
 const CHIP_TOKEN_SOURCE = `(?:${[...CHIP_ICONS.image, ...CHIP_ICONS.video, ...CHIP_ICONS.paste]
-	.map(icon => (/^[a-z]+$/i.test(icon) ? `(?<![A-Za-z])${RegExp.escape(icon)}` : RegExp.escape(icon)))
+	.map(glyphSource)
 	.join("|")}) #[1-9]\\d*`;
 
 /** Infers an attachment kind from a chip label emitted by any configured symbol preset. */
@@ -155,6 +163,45 @@ export const COMPOSER_TOKEN_REGEX = new RegExp(
 	"gu",
 );
 
+/**
+ * Attachment indices referenced by a composer buffer, per kind. Image/video count compact chips
+ * and expanded markers; paste counts compact chips only, since `[Paste #N]` markers number the
+ * base editor's separate paste buffer. Registered labels take precedence over theme glyphs so
+ * tokens created before a theme switch keep their kind; full numbers prevent `#1` matching `#10`.
+ */
+export function referencedAttachments(
+	text: string,
+	recorded: ReadonlyMap<string, ChipKind>,
+): Record<ChipKind, Set<number>> {
+	const kinds: readonly ChipKind[] = ["image", "video", "paste"];
+	const kindByIcon = new Map<string, ChipKind>();
+	for (const kind of kinds) for (const icon of CHIP_ICONS[kind]) kindByIcon.set(icon, kind);
+	for (const kind of kinds) kindByIcon.set(activeChipIcon(kind), kind);
+	const icons = [...kindByIcon.keys()].sort((a, b) => b.length - a.length).map(glyphSource);
+	const labels = [...recorded.keys()].sort((a, b) => b.length - a.length).map(label => RegExp.escape(label));
+	const recordedSource = labels.length > 0 ? labels.join("|") : "(?!)";
+	const scanner = new RegExp(
+		`${PLACEHOLDER_REGEX.source}|(${recordedSource})(?!\\d)|(${icons.join("|")}) #([1-9]\\d*)`,
+		"gu",
+	);
+
+	const refs: Record<ChipKind, Set<number>> = { image: new Set(), video: new Set(), paste: new Set() };
+	for (const match of text.matchAll(scanner)) {
+		if (match[1] === "Image") refs.image.add(Number(match[2]));
+		else if (match[1] === "Video") refs.video.add(Number(match[2]));
+		const label = match[3];
+		if (label !== undefined) {
+			const kind = recorded.get(label);
+			if (kind !== undefined) refs[kind].add(Number(label.slice(label.lastIndexOf("#") + 1)));
+		} else {
+			const icon = match[4];
+			const kind = icon === undefined ? undefined : kindByIcon.get(icon);
+			if (kind !== undefined) refs[kind].add(Number(match[5]));
+		}
+	}
+	return refs;
+}
+
 /** Add the registered model-chip labels to the composer placeholder matcher. */
 export function composerTokenRegex(mentionLabels: Iterable<string>): RegExp {
 	const labels = [...new Set(mentionLabels)].sort((a, b) => b.length - a.length);