@xingular/harness 2.0.0 → 2.0.1-unstable

package/dist/sdk/terminal/tui/pages/trajectoryPage.js

@@ -0,0 +1,490 @@
+import { matchesKey, stripTerminalSequences, truncateToWidth, visibleWidth, wrapTextWithAnsi } from '@earendil-works/pi-tui';
+import { FilterList } from "../list.js";
+import { stripMouseReports } from "../mouseReport.js";
+import { formatWorkingDuration } from "../workingStatus.js";
+const ACTIVE = new Set(['queued', 'running', 'waiting_for_approval', 'waiting_for_input']);
+const payloadOf = (event) => event.payload && typeof event.payload === 'object' ? event.payload : {};
+const stringOf = (value) => typeof value === 'string' ? value : undefined;
+const numberOf = (value) => typeof value === 'number' && Number.isFinite(value) ? value : undefined;
+function safe(value) {
+    return stripTerminalSequences(stripMouseReports(value)).replace(/[\x00-\x08\x0b-\x1f\x7f]/g, ' ');
+}
+function timeOf(value) {
+    const parsed = Date.parse(value);
+    return Number.isFinite(parsed) ? new Date(parsed).toLocaleTimeString() : value;
+}
+function eventDescription(event) {
+    const payload = payloadOf(event);
+    switch (event.type) {
+        case 'message.completed':
+        case 'message.delta':
+            return `${stringOf(payload.role) ?? 'message'}: ${stringOf(payload.text)?.replace(/\s+/g, ' ').slice(0, 90) ?? ''}`;
+        case 'tool.started':
+        case 'tool.completed':
+            return `${stringOf(payload.name) ?? 'tool'}${stringOf(payload.summary) ? ` · ${stringOf(payload.summary)}` : ''}`;
+        case 'tool.refused':
+            return `${stringOf(payload.name) ?? 'tool'} refused${stringOf(payload.code) ? ` (${stringOf(payload.code)})` : ''}${stringOf(payload.reason) ? ` · ${stringOf(payload.reason)}` : ''}`;
+        case 'usage.updated': {
+            const request = payload.request && typeof payload.request === 'object' ? payload.request : {};
+            return `${stringOf(request.model) ?? stringOf(payload.model) ?? 'model'} · request ${numberOf(request.index) ?? numberOf(payload.requests) ?? '?'} · ${numberOf(request.durationMs) ?? 0} ms`;
+        }
+        case 'status.changed': {
+            const status = stringOf(payload.status) ?? 'status update';
+            const reason = status === 'interrupted' ? stringOf(payload.reason) || stringOf(payload.code) : undefined;
+            return `${status}${reason ? ` · ${reason}` : ''}`;
+        }
+        case 'retry.started':
+        case 'retry.ended':
+            return `attempt ${numberOf(payload.attempt) ?? 1}${stringOf(payload.error) ? ` · ${stringOf(payload.error)}` : ''}`;
+        case 'compaction.started':
+        case 'compaction.ended':
+            return stringOf(payload.reason) ?? 'context compaction';
+        case 'extension.notice':
+            return stringOf(payload.text) ?? 'extension notice';
+        case 'context.snapshot':
+            return 'Recorded prompt and tool definitions';
+        case 'failed':
+            return stringOf(payload.message) ?? stringOf(payload.code) ?? 'run failed';
+        case 'heartbeat':
+            return heartbeatDescription(payload);
+        default:
+            return stringOf(payload.text) ?? stringOf(payload.name) ?? '';
+    }
+}
+/** A beat proves the process lives; what it was inside tells a wait from a wedge. */
+function heartbeatDescription(payload) {
+    const tools = Array.isArray(payload.activeTools) ? payload.activeTools.filter((name) => typeof name === 'string') : [];
+    const oldest = numberOf(payload.oldestToolMs);
+    return tools.length ? `${tools.join(', ')}${oldest === undefined ? '' : ` ${formatWorkingDuration(oldest)}`}` : 'no tool running';
+}
+function usageLine(events) {
+    const event = [...events].reverse().find(item => item.type === 'usage.updated');
+    if (!event)
+        return 'Usage not recorded';
+    const payload = payloadOf(event);
+    const tokens = (name) => numberOf(payload[name])?.toLocaleString() ?? '—';
+    const cost = numberOf(payload.costUsd);
+    const requests = numberOf(payload.requests);
+    return `Input ${tokens('inputTokens')} · Output ${tokens('outputTokens')} · Cache read ${tokens('cacheReadTokens')} · ${requests ?? 0} requests · ${cost === undefined ? 'cost —' : `$${cost.toFixed(4)}`}`;
+}
+function durationLine(run) {
+    const start = Date.parse(run.startedAt);
+    const end = run.endedAt ? Date.parse(run.endedAt) : Date.now();
+    if (!Number.isFinite(start) || !Number.isFinite(end))
+        return run.startedAt;
+    return `${((Math.max(0, end - start)) / 1000).toFixed(1)} s · ${timeOf(run.startedAt)}`;
+}
+const bySequence = (left, right) => left.sequence - right.sequence;
+const SECTIONS = [
+    { id: 'runs', title: 'Runs' },
+    { id: 'events', title: 'Events' }
+];
+export class TrajectoryPage {
+    options;
+    presentation = 'fullscreen';
+    runs = [];
+    section = 'runs';
+    runList;
+    eventList;
+    runIndex = 0;
+    run;
+    events = [];
+    detailOffset = 0;
+    listStart = 0;
+    listEnd = 0;
+    listWidth = 0;
+    detailsStart = -1;
+    wideLayout = false;
+    loading = false;
+    loaded = false;
+    disposed = false;
+    timer;
+    error;
+    constructor(options) {
+        this.options = options;
+        this.runList = new FilterList({
+            theme: options.theme, search: 'always', noun: ['run', 'runs'], empty: 'No runs recorded for this native session yet',
+            onActivate: row => { if (row.data)
+                void this.selectRun(row.data); }
+        });
+        this.eventList = new FilterList({
+            theme: options.theme, search: 'always', noun: ['event', 'events'], empty: 'No recorded events',
+            onActivate: () => { this.detailOffset = 0; this.options.changed(); }
+        });
+    }
+    get selectedRunId() { return this.run?.id; }
+    get selectedEvent() { return this.eventList.selected?.data; }
+    get focused() { return this.section === 'runs' ? this.runList.focused : this.eventList.focused; }
+    set focused(value) { this.runList.focused = value; this.eventList.focused = value; }
+    tabs() { return SECTIONS; }
+    activeTab() { return this.section; }
+    activate() {
+        if (this.disposed)
+            return;
+        if (!this.loaded)
+            void this.load();
+        this.timer ??= setInterval(() => { void this.refresh(); }, 2_000);
+        this.timer.unref?.();
+    }
+    deactivate() {
+        clearInterval(this.timer);
+        this.timer = undefined;
+    }
+    dispose() {
+        this.disposed = true;
+        this.deactivate();
+    }
+    async load() {
+        this.loading = true;
+        this.options.changed();
+        try {
+            this.runs = await this.options.runs();
+            this.runList.setRows(this.runRows());
+            const at = this.options.initialRunId ? this.runs.findIndex(run => run.id === this.options.initialRunId) : 0;
+            if (this.options.initialRunId && at < 0)
+                throw new Error('Run not found in this native session');
+            this.runIndex = Math.max(0, at);
+            const selected = this.runs[this.runIndex];
+            if (selected) {
+                this.runList.select(selected.id);
+                await this.open(selected);
+                if (this.options.initialRunId)
+                    this.section = 'events';
+            }
+            this.error = undefined;
+        }
+        catch (error) {
+            if (!this.disposed) {
+                this.error = error instanceof Error ? error.message : String(error);
+                if (this.options.initialRunId)
+                    this.section = 'events';
+            }
+        }
+        finally {
+            this.loaded = true;
+            this.loading = false;
+            if (!this.disposed)
+                this.options.changed();
+        }
+    }
+    async open(run) {
+        const snapshot = await this.options.read(run.id);
+        if (this.disposed || this.runs[this.runIndex]?.id !== run.id)
+            return;
+        this.run = snapshot.run;
+        this.events = snapshot.events.slice().sort(bySequence);
+        this.eventList.setRows(this.eventRows());
+        const latest = this.events.at(-1);
+        if (latest)
+            this.eventList.select(String(latest.sequence));
+        this.runList.select(run.id);
+        this.detailOffset = 0;
+    }
+    async refresh() {
+        if (this.disposed || this.loading || !this.run || !ACTIVE.has(this.run.status))
+            return;
+        this.loading = true;
+        const lastSequence = this.events.at(-1)?.sequence;
+        const selectedBefore = this.selectedEvent;
+        const followedLatest = !selectedBefore || selectedBefore.sequence === lastSequence;
+        try {
+            const snapshot = await this.options.read(this.run.id, lastSequence);
+            if (this.disposed)
+                return;
+            this.run = snapshot.run;
+            this.runs = this.runs.map(run => run.id === snapshot.run.id ? snapshot.run : run);
+            this.runList.setRows(this.runRows());
+            if (lastSequence === undefined)
+                this.events = snapshot.events.slice().sort(bySequence);
+            else {
+                const existing = new Set(this.events.map(event => event.sequence));
+                this.events = [...this.events, ...snapshot.events.filter(event => !existing.has(event.sequence))].sort(bySequence);
+            }
+            this.eventList.setRows(this.eventRows());
+            if (followedLatest) {
+                const latest = this.events.at(-1);
+                if (latest)
+                    this.eventList.select(String(latest.sequence));
+            }
+            else if (selectedBefore)
+                this.eventList.select(String(selectedBefore.sequence));
+            this.error = undefined;
+        }
+        catch (error) {
+            if (!this.disposed)
+                this.error = error instanceof Error ? error.message : String(error);
+        }
+        finally {
+            this.loading = false;
+            if (!this.disposed)
+                this.options.changed();
+        }
+    }
+    /** `[` is the older run, `]` the newer one. */
+    runRows() {
+        return this.runs.map(run => ({
+            id: run.id,
+            label: run.id,
+            detail: run.status + ' · ' + timeOf(run.startedAt),
+            group: run.mode,
+            searchText: run.id + ' ' + run.status + ' ' + (run.goal ?? ''),
+            data: run
+        }));
+    }
+    eventRows() {
+        // A long wait is dozens of identical beats; they fold into one row that shows how long it went on.
+        const rows = [];
+        let beats = [];
+        const flush = () => {
+            const last = beats.at(-1);
+            if (!last)
+                return;
+            const count = beats.length > 1 ? `×${beats.length} · ` : '';
+            const detail = count + safe(eventDescription(last));
+            rows.push({ id: String(last.sequence), label: `${timeOf(last.timestamp)}  ${last.type}`, detail, searchText: `${last.timestamp} ${last.type} ${detail}`, data: last });
+            beats = [];
+        };
+        for (const event of this.events) {
+            if (event.type === 'heartbeat') {
+                beats.push(event);
+                continue;
+            }
+            flush();
+            rows.push({
+                id: String(event.sequence),
+                label: `${timeOf(event.timestamp)}  ${event.type}`,
+                detail: safe(eventDescription(event)),
+                searchText: `${event.timestamp} ${event.type} ${safe(eventDescription(event))} ${safe(JSON.stringify(payloadOf(event)))}`,
+                data: event
+            });
+        }
+        flush();
+        return rows;
+    }
+    eventJson(event) {
+        return JSON.stringify({ payload: event.payload, type: event.type, sequence: event.sequence, timestamp: event.timestamp }, null, 2);
+    }
+    async selectRun(run) {
+        const at = this.runs.findIndex(candidate => candidate.id === run.id);
+        if (at < 0 || this.loading)
+            return;
+        this.runIndex = at;
+        this.runList.select(run.id);
+        this.run = run;
+        this.events = [];
+        this.eventList.setRows([]);
+        this.detailOffset = 0;
+        this.error = undefined;
+        this.loading = true;
+        this.options.changed();
+        try {
+            await this.open(run);
+            this.section = 'events';
+        }
+        catch (error) {
+            if (!this.disposed)
+                this.error = error instanceof Error ? error.message : String(error);
+        }
+        finally {
+            this.loading = false;
+            if (!this.disposed)
+                this.options.changed();
+        }
+    }
+    async changeRun(direction) {
+        const next = this.runIndex + direction;
+        if (next < 0 || next >= this.runs.length || this.loading)
+            return;
+        this.runIndex = next;
+        this.run = this.runs[next];
+        this.runList.select(this.run.id);
+        this.events = [];
+        this.eventList.setRows([]);
+        this.detailOffset = 0;
+        this.error = undefined;
+        this.loading = true;
+        this.options.changed();
+        try {
+            await this.open(this.runs[next]);
+        }
+        catch (error) {
+            if (!this.disposed)
+                this.error = error instanceof Error ? error.message : String(error);
+        }
+        finally {
+            this.loading = false;
+            if (!this.disposed)
+                this.options.changed();
+        }
+    }
+    hint() {
+        return this.section === 'runs'
+            ? '↑/↓ runs · type to search · Enter inspect'
+            : '[ ] runs · ↑/↓ events · type to search · PgUp/PgDn details · Shift+C copy · Ctrl+O context';
+    }
+    handleMouse(event) {
+        if (event.type === 'wheel') {
+            const down = (event.wheelDelta ?? 1) >= 0;
+            if (this.section === 'events' && this.detailsStart >= 0 && (this.wideLayout ? event.x >= this.listWidth + 3 : event.y >= this.detailsStart)) {
+                this.detailOffset = Math.max(0, this.detailOffset + (down ? 4 : -4));
+                this.options.changed();
+                return { handled: true, render: true };
+            }
+            if (this.section === 'runs')
+                this.runList.handleInput(down ? '\x1b[B' : '\x1b[A');
+            else
+                this.eventList.handleInput(down ? '\x1b[B' : '\x1b[A');
+            this.detailOffset = 0;
+            this.options.changed();
+            return { handled: true, render: true };
+        }
+        if (event.type === 'click' && event.button !== 'left')
+            return undefined;
+        if (event.type !== 'click' && event.type !== 'move')
+            return undefined;
+        if (this.section === 'runs') {
+            if (event.y < this.listStart || event.y >= this.listEnd)
+                return undefined;
+            return this.runList.handleMouse({ ...event, y: event.y - this.listStart });
+        }
+        if (event.y < this.listStart || event.y >= this.listEnd || (this.wideLayout && event.x >= this.listWidth + 3))
+            return undefined;
+        return this.eventList.handleMouse({ ...event, y: event.y - this.listStart });
+    }
+    handleInput(data) {
+        if (matchesKey(data, 'tab') || matchesKey(data, 'shift+tab')) {
+            const at = SECTIONS.findIndex(section => section.id === this.section);
+            const delta = matchesKey(data, 'shift+tab') ? -1 : 1;
+            this.section = SECTIONS[(at + delta + SECTIONS.length) % SECTIONS.length].id;
+            return true;
+        }
+        if (matchesKey(data, 'ctrl+o') && this.run) {
+            this.options.openContext?.(this.run.id);
+            return true;
+        }
+        if (this.section === 'runs')
+            return this.runList.handleInput(data);
+        if (data === '[') {
+            void this.changeRun(1);
+            return true;
+        }
+        if (data === ']') {
+            void this.changeRun(-1);
+            return true;
+        }
+        if (matchesKey(data, 'pageUp')) {
+            this.detailOffset = Math.max(0, this.detailOffset - 8);
+            return true;
+        }
+        if (matchesKey(data, 'pageDown')) {
+            this.detailOffset += 8;
+            return true;
+        }
+        if (data === 'C' && this.selectedEvent) {
+            const text = this.eventJson(this.selectedEvent);
+            void this.options.copy(text).then(() => this.options.notify('Copied selected trajectory event')).catch(error => this.options.notify(String(error), 'error'));
+            return true;
+        }
+        const selected = this.selectedEvent?.sequence;
+        if (!this.eventList.handleInput(data))
+            return false;
+        if (this.selectedEvent?.sequence !== selected)
+            this.detailOffset = 0;
+        return true;
+    }
+    runSummary(width, rows) {
+        if (!this.run || rows < 1)
+            return [];
+        const runPosition = `${this.runIndex + 1}/${this.runs.length}`;
+        const modelEvent = [...this.events].reverse().find(event => event.type === 'usage.updated');
+        const usage = modelEvent ? payloadOf(modelEvent) : {};
+        const model = stringOf(usage.model) ?? 'model unavailable';
+        const theme = this.options.theme();
+        const lines = [theme.bold(theme.fg('accent', `Run ${runPosition} · ${this.run.id} · ${this.run.status}${this.loading ? ' · loading' : ''}`))];
+        if (rows >= 3)
+            lines.push(theme.fg('muted', `${model} · ${durationLine(this.run)} · ${this.run.mode}`));
+        if (rows >= 4)
+            lines.push(theme.fg('muted', usageLine(this.events)));
+        if (rows >= 6)
+            lines.push(theme.fg('dim', this.run.goal ? `Prompt: ${safe(this.run.goal).replace(/\s+/g, ' ').slice(0, 140)}` : 'Prompt text unavailable'));
+        if (this.error)
+            lines.push(theme.fg('error', `Read error: ${this.error}`));
+        return lines.slice(0, Math.min(rows, 5)).map(line => truncateToWidth(line, width, ''));
+    }
+    detailLines(width, rows) {
+        if (rows < 1)
+            return [];
+        const event = this.selectedEvent;
+        const theme = this.options.theme();
+        const heading = theme.bold(theme.fg('accent', event ? `Event JSON · ${event.type} · #${event.sequence}` : 'Event JSON'));
+        const json = event
+            ? wrapTextWithAnsi(safe(this.eventJson(event)), Math.max(1, width))
+            : [this.events.length ? 'No event selected' : this.loading ? 'Loading recorded events…' : 'No recorded events'];
+        const visibleRows = Math.max(0, rows - 1);
+        this.detailOffset = Math.min(this.detailOffset, Math.max(0, json.length - visibleRows));
+        return [heading, ...json.slice(this.detailOffset, this.detailOffset + visibleRows)
+                .map(line => this.options.theme().fg('dim', line))].slice(0, rows).map(line => truncateToWidth(line, width, ''));
+    }
+    render(width, rows) {
+        const theme = this.options.theme();
+        if (width < 1 || rows < 1)
+            return [];
+        if (this.section === 'runs') {
+            this.wideLayout = false;
+            this.detailsStart = -1;
+            if (this.error && !this.runs.length)
+                return [theme.fg('error', 'Read error: ' + this.error)];
+            const lines = [theme.fg('dim', !this.loaded ? 'Loading recorded runs…' : `${this.runs.length} recorded runs`)];
+            this.listStart = lines.length;
+            const list = this.runList.render(width, Math.max(0, rows - lines.length));
+            this.listEnd = this.listStart + list.length;
+            lines.push(...list);
+            return lines.slice(0, rows).map(line => truncateToWidth(line, width, ''));
+        }
+        if (!this.run) {
+            this.listStart = this.listEnd = 0;
+            this.detailsStart = -1;
+            if (this.error)
+                return [theme.fg('error', 'Read error: ' + this.error)];
+            return [theme.fg('dim', this.loading || !this.loaded ? 'Loading recorded runs…' : 'No run selected. Choose a run in the Runs tab.')];
+        }
+        const lines = this.runSummary(width, rows);
+        const bodyRows = Math.max(0, rows - lines.length);
+        const wide = width >= 72;
+        this.wideLayout = wide;
+        if (wide) {
+            const separatorWidth = 3;
+            const leftWidth = Math.max(24, Math.floor((width - separatorWidth) * 0.42));
+            const rightWidth = Math.max(1, width - leftWidth - separatorWidth);
+            const paneStart = lines.length;
+            this.listWidth = leftWidth;
+            const events = [theme.bold(theme.fg('accent', 'Events')), ...this.eventList.render(leftWidth, Math.max(0, bodyRows - 1))];
+            const details = this.detailLines(rightWidth, bodyRows);
+            this.listStart = paneStart + 1;
+            this.listEnd = this.listStart + events.length - 1;
+            this.detailsStart = paneStart;
+            const pane = Array.from({ length: Math.max(events.length, details.length) }, (_, index) => {
+                const left = truncateToWidth(events[index] ?? '', leftWidth, '');
+                const gap = ' '.repeat(Math.max(0, leftWidth - visibleWidth(left)));
+                return left + gap + theme.fg('dim', ' │ ') + (details[index] ?? '');
+            });
+            lines.push(...pane);
+        }
+        else {
+            lines.push(theme.bold(theme.fg('accent', 'Events')));
+            this.listStart = lines.length;
+            this.listWidth = width;
+            const listRows = Math.min(Math.max(0, bodyRows - 1), Math.max(1, Math.floor(bodyRows * 0.58)));
+            const events = this.eventList.render(width, listRows);
+            this.listEnd = this.listStart + events.length;
+            lines.push(...events);
+            const hasRoomForDetails = lines.length < rows;
+            if (hasRoomForDetails)
+                lines.push('');
+            this.detailsStart = lines.length;
+            const detailRows = Math.max(0, rows - lines.length);
+            lines.push(...this.detailLines(width, detailRows));
+        }
+        return lines.slice(0, rows).map(line => truncateToWidth(line, width, ''));
+    }
+}

package/dist/sdk/terminal/tui/pages/usagePage.d.ts

@@ -0,0 +1,45 @@
+import type { Theme } from '@earendil-works/pi-coding-agent';
+import type { UsagePeriod } from "../../../usage/types.js";
+import type { TabInfo } from "../chrome.js";
+import type { TerminalPage } from "../page.js";
+type UsageTab = 'analysis' | 'limits' | 'accounts';
+interface UsagePageOptions {
+    theme(): Theme;
+    call(method: string, params?: Record<string, unknown>): Promise<unknown>;
+    changed(): void;
+    initialTab?: UsageTab;
+    initialPeriod?: UsagePeriod;
+}
+export declare class UsagePage implements TerminalPage {
+    private readonly options;
+    presentation: "fullscreen";
+    focused: boolean;
+    private tab;
+    private period;
+    private scope;
+    private summary?;
+    private limitsSummary?;
+    private limits?;
+    private allLimits?;
+    private busy;
+    private reloadPending;
+    private error?;
+    private refreshLimits;
+    private offset;
+    private scrollRows;
+    private maxOffset;
+    private disposed;
+    constructor(options: UsagePageOptions);
+    tabs(): readonly TabInfo[];
+    activeTab(): string;
+    selectTab(id: string): void;
+    hint(): string;
+    activate(): void;
+    dispose(): void;
+    private load;
+    handleInput(data: string): boolean;
+    private analysisContent;
+    private limitsContent;
+    render(width: number, rows: number): string[];
+}
+export {};