@bubblebrain-ai/bubble 0.0.13 → 0.0.14

package/dist/tui/run.js

@@ -9,10 +9,11 @@ import { homedir } from "node:os";
 import { AgentAbortError } from "../agent.js";
 import { AgentRunInputQueue } from "../agent/input-controller.js";
 import { debugReasoningStream, summarizeDebugText } from "../reasoning-debug.js";
+import { summarizeAgentEventForTrace, summarizeTraceError, summarizeTraceValue, traceEvent, } from "../debug-trace.js";
 import { BUILTIN_PROVIDERS, decodeModel, displayModel, isUserVisibleProvider } from "../provider-registry.js";
-import { listBuiltinModels } from "../model-catalog.js";
 import { calculateUsageCost } from "../model-pricing.js";
 import { getAvailableThinkingLevels } from "../provider-transform.js";
+import { collectUsageStatsBundle, formatStatsPanelBody } from "../stats/usage.js";
 import { parseSkillInvocation } from "../skills/invocation.js";
 import { registry as slashRegistry } from "../slash-commands/index.js";
 import { sourceRank } from "../slash-commands/unified.js";
@@ -24,6 +25,7 @@ import { markdownInlineSegments } from "./markdown-inline.js";
 import { hashString } from "./render-signature.js";
 import { findToolRenderer } from "./tool-renderers/registry.js";
 import { writeToolKey } from "./tool-renderers/write.js";
+import { discoverModelProviderGroups, getVisibleModelProviders, localModelsForProvider, } from "./model-picker-data.js";
 import { formatWritePreview, isWritePreviewTool } from "./tool-renderers/write-preview.js";
 import { extractStreamingArgsHint } from "./streaming-tool-args.js";
 import { getNextPermissionMode, PERMISSION_MODE_INFO } from "../permission/mode.js";
@@ -396,6 +398,7 @@ function OpenTuiApp(props) {
         redrawProviderDialog();
         redrawApprovalPanel();
         redrawQuestionPanel();
+        redrawStatsPanel();
         redrawFeishuSetupPanel();
         setSidebarTick((tick) => tick + 1);
         renderer.requestRender();
@@ -483,6 +486,7 @@ function OpenTuiApp(props) {
     const [pendingQuestion, setPendingQuestion] = createSignal();
     const [pendingFeedback, setPendingFeedback] = createSignal();
     const [pendingFeishuSetup, setPendingFeishuSetup] = createSignal();
+    let statsPanel;
     const questionSyncTimers = new Set();
     let feishuSetupAbortController;
     let pendingApprovalRef;
@@ -490,6 +494,8 @@ function OpenTuiApp(props) {
     const [approvalOptionIdx, setApprovalOptionIdx] = createSignal(0);
     let picker;
     let providerDialog;
+    let providerDialogModelItems;
+    let providerDialogModelRefreshId = 0;
     let previousPickerForKey;
     let homePromptRef;
     let sessionPromptRef;
@@ -546,6 +552,17 @@ function OpenTuiApp(props) {
     let feedbackPreviewShell;
     let feedbackPreviewText;
     let feedbackFooterText;
+    let statsRoot;
+    let statsPanelBox;
+    let statsTitle;
+    let statsEsc;
+    let statsTab7Box;
+    let statsTab30Box;
+    let statsTab7Text;
+    let statsTab30Text;
+    let statsBodyScroll;
+    let statsBodyText;
+    let statsFooterText;
     let feishuSetupRoot;
     let feishuSetupPanel;
     let feishuSetupTitle;
@@ -713,6 +730,12 @@ function OpenTuiApp(props) {
             feedbackRoot?.focus();
         }, 0);
     }
+    function focusStatsPanel() {
+        setTimeout(() => {
+            if (statsPanel)
+                statsRoot?.focus();
+        }, 0);
+    }
     function focusFeishuSetupPanel() {
         setTimeout(() => {
             const state = pendingFeishuSetup();
@@ -852,7 +875,7 @@ function OpenTuiApp(props) {
             return false;
         return !!event.shift;
     };
-    const canInsertPromptNewline = () => !pendingApproval() && !pendingPlan() && !pendingQuestion() && !pendingFeedback() && !pendingFeishuSetup();
+    const canInsertPromptNewline = () => !pendingApproval() && !pendingPlan() && !pendingQuestion() && !pendingFeedback() && !statsPanel && !pendingFeishuSetup();
     const sidebarFits = () => dimensions().width > SESSION_SIDEBAR_WIDTH + 40;
     const sidebarVisible = () => {
         if (!sessionActive())
@@ -1193,6 +1216,7 @@ function OpenTuiApp(props) {
         switch (request.type) {
             case "bash": return "Bash";
             case "edit": return "Edit";
+            case "patch": return "Patch";
             case "write": return "Write";
             case "lsp": return "Lsp";
         }
@@ -1798,6 +1822,71 @@ function OpenTuiApp(props) {
         }
         return false;
     }
+    function openStatsPanel() {
+        picker = undefined;
+        providerDialog = undefined;
+        redrawProviderDialog();
+        statsPanel = {
+            range: "30d",
+            bundle: collectUsageStatsBundle(),
+        };
+        activePrompt()?.clear();
+        activePrompt()?.blur();
+        promptText = "";
+        syncStatsUI(true);
+    }
+    function closeStatsPanel() {
+        statsPanel = undefined;
+        syncStatsUI(false);
+        restorePromptAfterModal();
+        if (queuedInputCount() > 0)
+            scheduleQueuedInputDrain();
+    }
+    function syncStatsUI(focus = false) {
+        redrawStatsPanel();
+        syncPromptSurfaces();
+        redrawDock();
+        rootBox?.requestRender();
+        scrollbox?.requestRender();
+        if (focus || statsPanel)
+            focusStatsPanel();
+    }
+    function setStatsRange(range) {
+        if (!statsPanel || statsPanel.range === range)
+            return;
+        statsPanel = { ...statsPanel, range };
+        redrawStatsPanel();
+    }
+    function handleStatsKey(event) {
+        if (!statsPanel)
+            return false;
+        const name = keyNameFromEvent(event);
+        if (name === "escape") {
+            closeStatsPanel();
+            event.preventDefault?.();
+            event.stopPropagation?.();
+            return true;
+        }
+        if (name === "left" || name === "h") {
+            setStatsRange("7d");
+            event.preventDefault?.();
+            event.stopPropagation?.();
+            return true;
+        }
+        if (name === "right" || name === "l") {
+            setStatsRange("30d");
+            event.preventDefault?.();
+            event.stopPropagation?.();
+            return true;
+        }
+        if (name === "tab") {
+            setStatsRange(statsPanel.range === "30d" ? "7d" : "30d");
+            event.preventDefault?.();
+            event.stopPropagation?.();
+            return true;
+        }
+        return true;
+    }
     function openFeishuSetup() {
         picker = undefined;
         providerDialog = undefined;
@@ -2048,6 +2137,8 @@ function OpenTuiApp(props) {
             return "question";
         if (pendingFeedback())
             return "feedback";
+        if (statsPanel)
+            return "stats";
         if (providerDialog)
             return "provider";
         if (pendingFeishuSetup())
@@ -2067,6 +2158,8 @@ function OpenTuiApp(props) {
                 return handleQuestionKey(event);
             case "feedback":
                 return handleFeedbackKey(event);
+            case "stats":
+                return handleStatsKey(event);
             case "provider":
                 return handleProviderDialogKey(event);
             case "feishu":
@@ -2084,6 +2177,8 @@ function OpenTuiApp(props) {
         }
         if (owner === "feedback")
             return pendingFeedback()?.stage !== "edit";
+        if (owner === "stats")
+            return true;
         if (owner === "feishu")
             return pendingFeishuSetup()?.kind !== "binding";
         return false;
@@ -2223,14 +2318,14 @@ function OpenTuiApp(props) {
         return currentTranscriptMessages(extra).some((message) => hasRenderableMessage(message, effectiveShowThinking()));
     }
     function isHomeSurfaceActive(extra) {
-        return !hasTranscriptMessages(extra) && !pendingPlan() && !pendingQuestion() && !pendingFeedback() && !pendingFeishuSetup();
+        return !hasTranscriptMessages(extra) && !pendingPlan() && !pendingQuestion() && !pendingFeedback() && !statsPanel && !pendingFeishuSetup();
     }
     function syncPromptSurfaces(focus = false) {
         const homeActive = isHomeSurfaceActive(streamingDisplay);
         const nextSessionActive = !homeActive;
         const surfaceChanged = sessionActive() !== nextSessionActive;
         setSessionActive(nextSessionActive);
-        const modalComposerHidden = !!pendingQuestion() || !!pendingFeedback() || !!pendingFeishuSetup();
+        const modalComposerHidden = !!pendingQuestion() || !!pendingFeedback() || !!statsPanel || !!pendingFeishuSetup();
         if (homeSurfaceShell)
             homeSurfaceShell.visible = homeActive;
         if (homeComposerShell)
@@ -2333,6 +2428,18 @@ function OpenTuiApp(props) {
             redrawTranscriptWithQueuedDisplays();
         return changed;
     }
+    function removeQueuedUserDisplay(displayId) {
+        if (!displayId)
+            return false;
+        const beforeDisplayCount = displayMessages.length;
+        const beforeQueuedCount = queuedDisplayMessages.length;
+        displayMessages = displayMessages.filter((message) => message.clientId !== displayId);
+        queuedDisplayMessages = queuedDisplayMessages.filter((message) => message.clientId !== displayId);
+        const changed = displayMessages.length !== beforeDisplayCount || queuedDisplayMessages.length !== beforeQueuedCount;
+        if (changed)
+            redrawTranscriptWithQueuedDisplays();
+        return changed;
+    }
     function promoteQueuedUserDisplay(displayId, fallbackContent) {
         if (!displayId)
             return false;
@@ -2425,6 +2532,7 @@ function OpenTuiApp(props) {
             || pendingPlan()
             || pendingQuestion()
             || pendingFeedback()
+            || statsPanel
             || providerDialog
             || picker) {
             return;
@@ -2522,6 +2630,10 @@ function OpenTuiApp(props) {
     function cancelActiveAgentRun() {
         if (!activeRun || activeRun.abortController.signal.aborted)
             return false;
+        traceEvent("tui_running_cancel", {
+            runId: activeRun.id,
+            pendingQueuedInputs: queuedInputCount(),
+        }, { surface: "tui" });
         clearRunningCancelHint();
         activeRun.abortController.abort(new AgentAbortError("Agent run cancelled by user."));
         setNotice("Agent run cancelled");
@@ -2556,6 +2668,7 @@ function OpenTuiApp(props) {
         if (!activeRun || activeRun.abortController.signal.aborted)
             return false;
         const shouldCancel = armRunningCancelHint(activeRun);
+        traceKeyRoute(event ? "key" : "raw", name, !shouldCancel ? "armed_cancel" : "confirm_cancel");
         if (!shouldCancel) {
             if (event)
                 preventGlobalKey(event);
@@ -2573,33 +2686,72 @@ function OpenTuiApp(props) {
         if (!isRunning() || activeModalKeyOwner())
             return false;
         queuePromptFromComposer({ notice: "Queued next message" });
+        traceKeyRoute(event ? "key" : "raw", name, "queued_next_message");
         if (event)
             preventGlobalKey(event);
         return true;
     }
+    function traceKeyRoute(source, name, result) {
+        const shouldTrace = result !== "unhandled"
+            || name === "escape"
+            || name === "enter"
+            || name === "tab"
+            || name === "up"
+            || name === "down"
+            || name === "left"
+            || name === "right"
+            || name === "ctrl-c"
+            || !!activeModalKeyOwner()
+            || isRunning();
+        if (!shouldTrace)
+            return;
+        traceEvent("tui_key_route", {
+            source,
+            key: name,
+            result,
+            modalOwner: activeModalKeyOwner(),
+            running: isRunning(),
+            activeRunId: activeRun?.id,
+            pendingApproval: !!pendingApproval(),
+            pendingPlan: !!pendingPlan(),
+            pendingQuestion: !!pendingQuestion(),
+            providerDialog: !!providerDialog,
+            picker: !!picker,
+        }, { surface: "tui" });
+    }
     function routeGlobalRawSequence(sequence) {
         if (isCtrlCSequence(sequence)) {
             void requestExit({ direct: true });
+            traceKeyRoute("raw", "ctrl-c", "exit");
             return true;
         }
         const name = keyNameFromSequence(sequence);
         const modalName = modalKeyNameFromSequence(sequence);
-        if (routeModalRawSequence(sequence))
+        if (routeModalRawSequence(sequence)) {
+            traceKeyRoute("raw", modalName || name, "modal");
             return true;
+        }
         if (routeRunningCancel(name))
             return true;
         if (routeRunningQueue(modalName))
             return true;
-        if (cycleModeFromRawSequence(sequence))
+        if (cycleModeFromRawSequence(sequence)) {
+            traceKeyRoute("raw", name, "mode_cycle");
             return true;
+        }
+        traceKeyRoute("raw", name, "unhandled");
         return false;
     }
     function routeGlobalKeyEvent(event) {
-        if (routeCtrlCExit(event))
+        if (routeCtrlCExit(event)) {
+            traceKeyRoute("key", "ctrl-c", "exit");
             return true;
+        }
         const name = keyNameFromEvent(event);
-        if (routeModalKey(event))
+        if (routeModalKey(event)) {
+            traceKeyRoute("key", name, "modal");
             return true;
+        }
         if (routeRunningCancel(name, event))
             return true;
         if (routeRunningQueue(name, event))
@@ -2609,25 +2761,32 @@ function OpenTuiApp(props) {
         if (event.ctrl && event.shift && name === "m") {
             openMcpReconnectPicker();
             event.preventDefault?.();
+            traceKeyRoute("key", name, "mcp_picker");
             return true;
         }
         if (event.ctrl && name === "t" && !picker) {
             toggleThinkingVisibility();
             event.preventDefault?.();
+            traceKeyRoute("key", name, "toggle_thinking");
             return true;
         }
         if (event.ctrl && name === "o" && !picker) {
             toggleVerboseTrace();
             event.preventDefault?.();
+            traceKeyRoute("key", name, "toggle_verbose_trace");
             return true;
         }
-        if (cycleModeFromKey(event))
+        if (cycleModeFromKey(event)) {
+            traceKeyRoute("key", name, "mode_cycle");
             return true;
+        }
         if (event.ctrl && name === "p" && !picker && !isRunning()) {
             openCommandPalette();
             event.preventDefault?.();
+            traceKeyRoute("key", name, "command_palette");
             return true;
         }
+        traceKeyRoute("key", name, "unhandled");
         return false;
     }
     function transcriptOptions() {
@@ -2739,6 +2898,7 @@ function OpenTuiApp(props) {
         sessionActive();
         syncSidebarChrome();
         redrawQuestionPanel();
+        redrawStatsPanel();
         redrawFeishuSetupPanel();
         scrollbox?.requestRender();
         scheduleTranscriptScrollAfterUpdate(shouldFollow);
@@ -2800,6 +2960,13 @@ function OpenTuiApp(props) {
         dock?.requestRender();
     }
     function openProviderDialog(step = "providers", providerId) {
+        if (step === "models") {
+            providerDialogModelItems = undefined;
+        }
+        else {
+            providerDialogModelRefreshId++;
+            providerDialogModelItems = undefined;
+        }
         const items = providerDialogItemsFor(step, providerId);
         picker = undefined;
         providerDialog = {
@@ -2815,9 +2982,14 @@ function OpenTuiApp(props) {
         redrawDock();
         redrawProviderDialog();
         setTimeout(() => providerDialogInput?.focus(), 0);
+        if (step === "models") {
+            void refreshProviderDialogModelItems(providerId, items);
+        }
     }
     function closeProviderDialog() {
         providerDialog = undefined;
+        providerDialogModelRefreshId++;
+        providerDialogModelItems = undefined;
         providerDialogRoot && (providerDialogRoot.visible = false);
         providerDialogPanel && (providerDialogPanel.visible = false);
         providerDialogRoot?.requestRender();
@@ -2833,6 +3005,9 @@ function OpenTuiApp(props) {
         if (step === "skills")
             return buildSkillItems();
         if (step === "models") {
+            if (providerDialogModelItems?.key === modelPickerCacheKey(providerId)) {
+                return providerDialogModelItems.items;
+            }
             const modelItems = buildPickerItems("model", providerId);
             if (modelItems.length || providerId)
                 return modelItems;
@@ -2843,6 +3018,34 @@ function OpenTuiApp(props) {
         }
         return [];
     }
+    function modelPickerCacheKey(providerId) {
+        return providerId || "__all__";
+    }
+    async function refreshProviderDialogModelItems(providerId, localItems) {
+        const refreshId = ++providerDialogModelRefreshId;
+        const cacheKey = modelPickerCacheKey(providerId);
+        const localPreferredIndex = preferredPickerIndex("model", localItems);
+        try {
+            const remoteItems = await buildRemoteModelPickerItems(providerId);
+            if (refreshId !== providerDialogModelRefreshId)
+                return;
+            if (remoteItems.length === 0)
+                return;
+            const state = providerDialog;
+            if (!state || state.step !== "models" || modelPickerCacheKey(state.providerId) !== cacheKey)
+                return;
+            providerDialogModelItems = { key: cacheKey, items: remoteItems };
+            const remotePreferredIndex = preferredPickerIndex("model", remoteItems);
+            const nextIndex = state.index === localPreferredIndex
+                ? remotePreferredIndex
+                : Math.min(state.index, Math.max(0, remoteItems.length - 1));
+            providerDialog = { ...state, index: nextIndex };
+            redrawProviderDialog();
+        }
+        catch {
+            // Keep the already-rendered local catalog when remote model discovery fails.
+        }
+    }
     function providerDialogFilteredItems(state = providerDialog) {
         if (!state || state.step === "key")
             return [];
@@ -3434,6 +3637,127 @@ function OpenTuiApp(props) {
         feedbackRoot.requestRender();
         feedbackInput?.requestRender();
     }
+    function redrawStatsPanel() {
+        if (!statsRoot)
+            return;
+        const state = statsPanel;
+        if (!state) {
+            statsRoot.visible = false;
+            statsPanelBox && (statsPanelBox.visible = false);
+            statsRoot.requestRender();
+            return;
+        }
+        const terminalWidth = dimensions().width;
+        const terminalHeight = dimensions().height;
+        const width = Math.max(56, Math.min(84, terminalWidth - 4));
+        const bodyWidth = Math.max(48, width - 8);
+        const stats = state.bundle.ranges[state.range];
+        const body = formatStatsPanelBody(stats, bodyWidth);
+        const bodyLines = body.split("\n");
+        const height = Math.min(Math.max(22, bodyLines.length + 7), Math.max(18, terminalHeight - 4));
+        const bodyHeight = Math.max(8, height - 8);
+        statsRoot.visible = true;
+        statsRoot.width = terminalWidth;
+        statsRoot.height = terminalHeight;
+        statsRoot.left = 0;
+        statsRoot.top = 0;
+        statsRoot.backgroundColor = modalBackdropColor();
+        if (statsPanelBox) {
+            statsPanelBox.visible = true;
+            statsPanelBox.width = width;
+            statsPanelBox.height = height;
+            statsPanelBox.left = Math.max(0, Math.floor((terminalWidth - width) / 2));
+            statsPanelBox.top = Math.max(0, Math.floor((terminalHeight - height) / 3));
+            statsPanelBox.backgroundColor = theme.backgroundPanel;
+            statsPanelBox.borderColor = theme.backgroundPanel;
+        }
+        if (statsTitle)
+            statsTitle.content = "Stats";
+        if (statsEsc)
+            statsEsc.content = "esc";
+        syncStatsTab(statsTab7Box, statsTab7Text, state.range === "7d", "7 days");
+        syncStatsTab(statsTab30Box, statsTab30Text, state.range === "30d", "30 days");
+        if (statsBodyText) {
+            statsBodyText.content = statsPanelBodyStyledText(stats, bodyWidth);
+            statsBodyText.width = bodyWidth;
+        }
+        if (statsBodyScroll) {
+            statsBodyScroll.width = bodyWidth;
+            statsBodyScroll.height = bodyHeight;
+            statsBodyScroll.requestRender();
+        }
+        if (statsFooterText) {
+            statsFooterText.content = statsFooterHint(state.range);
+            statsFooterText.width = bodyWidth;
+            statsFooterText.bg = theme.backgroundPanel;
+        }
+        statsPanelBox?.requestRender();
+        statsRoot.requestRender();
+    }
+    function statsFooterHint(range) {
+        return `left/right:range|tab:toggle|esc:close|view:${range}`;
+    }
+    function statsPanelBodyStyledText(stats, width) {
+        const chunks = [];
+        const lines = formatStatsPanelBody(stats, width).split("\n");
+        for (let index = 0; index < lines.length; index += 1) {
+            appendStatsPanelLine(chunks, lines[index]);
+            if (index < lines.length - 1)
+                chunks.push(fg(theme.text)("\n"));
+        }
+        return new StyledText(chunks);
+    }
+    function appendStatsPanelLine(chunks, line) {
+        if (isStatsHeatmapWeekdayLine(line)) {
+            chunks.push(fg(theme.text)(line.slice(0, 5)));
+            appendStatsHeatmapDots(chunks, line.slice(5));
+            return;
+        }
+        if (line.trim() === "Less . o O @ More") {
+            appendStatsHeatmapLegend(chunks, line.length - line.trimStart().length);
+            return;
+        }
+        chunks.push(fg(theme.text)(line));
+    }
+    function isStatsHeatmapWeekdayLine(line) {
+        return /^(Mon|Tue|Wed|Thu|Fri|Sat|Sun)  /.test(line);
+    }
+    function appendStatsHeatmapDots(chunks, text) {
+        const colors = statsHeatmapDotColors();
+        const colorByLevel = {
+            ".": colors[0],
+            o: colors[1],
+            O: colors[2],
+            "@": colors[3],
+        };
+        for (const char of text) {
+            const color = colorByLevel[char];
+            chunks.push(color ? fg(color)("•") : fg(theme.text)(char));
+        }
+    }
+    function appendStatsHeatmapLegend(chunks, indent) {
+        const colors = statsHeatmapDotColors();
+        chunks.push(fg(theme.textMuted)(`${" ".repeat(indent)}Less `));
+        colors.forEach((color, index) => {
+            if (index > 0)
+                chunks.push(fg(theme.textMuted)(" "));
+            chunks.push(fg(color)("•"));
+        });
+        chunks.push(fg(theme.textMuted)(" More"));
+    }
+    function statsHeatmapDotColors() {
+        return isLightTheme()
+            ? ["#D9B98E", "#BE7D37", "#A56218", theme.warning]
+            : ["#6B471D", "#9D6728", "#D18830", theme.warning];
+    }
+    function syncStatsTab(box, text, active, label) {
+        if (box)
+            box.backgroundColor = active ? theme.primary : theme.backgroundElement;
+        if (text) {
+            text.content = label;
+            text.fg = active ? contrastText(theme.primary) : theme.textMuted;
+        }
+    }
     function redrawFeishuSetupPanel() {
         if (!feishuSetupRoot)
             return;
@@ -4340,6 +4664,7 @@ function OpenTuiApp(props) {
             toggleSidebar,
             setSidebarMode: applySidebarMode,
             openFeedback,
+            openStats: openStatsPanel,
         });
         if (!handled)
             return false;
@@ -4518,6 +4843,60 @@ function OpenTuiApp(props) {
             await openPicker(item.after.mode, item.after.providerId);
         }
     }
+    function buildLocalModelPickerItems(providerId) {
+        const groups = getVisibleModelProviders(registry, providerId).map((provider) => ({
+            provider,
+            models: localModelsForProvider(registry, provider),
+        }));
+        return buildModelPickerItemsFromGroups(groups, providerId);
+    }
+    async function buildRemoteModelPickerItems(providerId) {
+        const groups = await discoverModelProviderGroups(registry, providerId);
+        return buildModelPickerItemsFromGroups(groups, providerId);
+    }
+    function buildModelPickerItemsFromGroups(groups, providerId) {
+        const items = [];
+        for (const { provider, models } of groups) {
+            for (const model of models) {
+                const reasoningLevels = getModelPickerReasoningLevels(provider.id, model.id);
+                if (reasoningLevels.length > 0) {
+                    for (const level of reasoningLevels) {
+                        const isCurrent = props.agent.model === `${provider.id}:${model.id}` && props.agent.thinking === level;
+                        items.push({
+                            label: `${model.name} (${level})`,
+                            detail: isCurrent ? "(current)" : undefined,
+                            value: `${provider.id}:${model.id}`,
+                            command: `/model ${provider.id}:${model.id} --reasoning-effort ${level}`,
+                            category: provider.name,
+                            gutter: isCurrent ? "●" : undefined,
+                        });
+                    }
+                    continue;
+                }
+                const isCurrent = props.agent.model === `${provider.id}:${model.id}`;
+                items.push({
+                    label: model.name,
+                    detail: isCurrent ? "(current)" : undefined,
+                    value: `${provider.id}:${model.id}`,
+                    command: `/model ${provider.id}:${model.id}`,
+                    category: provider.name,
+                    gutter: isCurrent ? "●" : undefined,
+                });
+            }
+        }
+        const currentModel = props.agent.model;
+        if (!providerId && currentModel && !items.some((item) => item.value === currentModel)) {
+            items.unshift({
+                label: displayModel(currentModel),
+                detail: "(current)",
+                value: currentModel,
+                command: `/model ${currentModel}`,
+                category: "Recent",
+                gutter: "●",
+            });
+        }
+        return items;
+    }
     function buildPickerItems(kind, providerId) {
         if (kind === "slash")
             return [];
@@ -4526,60 +4905,7 @@ function OpenTuiApp(props) {
         if (kind === "skill")
             return buildSkillItems();
         if (kind === "model") {
-            const items = [];
-            for (const provider of registry.getEnabled()) {
-                if (providerId && provider.id !== providerId)
-                    continue;
-                const customModels = registry.getModelConfig().getCustomModels(provider.id);
-                const builtinProviderId = provider.id === "openai" && provider.authType === "oauth"
-                    ? "openai-codex"
-                    : provider.id;
-                const models = customModels.length > 0
-                    ? customModels
-                    : listBuiltinModels(builtinProviderId).map((model) => ({
-                        id: model.id,
-                        name: model.name,
-                        providerId: provider.id,
-                    }));
-                for (const model of models) {
-                    const reasoningLevels = getModelPickerReasoningLevels(provider.id, model.id);
-                    if (reasoningLevels.length > 0) {
-                        for (const level of reasoningLevels) {
-                            const isCurrent = props.agent.model === `${provider.id}:${model.id}` && props.agent.thinking === level;
-                            items.push({
-                                label: `${model.name} (${level})`,
-                                detail: isCurrent ? "(current)" : undefined,
-                                value: `${provider.id}:${model.id}`,
-                                command: `/model ${provider.id}:${model.id} --reasoning-effort ${level}`,
-                                category: provider.name,
-                                gutter: isCurrent ? "●" : undefined,
-                            });
-                        }
-                        continue;
-                    }
-                    const isCurrent = props.agent.model === `${provider.id}:${model.id}`;
-                    items.push({
-                        label: model.name,
-                        detail: isCurrent ? "(current)" : undefined,
-                        value: `${provider.id}:${model.id}`,
-                        command: `/model ${provider.id}:${model.id}`,
-                        category: provider.name,
-                        gutter: isCurrent ? "●" : undefined,
-                    });
-                }
-            }
-            const currentModel = props.agent.model;
-            if (!providerId && currentModel && !items.some((item) => item.value === currentModel)) {
-                items.unshift({
-                    label: displayModel(currentModel),
-                    detail: "(current)",
-                    value: currentModel,
-                    command: `/model ${currentModel}`,
-                    category: "Recent",
-                    gutter: "●",
-                });
-            }
-            return items;
+            return buildLocalModelPickerItems(providerId);
         }
         if (kind === "provider") {
             return buildProviderConnectItems();
@@ -4761,6 +5087,15 @@ function OpenTuiApp(props) {
         redrawTranscript(undefined, nextMessages);
         const taskStartedAt = Date.now();
         const run = beginAgentRun();
+        traceEvent("tui_agent_run_begin", {
+            runId: run.id,
+            input: summarizeTraceValue(actualInput),
+            displayInput: summarizeTraceValue(displayInput),
+            displayMessages: displayMessages.length,
+            queuedInputs: queuedInputCount(),
+            provider: activeProviderId,
+            model: props.agent.apiModel,
+        }, { surface: "tui" });
         let assistantContent = "";
         let assistantReasoning = "";
         const toolCalls = [];
@@ -4805,6 +5140,14 @@ function OpenTuiApp(props) {
                 abortSignal: run.abortController.signal,
                 inputController: run.inputController,
             })) {
+                traceEvent("tui_agent_event", {
+                    runId: run.id,
+                    event: summarizeAgentEventForTrace(event),
+                    displayMessages: displayMessages.length,
+                    streamingChars: assistantContent.length,
+                    reasoningChars: assistantReasoning.length,
+                    toolCount: toolCalls.length,
+                }, { surface: "tui" });
                 if (event.type === "turn_start") {
                     assistantContent = "";
                     assistantReasoning = "";
@@ -5011,6 +5354,11 @@ function OpenTuiApp(props) {
             if (!runCancelled) {
                 runError = error?.message || String(error);
             }
+            traceEvent("tui_agent_run_error", {
+                runId: run.id,
+                cancelled: runCancelled,
+                error: summarizeTraceError(error),
+            }, { surface: "tui" });
         }
         finally {
             if (pendingStreamingRedrawTimer !== undefined) {
@@ -5020,8 +5368,19 @@ function OpenTuiApp(props) {
             pendingApprovalRef = undefined;
             setPendingApproval(undefined);
             setApprovalOptionIdx(0);
+            traceEvent("tui_agent_run_end", {
+                runId: run.id,
+                cancelled: runCancelled,
+                error: runError,
+                displayMessages: displayMessages.length,
+                queuedInputs: queuedInputCount(),
+            }, { surface: "tui" });
             for (const pendingInput of run.inputController.clear()) {
                 const pendingSteer = removePendingSteerInput(pendingInput.id);
+                if (runCancelled) {
+                    removeQueuedUserDisplay(pendingSteer?.displayId);
+                    continue;
+                }
                 requeueRejectedSteer(pendingInput.content, pendingSteer?.displayId);
             }
             finishAgentRun(run);
@@ -5035,6 +5394,7 @@ function OpenTuiApp(props) {
             else if (runCancelled) {
                 if (!notice())
                     setNotice("Agent run cancelled");
+                displayMessages = reconstructDisplayMessages(props.agent.messages);
                 redrawTranscript();
             }
             else {
@@ -5074,13 +5434,13 @@ function OpenTuiApp(props) {
         return h("box", {
             ref: (ref) => {
                 sessionComposerShell = ref;
-                ref.visible = !isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeedback() && !pendingFeishuSetup();
+                ref.visible = !isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeedback() && !statsPanel && !pendingFeishuSetup();
             },
             width: "100%",
             paddingLeft: 2,
             paddingRight: 2,
             flexShrink: 0,
-            visible: !isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeishuSetup(),
+            visible: !isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !statsPanel && !pendingFeishuSetup(),
         }, renderPrompt({
             ref: (ref) => { sessionPromptRef = ref; },
             focused: !isHomeSurfaceActive(streamingDisplay),
@@ -5091,7 +5451,7 @@ function OpenTuiApp(props) {
             onKeyDown: handlePickerKey,
             onUiKeyDown: promptUiKeyDown,
             getText: readPromptText,
-            disabled: () => !!pendingFeedback(),
+            disabled: () => !!pendingFeedback() || !!statsPanel,
             mode,
             registerModeLabel: registerPromptModeLabel,
             registerModelLabel: registerPromptModelLabel,
@@ -5106,6 +5466,8 @@ function OpenTuiApp(props) {
                     return "Answer the question below";
                 if (pendingFeedback())
                     return "Describe feedback below";
+                if (statsPanel)
+                    return "Stats panel is open";
                 const plan = pendingPlan();
                 if (plan)
                     return "Press Enter to approve plan or Esc to reject";
@@ -5136,14 +5498,14 @@ function OpenTuiApp(props) {
             h("box", {
                 ref: (ref) => {
                     homeComposerShell = ref;
-                    ref.visible = isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeedback() && !pendingFeishuSetup();
+                    ref.visible = isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeedback() && !statsPanel && !pendingFeishuSetup();
                 },
                 width: "100%",
                 maxWidth: 75,
                 zIndex: 1000,
                 paddingTop: 1,
                 flexShrink: 0,
-                visible: isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !pendingFeishuSetup(),
+                visible: isHomeSurfaceActive(streamingDisplay) && !pendingQuestion() && !statsPanel && !pendingFeishuSetup(),
             }, renderPrompt({
                 ref: (ref) => {
                     homePromptRef = ref;
@@ -5158,7 +5520,7 @@ function OpenTuiApp(props) {
                 onKeyDown: handlePickerKey,
                 onUiKeyDown: promptUiKeyDown,
                 getText: readPromptText,
-                disabled: () => !!pendingFeedback(),
+                disabled: () => !!pendingFeedback() || !!statsPanel,
                 mode,
                 registerModeLabel: registerPromptModeLabel,
                 registerModelLabel: registerPromptModelLabel,
@@ -5173,6 +5535,8 @@ function OpenTuiApp(props) {
                         return "Answer the question below";
                     if (pendingFeedback())
                         return "Describe feedback below";
+                    if (statsPanel)
+                        return "Stats panel is open";
                     const plan = pendingPlan();
                     if (plan)
                         return "Press Enter to approve plan or Esc to reject";
@@ -5419,6 +5783,131 @@ function OpenTuiApp(props) {
             content: "ctrl+d submit · tab view payload · enter newline · esc cancel",
         })));
     }
+    function renderStatsPanel() {
+        return h("box", {
+            ref: (ref) => {
+                statsRoot = ref;
+                redrawStatsPanel();
+            },
+            visible: false,
+            focusable: true,
+            position: "absolute",
+            left: 0,
+            top: 0,
+            width: "100%",
+            height: "100%",
+            zIndex: 3050,
+            backgroundColor: modalBackdropColor(),
+            flexDirection: "column",
+            onKeyDown: (event) => {
+                if (handleStatsKey(event)) {
+                    event.preventDefault?.();
+                    event.stopPropagation?.();
+                    return true;
+                }
+                return false;
+            },
+            onMouseUp: () => closeStatsPanel(),
+        }, h("box", {
+            ref: (ref) => {
+                statsPanelBox = ref;
+                redrawStatsPanel();
+            },
+            visible: false,
+            position: "absolute",
+            width: 76,
+            height: 24,
+            backgroundColor: theme.backgroundPanel,
+            flexDirection: "column",
+            paddingTop: 1,
+            onMouseUp: (event) => {
+                event.stopPropagation?.();
+            },
+        }, [
+            h("box", {
+                flexDirection: "row",
+                alignItems: "center",
+                justifyContent: "space-between",
+                paddingLeft: 4,
+                paddingRight: 4,
+                flexShrink: 0,
+            }, h("text", {
+                ref: (ref) => { statsTitle = ref; },
+                fg: theme.text,
+                content: "Stats",
+            }), h("text", {
+                ref: (ref) => { statsEsc = ref; },
+                fg: theme.textMuted,
+                content: "esc",
+                onMouseUp: () => closeStatsPanel(),
+            })),
+            h("box", {
+                flexDirection: "row",
+                gap: 1,
+                paddingLeft: 4,
+                paddingRight: 4,
+                paddingTop: 1,
+                flexShrink: 0,
+            }, h("box", {
+                ref: (ref) => { statsTab7Box = ref; },
+                paddingLeft: 1,
+                paddingRight: 1,
+                backgroundColor: theme.backgroundElement,
+                onMouseUp: () => setStatsRange("7d"),
+            }, h("text", {
+                ref: (ref) => { statsTab7Text = ref; },
+                fg: theme.textMuted,
+                content: "7 days",
+            })), h("box", {
+                ref: (ref) => { statsTab30Box = ref; },
+                paddingLeft: 1,
+                paddingRight: 1,
+                backgroundColor: theme.primary,
+                onMouseUp: () => setStatsRange("30d"),
+            }, h("text", {
+                ref: (ref) => { statsTab30Text = ref; },
+                fg: contrastText(theme.primary),
+                content: "30 days",
+            }))),
+            h("box", {
+                paddingLeft: 4,
+                paddingRight: 4,
+                paddingTop: 1,
+                flexGrow: 1,
+                minHeight: 0,
+            }, h("scrollbox", {
+                ref: (ref) => { statsBodyScroll = ref; },
+                flexGrow: 1,
+                minHeight: 0,
+                height: 14,
+                onMouseScroll: (event) => {
+                    event.stopPropagation?.();
+                },
+            }, h("text", {
+                ref: (ref) => { statsBodyText = ref; },
+                fg: theme.text,
+                wrapMode: "none",
+                content: "",
+            }))),
+            h("box", {
+                flexDirection: "row",
+                justifyContent: "space-between",
+                paddingLeft: 4,
+                paddingRight: 4,
+                paddingTop: 1,
+                paddingBottom: 1,
+                flexShrink: 0,
+                backgroundColor: theme.backgroundPanel,
+            }, h("text", {
+                ref: (ref) => { statsFooterText = ref; },
+                fg: theme.textMuted,
+                bg: theme.backgroundPanel,
+                wrapMode: "none",
+                truncate: true,
+                content: "left/right:range|tab:toggle|esc:close|view:30d",
+            })),
+        ]));
+    }
     function renderFeishuSetupPanel() {
         return h("box", {
             ref: (ref) => {
@@ -6293,6 +6782,7 @@ function OpenTuiApp(props) {
             registerTraceBadge: registerFooterTraceBadge,
         }),
         renderProviderDialog(),
+        renderStatsPanel(),
         renderFeishuSetupPanel(),
         renderNoticeOverlay(),
     ]);
@@ -6952,7 +7442,7 @@ function createTraceGroupRenderable(ctx, group, syntaxStyle, width = 80) {
     }, children);
 }
 function shouldRenderTraceGroupAsRawTool(tool) {
-    return tool.name === "question" || tool.name === "todo_write" || tool.name === "edit";
+    return tool.name === "question" || tool.name === "todo_write" || tool.name === "edit" || tool.name === "apply_patch";
 }
 function traceGroupDetailLines(group) {
     return group.previewLines.length > 0 ? group.previewLines : group.items;
@@ -7033,8 +7523,9 @@ function traceGroupRenderableSignature(group) {
             return [
                 tool.id,
                 tool.name,
-                tool.status ?? (tool.result === undefined ? "pending" : "completed"),
+                tool.status ?? (tool.result === undefined && !tool.resultCollapsed ? "pending" : "completed"),
                 tool.isError ? "error" : "ok",
+                tool.resultCollapsed ? "collapsed" : "expanded",
                 stableStringify(tool.args),
                 tool.result ?? "",
                 stableStringify(tool.metadata ?? null),
@@ -7046,8 +7537,9 @@ function toolRenderableSignature(tool, writeExpanded) {
     return [
         tool.id,
         tool.name,
-        tool.status ?? (tool.result === undefined ? "pending" : "completed"),
+        tool.status ?? (tool.result === undefined && !tool.resultCollapsed ? "pending" : "completed"),
         tool.isError ? "error" : "ok",
+        tool.resultCollapsed ? "collapsed" : "expanded",
         tool.streamingArgs ? "streaming-args" : "args-complete",
         writeExpanded ? "expanded" : "collapsed",
         hashString(stableStringify(tool.args)),
@@ -7174,16 +7666,41 @@ function createMarkdownList(ctx, token, palette, defaultFg) {
         flexShrink: 0,
     }, items.map((item, index) => {
         const marker = ordered ? `${start + index}. ` : "• ";
-        return createText(ctx, new StyledText([
-            fg(theme.textMuted)(marker),
-            ...markdownInlineToStyledText(markdownTokenInlineTokens(item), palette, item.text ?? "").chunks,
-        ]), {
-            fg: defaultFg,
-            wrapMode: "word",
-            flexShrink: 0,
-        });
+        return createMarkdownListItem(ctx, item, marker, palette, defaultFg);
     }));
 }
+function createMarkdownListItem(ctx, item, marker, palette, defaultFg) {
+    const tokens = Array.isArray(item?.tokens) ? item.tokens : [];
+    const inlineTokens = tokens.filter((child) => !isMarkdownListToken(child));
+    const nestedLists = tokens.filter(isMarkdownListToken);
+    const fallback = tokens.length > 0 ? "" : (item?.text ?? "");
+    const children = [];
+    const line = markdownInlineToStyledText(inlineTokens, palette, fallback);
+    children.push(createText(ctx, new StyledText([
+        fg(theme.textMuted)(marker),
+        ...line.chunks,
+    ]), {
+        fg: defaultFg,
+        wrapMode: "word",
+        flexShrink: 0,
+    }));
+    for (const nestedList of nestedLists) {
+        const nested = createMarkdownList(ctx, nestedList, palette, defaultFg);
+        if (!nested)
+            continue;
+        children.push(createBox(ctx, {
+            flexDirection: "column",
+            flexShrink: 0,
+            paddingLeft: Math.max(2, marker.length),
+        }, [nested]));
+    }
+    return children.length === 1
+        ? children[0]
+        : createBox(ctx, { flexDirection: "column", flexShrink: 0 }, children);
+}
+function isMarkdownListToken(token) {
+    return token?.type === "list";
+}
 function markdownTokenInlineTokens(token) {
     if (Array.isArray(token?.tokens))
         return token.tokens;
@@ -7775,10 +8292,10 @@ function renderTool(tool, syntaxStyle, width = 80) {
     const icon = toolStateIcon(tool);
     const color = toolColor(tool);
     const diff = extractToolDiff(tool);
-    if (diff && !tool.isError && tool.name === "edit") {
+    if (diff && !tool.resultCollapsed && !tool.isError && (tool.name === "edit" || tool.name === "apply_patch")) {
         return h("box", { paddingLeft: 3, marginTop: 1, flexDirection: "column", flexShrink: 0 }, h("text", { fg: color }, `${icon} ${displayToolName(tool.name)}${toolHeader(tool) ? ` ${toolHeader(tool)}` : ""}`), h("box", { paddingLeft: 1, marginTop: 1, border: ["left"], borderColor: theme.borderSubtle, flexDirection: "column", flexShrink: 0 }, renderDiffContent(diff, toolPath(tool), syntaxStyle, width)));
     }
-    if (isWritePreviewTool(tool)) {
+    if (!tool.resultCollapsed && isWritePreviewTool(tool)) {
         const hasContent = typeof tool.args.content === "string";
         const contentStr = hasContent ? String(tool.args.content) : "";
         const preview = hasContent ? formatWritePreview(contentStr, false) : null;
@@ -8237,7 +8754,7 @@ function appendRawToolTranscript(chunks, tool) {
         append(`${content}\n`, color);
     };
     appendLine("");
-    const icon = tool.name === "bash" ? "$" : tool.name === "edit" || tool.name === "write" ? "✎" : "●";
+    const icon = tool.name === "bash" ? "$" : tool.name === "edit" || tool.name === "write" || tool.name === "apply_patch" ? "✎" : "●";
     const color = toolColor(tool);
     append(`   ${icon} `, color);
     append(displayToolName(tool.name), color);
@@ -8405,6 +8922,18 @@ function getApprovalPanelMeta(request) {
             path: request.path,
         };
     }
+    if (request.type === "patch") {
+        return {
+            icon: "→",
+            title: `Patch ${path}`,
+            subtitle: `${request.paths.length} file${request.paths.length === 1 ? "" : "s"}`,
+            preview: request.diff || "No diff provided",
+            previewHeight: 10,
+            previewColor: request.diff ? theme.toolText : theme.textMuted,
+            diff: request.diff,
+            path: request.paths[0] ?? request.path,
+        };
+    }
     return {
         icon: "→",
         title: `Write ${path}`,
@@ -8483,7 +9012,7 @@ function toolColor(tool) {
         return theme.toolShell;
     if (tool.name === "read")
         return theme.toolRead;
-    if (tool.name === "write" || tool.name === "edit")
+    if (tool.name === "write" || tool.name === "edit" || tool.name === "apply_patch")
         return theme.toolWrite;
     if (tool.name === "grep" || tool.name === "glob" || tool.name === "web_search" || tool.name === "web_fetch")
         return theme.toolSearch;
@@ -8494,6 +9023,7 @@ function displayToolName(name) {
         read: "Read",
         write: "Write",
         edit: "Edit",
+        apply_patch: "Patch",
         bash: "Shell",
         grep: "Grep",
         glob: "Glob",
@@ -8526,16 +9056,29 @@ function toolHeader(tool) {
         const agentId = args.agent_id ?? (Array.isArray(args.agent_ids) ? `${args.agent_ids.length} agents` : undefined);
         return agentId ? `(${truncate(String(agentId), 64)})` : "";
     }
-    const value = args.path ?? args.command ?? args.pattern ?? args.url ?? args.query;
+    const value = args.path ?? args.command ?? args.pattern ?? args.url ?? args.query ?? toolPath(tool);
     return value ? `(${truncate(String(value).replace(/\n/g, " "), 64)})` : "";
 }
 function toolPath(tool) {
-    const value = tool.args?.path ?? tool.args?.filePath;
+    const value = tool.args?.path
+        ?? tool.args?.filePath
+        ?? tool.metadata?.path
+        ?? (Array.isArray(tool.metadata?.paths) ? tool.metadata.paths[0] : undefined);
     return typeof value === "string" ? value : undefined;
 }
 function extractToolDiff(tool) {
+    if (tool.resultCollapsed)
+        return undefined;
+    if (typeof tool.metadata?.diff === "string" && tool.metadata.diff.trim().length > 0) {
+        return tool.metadata.diff.trim();
+    }
     if (!tool.result)
         return undefined;
+    if (tool.result.includes("✂") ||
+        tool.result.includes("chars truncated") ||
+        tool.result.includes("chars omitted for UI")) {
+        return undefined;
+    }
     const marker = "\n\nDiff:\n";
     const index = tool.result.indexOf(marker);
     if (index === -1)
@@ -8589,7 +9132,7 @@ function summarizeToolResult(tool) {
     const matches = typeof tool.metadata?.matches === "number" ? tool.metadata.matches : undefined;
     if (tool.name === "read")
         return "";
-    if (tool.name === "edit")
+    if (tool.name === "edit" || tool.name === "apply_patch")
         return "patched file";
     if (tool.name === "write")
         return "wrote file";
@@ -8615,7 +9158,7 @@ function toolStateIcon(tool) {
     }
     if (tool.name === "bash")
         return "$";
-    if (tool.name === "edit")
+    if (tool.name === "edit" || tool.name === "apply_patch")
         return "✎";
     if (tool.name === "write")
         return "✎";
@@ -8692,7 +9235,7 @@ function formatQuestionAnswer(answer) {
     return answer?.length ? answer.join(", ") : "(no answer)";
 }
 function isToolFinished(tool) {
-    return tool.status === "completed" || tool.status === "error" || tool.result !== undefined;
+    return tool.status === "completed" || tool.status === "error" || tool.resultCollapsed === true || tool.result !== undefined;
 }
 function assistantStatusLabel(message) {
     if (message.status === "responding")