@caupulican/pi-adaptative 0.80.34 → 0.80.38

package/dist/modes/interactive/interactive-mode.js

@@ -68,6 +68,12 @@ import { TrustSelectorComponent } from "./components/trust-selector.js";
 import { UserMessageComponent } from "./components/user-message.js";
 import { UserMessageSelectorComponent } from "./components/user-message-selector.js";
 import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, initTheme, onThemeChange, setRegisteredThemes, setTheme, setThemeInstance, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
+const TUI_HISTORY_RELOAD_MAX_LINES = 1000;
+const TUI_HISTORY_RELOAD_WRAP_WIDTH = 100;
+const TUI_HISTORY_RELOAD_CHUNK_SIZE = 20;
+const TUI_LIVE_HISTORY_MAX_COMPONENTS = 260;
+const TUI_LIVE_HISTORY_TRIM_TO_COMPONENTS = 220;
+const STREAMING_UI_UPDATE_INTERVAL_MS = 80;
 function isExpandable(obj) {
     return typeof obj === "object" && obj !== null && "setExpanded" in obj && typeof obj.setExpanded === "function";
 }
@@ -408,9 +414,16 @@ export class InteractiveMode {
     // Status line tracking (for mutating immediately-sequential status updates)
     lastStatusSpacer = undefined;
     lastStatusText = undefined;
+    // Live TUI history cap. Full session history remains in SessionManager/model state.
+    liveHistoryHiddenNotice = undefined;
+    liveHistoryHiddenComponents = 0;
+    tuiHistoryLoaded = false;
+    tuiHistoryLoadInProgress = false;
     // Streaming message tracking
     streamingComponent = undefined;
     streamingMessage = undefined;
+    streamingUiUpdateTimer = undefined;
+    lastStreamingUiUpdateAt = 0;
     // Tool execution tracking and session-scoped reusable panels
     toolPanels = new ToolPanelRegistry();
     // Tool output expansion state
@@ -688,7 +701,7 @@ export class InteractiveMode {
                 hint("app.thinking.cycle", "to cycle thinking level"),
                 rawKeyHint(`${keyText("app.model.cycleForward")}/${keyText("app.model.cycleBackward")}`, "to cycle models"),
                 hint("app.model.select", "to select model"),
-                hint("app.tools.expand", "to expand tools"),
+                hint("app.tools.expand", "to load history / expand tools"),
                 hint("app.thinking.toggle", "to expand thinking"),
                 hint("app.editor.external", "for external editor"),
                 rawKeyHint("/", "for commands"),
@@ -706,9 +719,9 @@ export class InteractiveMode {
                 rawKeyHint(`${keyText("app.clear")}/${keyText("app.exit")}`, "clear/exit"),
                 rawKeyHint("/", "commands"),
                 rawKeyHint("!", "bash"),
-                hint("app.tools.expand", "more"),
+                hint("app.tools.expand", "history/more"),
             ].join(theme.fg("muted", " · "));
-            const compactOnboarding = theme.fg("dim", `Press ${keyText("app.tools.expand")} to show full startup help and loaded resources.`);
+            const compactOnboarding = theme.fg("dim", `Press ${keyText("app.tools.expand")} to load session history or show full startup help and loaded resources.`);
             const onboarding = theme.fg("dim", `Pi can explain its own features and look up its docs. Ask it how to use or extend Pi.`);
             this.builtInHeader = new ExpandableText(() => `${logo}\n${compactInstructions}\n${compactOnboarding}\n\n${onboarding}`, () => `${logo}\n${expandedInstructions}\n\n${onboarding}`, this.getStartupExpansionState(), 1, 0);
             // Setup UI layout
@@ -1435,7 +1448,6 @@ export class InteractiveMode {
                     if (result.cancelled) {
                         return { cancelled: true };
                     }
-                    this.chatContainer.clear();
                     await this.renderInitialMessages();
                     if (result.editorText && !this.editor.getText().trim()) {
                         this.editor.setText(result.editorText);
@@ -1503,7 +1515,6 @@ export class InteractiveMode {
         process.exit(1);
     }
     renderCurrentSessionState() {
-        this.chatContainer.clear();
         this.pendingMessagesContainer.clear();
         this.compactionQueuedMessages = [];
         this.streamingComponent = undefined;
@@ -1528,21 +1539,25 @@ export class InteractiveMode {
         const toolGroup = allowGrouping ? component.toolGroup?.trim() : undefined;
         if (!toolGroup) {
             this.chatContainer.addChild(component);
+            this.trimLiveTuiHistory();
             return;
         }
         const children = this.chatContainer.children;
         const lastChild = children[children.length - 1];
         if (lastChild instanceof ToolGroupComponent && lastChild.toolGroup === toolGroup) {
             lastChild.addTool(component);
+            this.trimLiveTuiHistory();
             return;
         }
         if (lastChild instanceof ToolExecutionComponent && lastChild.toolGroup?.trim() === toolGroup) {
             const group = new ToolGroupComponent(toolGroup, [lastChild, component]);
             group.setExpanded(this.toolOutputExpanded);
             children[children.length - 1] = group;
+            this.trimLiveTuiHistory();
             return;
         }
         this.chatContainer.addChild(component);
+        this.trimLiveTuiHistory();
     }
     detachToolExecutionComponent(component) {
         const children = this.chatContainer.children;
@@ -2287,7 +2302,7 @@ export class InteractiveMode {
         // Global debug handler on TUI (works regardless of focus)
         this.ui.onDebug = () => this.handleDebugCommand();
         this.defaultEditor.onAction("app.model.select", () => void this.showModelSelector());
-        this.defaultEditor.onAction("app.tools.expand", () => this.toggleToolOutputExpansion());
+        this.defaultEditor.onAction("app.tools.expand", () => this.loadTuiHistoryOnDemand());
         this.defaultEditor.onAction("app.thinking.toggle", () => void this.toggleThinkingBlockVisibility());
         this.defaultEditor.onAction("app.editor.external", () => this.openExternalEditor());
         this.defaultEditor.onAction("app.message.followUp", () => this.handleFollowUp());
@@ -2624,31 +2639,18 @@ export class InteractiveMode {
                     this.ui.requestRender();
                 }
                 else if (event.message.role === "assistant") {
+                    this.clearPendingStreamingUiUpdate();
+                    this.lastStreamingUiUpdateAt = 0;
                     this.streamingComponent = new AssistantMessageComponent(undefined, this.hideThinkingBlock, this.getMarkdownThemeWithSettings(), this.hiddenThinkingLabel);
                     this.streamingMessage = event.message;
                     this.chatContainer.addChild(this.streamingComponent);
-                    this.streamingComponent.updateContent(this.streamingMessage);
-                    this.ui.requestRender();
+                    this.applyStreamingMessageUpdate(this.streamingMessage, { force: true });
+                    this.trimLiveTuiHistory();
                 }
                 break;
             case "message_update":
                 if (this.streamingComponent && event.message.role === "assistant") {
-                    this.streamingMessage = event.message;
-                    this.streamingComponent.updateContent(this.streamingMessage);
-                    for (const content of this.streamingMessage.content) {
-                        if (content.type === "toolCall") {
-                            if (!this.toolPanels.hasActive(content.id)) {
-                                this.attachToolExecutionComponent(content.name, content.id, content.arguments);
-                            }
-                            else {
-                                const component = this.toolPanels.getActive(content.id);
-                                if (component) {
-                                    component.updateArgs(content.arguments);
-                                }
-                            }
-                        }
-                    }
-                    this.ui.requestRender();
+                    this.applyStreamingMessageUpdate(event.message);
                 }
                 break;
             case "message_end":
@@ -2665,7 +2667,7 @@ export class InteractiveMode {
                                 : "Operation aborted";
                         this.streamingMessage.errorMessage = errorMessage;
                     }
-                    this.streamingComponent.updateContent(this.streamingMessage);
+                    this.applyStreamingMessageUpdate(this.streamingMessage, { force: true });
                     if (this.streamingMessage.stopReason === "aborted" || this.streamingMessage.stopReason === "error") {
                         if (!errorMessage) {
                             errorMessage = this.streamingMessage.errorMessage || "Error";
@@ -2778,7 +2780,6 @@ export class InteractiveMode {
                     }
                 }
                 else if (event.result) {
-                    this.chatContainer.clear();
                     await this.rebuildChatFromMessages();
                     this.addMessageToChat(createCompactionSummaryMessage(event.result.summary, event.result.tokensBefore, new Date().toISOString()));
                     this.footer.invalidate();
@@ -2850,19 +2851,139 @@ export class InteractiveMode {
             : message.content.filter((c) => c.type === "text");
         return textBlocks.map((c) => c.text).join("");
     }
-    /**
-     * Show a status message in the chat.
-     *
-     * If multiple status messages are emitted back-to-back (without anything else being added to the chat),
-     * we update the previous status line instead of appending new ones to avoid log spam.
-     */
-    showStatus(message) {
+    resetLiveTuiHistoryTrim() {
+        this.liveHistoryHiddenNotice = undefined;
+        this.liveHistoryHiddenComponents = 0;
+    }
+    clearPendingStreamingUiUpdate() {
+        if (!this.streamingUiUpdateTimer)
+            return;
+        clearTimeout(this.streamingUiUpdateTimer);
+        this.streamingUiUpdateTimer = undefined;
+    }
+    getSessionEntryCount() {
+        const manager = this.sessionManager;
+        return manager.getEntryCount?.() ?? manager.getEntries().length;
+    }
+    showDeferredHistoryPlaceholder(options = {}) {
+        this.chatContainer.children = [];
+        this.resetLiveTuiHistoryTrim();
+        this.clearRenderedToolPanelState();
+        const entryCount = this.getSessionEntryCount();
+        if (entryCount > 0) {
+            this.chatContainer.addChild(new Text(theme.fg("dim", `History hidden for typing performance (${entryCount} entries). Press ${keyText("app.tools.expand")} to load session history on demand.`), 1, 0));
+        }
+        if (options.requestRender ?? true)
+            this.ui.requestRender();
+    }
+    loadTuiHistoryOnDemand() {
+        if (this.tuiHistoryLoadInProgress)
+            return;
+        if (this.tuiHistoryLoaded || this.getSessionEntryCount() === 0) {
+            this.toggleToolOutputExpansion();
+            return;
+        }
+        this.tuiHistoryLoadInProgress = true;
+        void (async () => {
+            try {
+                await this.renderInitialMessages({ forceHistoryLoad: true });
+            }
+            catch (error) {
+                this.showError(`Failed to load TUI history: ${error instanceof Error ? error.message : String(error)}`);
+            }
+            finally {
+                this.tuiHistoryLoadInProgress = false;
+            }
+        })();
+    }
+    attachStreamingToolPanels(message) {
+        for (const content of message.content) {
+            if (content.type !== "toolCall")
+                continue;
+            if (!this.toolPanels.hasActive(content.id)) {
+                this.attachToolExecutionComponent(content.name, content.id, content.arguments);
+            }
+            else {
+                const component = this.toolPanels.getActive(content.id);
+                if (component) {
+                    component.updateArgs(content.arguments);
+                }
+            }
+        }
+    }
+    applyStreamingMessageUpdate(message, options = {}) {
+        this.streamingMessage = message;
+        if (!this.streamingComponent)
+            return;
+        const now = performance.now();
+        const elapsed = now - this.lastStreamingUiUpdateAt;
+        const hasToolCall = message.content.some((content) => content.type === "toolCall");
+        const shouldUpdateNow = options.force || hasToolCall || elapsed >= STREAMING_UI_UPDATE_INTERVAL_MS;
+        const update = () => {
+            if (!this.streamingComponent || !this.streamingMessage)
+                return;
+            this.streamingComponent.updateContent(this.streamingMessage);
+            this.attachStreamingToolPanels(this.streamingMessage);
+            this.lastStreamingUiUpdateAt = performance.now();
+            this.ui.requestRender();
+        };
+        if (shouldUpdateNow) {
+            this.clearPendingStreamingUiUpdate();
+            update();
+            return;
+        }
+        if (this.streamingUiUpdateTimer)
+            return;
+        this.streamingUiUpdateTimer = setTimeout(() => {
+            this.streamingUiUpdateTimer = undefined;
+            update();
+        }, Math.max(0, STREAMING_UI_UPDATE_INTERVAL_MS - elapsed));
+    }
+    trimLiveTuiHistory() {
+        const children = this.chatContainer.children;
+        if (children.length <= TUI_LIVE_HISTORY_MAX_COMPONENTS)
+            return;
+        let protectedStart = children.length;
+        const protect = (component) => {
+            if (!component)
+                return;
+            const index = children.indexOf(component);
+            if (index !== -1 && index < protectedStart)
+                protectedStart = index;
+        };
+        protect(this.streamingComponent);
+        protect(this.lastStatusSpacer);
+        protect(this.lastStatusText);
+        for (const [, component] of this.toolPanels.activeEntries()) {
+            protect(component);
+        }
+        const trimStart = children[0] === this.liveHistoryHiddenNotice ? 1 : 0;
+        const targetTrimEnd = children.length - TUI_LIVE_HISTORY_TRIM_TO_COMPONENTS;
+        const trimEnd = Math.min(targetTrimEnd, protectedStart);
+        if (trimEnd <= trimStart)
+            return;
+        const removed = children.splice(trimStart, trimEnd - trimStart);
+        this.liveHistoryHiddenComponents += removed.length;
+        if (removed.includes(this.lastStatusSpacer))
+            this.lastStatusSpacer = undefined;
+        if (removed.includes(this.lastStatusText))
+            this.lastStatusText = undefined;
+        const noticeText = theme.fg("dim", `Older TUI history hidden to preserve FPS (${this.liveHistoryHiddenComponents} components). Full session remains available to the model.`);
+        if (children[0] === this.liveHistoryHiddenNotice) {
+            this.liveHistoryHiddenNotice?.setText(noticeText);
+            return;
+        }
+        this.liveHistoryHiddenNotice = new Text(noticeText, 1, 0);
+        children.unshift(this.liveHistoryHiddenNotice);
+    }
+    appendStatusToChat(message, options = {}) {
         const children = this.chatContainer.children;
         const last = children.length > 0 ? children[children.length - 1] : undefined;
         const secondLast = children.length > 1 ? children[children.length - 2] : undefined;
         if (last && secondLast && last === this.lastStatusText && secondLast === this.lastStatusSpacer) {
             this.lastStatusText.setText(theme.fg("dim", message));
-            this.ui.requestRender();
+            if (options.requestRender ?? true)
+                this.ui.requestRender();
             return;
         }
         const spacer = new Spacer(1);
@@ -2871,7 +2992,18 @@ export class InteractiveMode {
         this.chatContainer.addChild(text);
         this.lastStatusSpacer = spacer;
         this.lastStatusText = text;
-        this.ui.requestRender();
+        this.trimLiveTuiHistory();
+        if (options.requestRender ?? true)
+            this.ui.requestRender();
+    }
+    /**
+     * Show a status message in the chat.
+     *
+     * If multiple status messages are emitted back-to-back (without anything else being added to the chat),
+     * we update the previous status line instead of appending new ones to avoid log spam.
+     */
+    showStatus(message) {
+        this.appendStatusToChat(message);
     }
     addMessageToChat(message, options) {
         switch (message.role) {
@@ -2948,6 +3080,117 @@ export class InteractiveMode {
                 const _exhaustive = message;
             }
         }
+        this.trimLiveTuiHistory();
+    }
+    getContentText(content) {
+        if (typeof content === "string")
+            return content;
+        if (Array.isArray(content)) {
+            return content
+                .map((part) => {
+                const maybeText = part.text;
+                return typeof maybeText === "string" ? maybeText : "";
+            })
+                .join("");
+        }
+        return "";
+    }
+    getTuiHistoryMessageText(message) {
+        switch (message.role) {
+            case "bashExecution":
+                return [message.command, message.output ?? ""].filter(Boolean).join("\n");
+            case "user":
+                return this.getUserMessageText(message);
+            case "assistant":
+                return this.getContentText(message.content);
+            case "toolResult":
+                return this.getContentText(message.content);
+            case "custom":
+                return this.getContentText(message.content);
+            case "compactionSummary":
+            case "branchSummary":
+                return message.summary;
+            default: {
+                const _exhaustive = message;
+                return JSON.stringify(_exhaustive);
+            }
+        }
+    }
+    estimateTuiHistoryLines(message) {
+        const text = this.getTuiHistoryMessageText(message);
+        const hardLines = text.length > 0 ? text.split(/\r\n|\r|\n/).length : 1;
+        const wrappedLines = Math.ceil(text.length / TUI_HISTORY_RELOAD_WRAP_WIDTH);
+        // Add one line for role/tool chrome or spacing. Tool-call-only assistant messages
+        // have little text but still render a component.
+        return Math.max(1, hardLines, wrappedLines) + 1;
+    }
+    trimTextToTuiHistoryTail(text, maxEstimatedLines) {
+        const maxLines = Math.max(1, maxEstimatedLines);
+        const lines = text.split(/\r\n|\r|\n/);
+        if (lines.length > maxLines) {
+            const omitted = lines.length - maxLines;
+            return `[Earlier ${omitted} line${omitted === 1 ? "" : "s"} omitted from TUI reload history; full session remains available to the model.]\n${lines.slice(-maxLines).join("\n")}`;
+        }
+        const maxChars = Math.max(TUI_HISTORY_RELOAD_WRAP_WIDTH, maxLines * TUI_HISTORY_RELOAD_WRAP_WIDTH);
+        if (text.length > maxChars) {
+            const omitted = text.length - maxChars;
+            return `[Earlier ${omitted} character${omitted === 1 ? "" : "s"} omitted from TUI reload history; full session remains available to the model.]\n${text.slice(-maxChars)}`;
+        }
+        return text;
+    }
+    trimMessageToTuiHistoryTail(message, maxEstimatedLines) {
+        const text = this.getTuiHistoryMessageText(message);
+        const trimmedText = this.trimTextToTuiHistoryTail(text, maxEstimatedLines);
+        if (trimmedText === text)
+            return message;
+        const clone = JSON.parse(JSON.stringify(message));
+        const mutable = clone;
+        if (mutable.role === "bashExecution" && typeof mutable.output === "string") {
+            mutable.output = trimmedText;
+        }
+        else if (mutable.role === "compactionSummary" || mutable.role === "branchSummary") {
+            mutable.summary = trimmedText;
+        }
+        else if (typeof mutable.content === "string") {
+            mutable.content = trimmedText;
+        }
+        else {
+            mutable.content = [{ type: "text", text: trimmedText }];
+        }
+        return clone;
+    }
+    messagesForTuiHistoryReload(messages) {
+        let estimatedLines = 0;
+        let start = messages.length;
+        for (let i = messages.length - 1; i >= 0; i--) {
+            const nextLines = this.estimateTuiHistoryLines(messages[i]);
+            if (start < messages.length && estimatedLines + nextLines > TUI_HISTORY_RELOAD_MAX_LINES)
+                break;
+            estimatedLines += nextLines;
+            start = i;
+            if (estimatedLines >= TUI_HISTORY_RELOAD_MAX_LINES)
+                break;
+        }
+        const selected = messages.slice(start);
+        if (selected.length > 0 && estimatedLines > TUI_HISTORY_RELOAD_MAX_LINES) {
+            const tailLines = selected.slice(1).reduce((sum, message) => sum + this.estimateTuiHistoryLines(message), 0);
+            const firstAllowance = TUI_HISTORY_RELOAD_MAX_LINES - tailLines;
+            if (firstAllowance <= 4) {
+                selected.shift();
+                start += 1;
+                estimatedLines = tailLines;
+            }
+            else {
+                // Reserve room for truncation marker, role chrome, and wrap variance.
+                selected[0] = this.trimMessageToTuiHistoryTail(selected[0], firstAllowance - 4);
+                estimatedLines = tailLines + this.estimateTuiHistoryLines(selected[0]);
+            }
+        }
+        return {
+            messages: selected,
+            omittedMessages: start,
+            estimatedLines,
+        };
     }
     /**
      * Render session context to chat. Used for initial load and rebuild after compaction.
@@ -2957,77 +3200,123 @@ export class InteractiveMode {
      */
     renderGeneration = 0;
     async renderSessionContext(sessionContext, options = {}) {
-        // Rebuilding a long session's scrollback synchronously blocks the event loop
-        // for seconds (reload/resume feel frozen). Yield between chunks so input and
-        // repaints keep flowing; a newer rebuild supersedes this one via generation.
+        // Build long history offscreen, then atomically swap it into the visible
+        // chat container. This keeps the TUI responsive without flashing blank or
+        // partial transcript frames during resume/reload/compaction rebuilds.
         const generation = ++this.renderGeneration;
-        const CHUNK_SIZE = 20;
         let processed = 0;
+        let committed = false;
+        const visibleChatContainer = this.chatContainer;
+        const previousLiveHistoryHiddenNotice = this.liveHistoryHiddenNotice;
+        const previousLiveHistoryHiddenComponents = this.liveHistoryHiddenComponents;
+        const previousLastStatusSpacer = this.lastStatusSpacer;
+        const previousLastStatusText = this.lastStatusText;
+        const stagingChatContainer = new Container();
+        this.chatContainer = stagingChatContainer;
+        this.resetLiveTuiHistoryTrim();
         this.clearRenderedToolPanelState();
         const renderedPendingTools = new Map();
-        if (options.updateFooter) {
-            this.footer.invalidate();
-            this.updateEditorBorderColor();
-        }
-        for (const message of sessionContext.messages) {
-            if (processed > 0 && processed % CHUNK_SIZE === 0) {
-                this.ui.requestRender();
-                await new Promise((resolve) => setImmediate(resolve));
-                if (generation !== this.renderGeneration)
-                    return;
+        try {
+            if (options.updateFooter) {
+                this.footer.invalidate();
+                this.updateEditorBorderColor();
             }
-            processed++;
-            // Assistant messages need special handling for tool calls
-            if (message.role === "assistant") {
-                this.addMessageToChat(message);
-                // Render tool call components
-                for (const content of message.content) {
-                    if (content.type === "toolCall") {
-                        const component = this.attachToolExecutionComponent(content.name, content.id, content.arguments);
-                        if (message.stopReason === "aborted" || message.stopReason === "error") {
-                            let errorMessage;
-                            if (message.stopReason === "aborted") {
-                                const retryAttempt = this.session.retryAttempt;
-                                errorMessage =
-                                    retryAttempt > 0
-                                        ? `Aborted after ${retryAttempt} retry attempt${retryAttempt > 1 ? "s" : ""}`
-                                        : "Operation aborted";
+            const tuiHistory = this.messagesForTuiHistoryReload(sessionContext.messages);
+            if (tuiHistory.omittedMessages > 0) {
+                this.appendStatusToChat(`Showing last ~${TUI_HISTORY_RELOAD_MAX_LINES} TUI history lines; omitted ${tuiHistory.omittedMessages} older message${tuiHistory.omittedMessages === 1 ? "" : "s"}. Full session remains available to the model.`, { requestRender: false });
+            }
+            for (const message of tuiHistory.messages) {
+                if (processed > 0 && processed % TUI_HISTORY_RELOAD_CHUNK_SIZE === 0) {
+                    await new Promise((resolve) => setImmediate(resolve));
+                    if (generation !== this.renderGeneration)
+                        return;
+                }
+                processed++;
+                // Assistant messages need special handling for tool calls
+                if (message.role === "assistant") {
+                    this.addMessageToChat(message);
+                    // Render tool call components
+                    for (const content of message.content) {
+                        if (content.type === "toolCall") {
+                            const component = this.attachToolExecutionComponent(content.name, content.id, content.arguments);
+                            if (message.stopReason === "aborted" || message.stopReason === "error") {
+                                let errorMessage;
+                                if (message.stopReason === "aborted") {
+                                    const retryAttempt = this.session.retryAttempt;
+                                    errorMessage =
+                                        retryAttempt > 0
+                                            ? `Aborted after ${retryAttempt} retry attempt${retryAttempt > 1 ? "s" : ""}`
+                                            : "Operation aborted";
+                                }
+                                else {
+                                    errorMessage = message.errorMessage || "Error";
+                                }
+                                component.updateResult({ content: [{ type: "text", text: errorMessage }], isError: true });
+                                this.toolPanels.finish(content.id);
                             }
                             else {
-                                errorMessage = message.errorMessage || "Error";
+                                renderedPendingTools.set(content.id, component);
                             }
-                            component.updateResult({ content: [{ type: "text", text: errorMessage }], isError: true });
-                            this.toolPanels.finish(content.id);
-                        }
-                        else {
-                            renderedPendingTools.set(content.id, component);
                         }
                     }
                 }
-            }
-            else if (message.role === "toolResult") {
-                // Match tool results to pending tool components
-                const component = renderedPendingTools.get(message.toolCallId);
-                if (component) {
-                    component.updateResult(message);
-                    renderedPendingTools.delete(message.toolCallId);
-                    this.toolPanels.finish(message.toolCallId);
+                else if (message.role === "toolResult") {
+                    // Match tool results to pending tool components
+                    const component = renderedPendingTools.get(message.toolCallId);
+                    if (component) {
+                        component.updateResult(message);
+                        renderedPendingTools.delete(message.toolCallId);
+                        this.toolPanels.finish(message.toolCallId);
+                    }
+                }
+                else {
+                    // All other messages use standard rendering
+                    this.addMessageToChat(message, options);
                 }
             }
+            if (generation !== this.renderGeneration)
+                return;
+            visibleChatContainer.children = stagingChatContainer.children;
+            committed = true;
+        }
+        finally {
+            const stagedLiveHistoryHiddenNotice = this.liveHistoryHiddenNotice;
+            const stagedLiveHistoryHiddenComponents = this.liveHistoryHiddenComponents;
+            const stagedLastStatusSpacer = this.lastStatusSpacer;
+            const stagedLastStatusText = this.lastStatusText;
+            this.chatContainer = visibleChatContainer;
+            if (committed) {
+                this.liveHistoryHiddenNotice = stagedLiveHistoryHiddenNotice;
+                this.liveHistoryHiddenComponents = stagedLiveHistoryHiddenComponents;
+                this.lastStatusSpacer = stagedLastStatusSpacer;
+                this.lastStatusText = stagedLastStatusText;
+            }
             else {
-                // All other messages use standard rendering
-                this.addMessageToChat(message, options);
+                this.liveHistoryHiddenNotice = previousLiveHistoryHiddenNotice;
+                this.liveHistoryHiddenComponents = previousLiveHistoryHiddenComponents;
+                this.lastStatusSpacer = previousLastStatusSpacer;
+                this.lastStatusText = previousLastStatusText;
             }
         }
-        this.ui.requestRender();
+        if (committed)
+            this.ui.requestRender();
     }
-    async renderInitialMessages() {
-        // Get aligned messages and entries from session context
+    async renderInitialMessages(options = {}) {
+        if (!options.forceHistoryLoad) {
+            this.tuiHistoryLoaded = false;
+            this.showDeferredHistoryPlaceholder({ requestRender: true });
+            this.footer.invalidate();
+            this.updateEditorBorderColor();
+            return;
+        }
+        // Get aligned messages and entries from session context only when the user
+        // explicitly requests TUI history. The model/session state is already loaded.
         const context = this.sessionManager.buildSessionContext();
         await this.renderSessionContext(context, {
             updateFooter: true,
             populateHistory: true,
         });
+        this.tuiHistoryLoaded = true;
         // Show compaction info if session was compacted
         const allEntries = this.sessionManager.getEntries();
         const compactionCount = allEntries.filter((e) => e.type === "compaction").length;
@@ -3049,7 +3338,10 @@ export class InteractiveMode {
         });
     }
     async rebuildChatFromMessages() {
-        this.chatContainer.clear();
+        if (!this.tuiHistoryLoaded) {
+            this.showDeferredHistoryPlaceholder({ requestRender: true });
+            return;
+        }
         const context = this.sessionManager.buildSessionContext();
         await this.renderSessionContext(context);
     }
@@ -3331,7 +3623,6 @@ export class InteractiveMode {
         this.hideThinkingBlock = !this.hideThinkingBlock;
         this.settingsManager.setHideThinkingBlock(this.hideThinkingBlock);
         // Rebuild chat from session messages
-        this.chatContainer.clear();
         await this.rebuildChatFromMessages();
         // If streaming, re-add the streaming component with updated visibility and re-render
         if (this.streamingComponent && this.streamingMessage) {
@@ -4657,7 +4948,6 @@ export class InteractiveMode {
                             child.setHideThinkingBlock(hidden);
                         }
                     }
-                    this.chatContainer.clear();
                     void this.rebuildChatFromMessages();
                 },
                 onCollapseChangelogChange: (collapsed) => {
@@ -5037,7 +5327,6 @@ export class InteractiveMode {
                         return;
                     }
                     // Update UI
-                    this.chatContainer.clear();
                     await this.renderInitialMessages();
                     if (result.editorText && !this.editor.getText().trim()) {
                         this.editor.setText(result.editorText);