snow-ai 0.2.12 → 0.2.13

package/dist/ui/pages/ChatScreen.js

@@ -18,7 +18,7 @@ import { sessionManager } from '../../utils/sessionManager.js';
 import { useSessionSave } from '../../hooks/useSessionSave.js';
 import { useToolConfirmation } from '../../hooks/useToolConfirmation.js';
 import { handleConversationWithTools } from '../../hooks/useConversation.js';
-import { parseAndValidateFileReferences, createMessageWithFileInstructions, getSystemInfo } from '../../utils/fileUtils.js';
+import { parseAndValidateFileReferences, createMessageWithFileInstructions, getSystemInfo, } from '../../utils/fileUtils.js';
 import { compressContext } from '../../utils/contextCompressor.js';
 import { incrementalSnapshotManager } from '../../utils/incrementalSnapshot.js';
 // Import commands to register them
@@ -30,7 +30,7 @@ import '../../utils/commands/init.js';
 import '../../utils/commands/ide.js';
 import '../../utils/commands/compact.js';
 import { navigateTo } from '../../hooks/useGlobalNavigation.js';
-import { vscodeConnection } from '../../utils/vscodeConnection.js';
+import { vscodeConnection, } from '../../utils/vscodeConnection.js';
 // Format elapsed time to human readable format
 function formatElapsedTime(seconds) {
     if (seconds < 60) {
@@ -61,7 +61,16 @@ export default function ChatScreen({}) {
     const [showMcpInfo, setShowMcpInfo] = useState(false);
     const [mcpPanelKey, setMcpPanelKey] = useState(0);
     const [streamTokenCount, setStreamTokenCount] = useState(0);
-    const [yoloMode, setYoloMode] = useState(false);
+    const [yoloMode, setYoloMode] = useState(() => {
+        // Load yolo mode from localStorage on initialization
+        try {
+            const saved = localStorage.getItem('snow-yolo-mode');
+            return saved === 'true';
+        }
+        catch {
+            return false;
+        }
+    });
     const [contextUsage, setContextUsage] = useState(null);
     const [elapsedSeconds, setElapsedSeconds] = useState(0);
     const [timerStartTime, setTimerStartTime] = useState(null);
@@ -85,8 +94,17 @@ export default function ChatScreen({}) {
     useEffect(() => {
         pendingMessagesRef.current = pendingMessages;
     }, [pendingMessages]);
+    // Persist yolo mode to localStorage
+    useEffect(() => {
+        try {
+            localStorage.setItem('snow-yolo-mode', String(yoloMode));
+        }
+        catch {
+            // Ignore localStorage errors
+        }
+    }, [yoloMode]);
     // Use tool confirmation hook
-    const { pendingToolConfirmation, requestToolConfirmation, isToolAutoApproved, addMultipleToAlwaysApproved } = useToolConfirmation();
+    const { pendingToolConfirmation, requestToolConfirmation, isToolAutoApproved, addMultipleToAlwaysApproved, } = useToolConfirmation();
     // Animation for streaming/saving indicator
     useEffect(() => {
         if (!isStreaming && !isSaving)
@@ -123,58 +141,54 @@ export default function ChatScreen({}) {
     }, [timerStartTime]);
     // Monitor VSCode connection status and editor context
     useEffect(() => {
-        let connectingTimeout = null;
-        const checkConnection = setInterval(() => {
+        const checkConnectionInterval = setInterval(() => {
             const isConnected = vscodeConnection.isConnected();
-            const isServerRunning = vscodeConnection.isServerRunning();
             setVscodeConnected(isConnected);
             // Update connection status based on actual connection state
             if (isConnected && vscodeConnectionStatus !== 'connected') {
                 setVscodeConnectionStatus('connected');
-                if (connectingTimeout) {
-                    clearTimeout(connectingTimeout);
-                    connectingTimeout = null;
-                }
             }
             else if (!isConnected && vscodeConnectionStatus === 'connected') {
                 setVscodeConnectionStatus('disconnected');
             }
-            else if (vscodeConnectionStatus === 'connecting' && !isServerRunning) {
-                // Server failed to start
-                setVscodeConnectionStatus('error');
-                if (connectingTimeout) {
-                    clearTimeout(connectingTimeout);
-                    connectingTimeout = null;
-                }
-            }
         }, 1000);
-        // Set timeout for connecting state (15 seconds)
-        if (vscodeConnectionStatus === 'connecting') {
-            connectingTimeout = setTimeout(() => {
-                if (vscodeConnectionStatus === 'connecting') {
-                    setVscodeConnectionStatus('error');
-                }
-            }, 15000);
-        }
-        const unsubscribe = vscodeConnection.onContextUpdate((context) => {
+        const unsubscribe = vscodeConnection.onContextUpdate(context => {
             setEditorContext(context);
             // When we receive context, it means connection is successful
             if (vscodeConnectionStatus !== 'connected') {
                 setVscodeConnectionStatus('connected');
-                if (connectingTimeout) {
-                    clearTimeout(connectingTimeout);
-                    connectingTimeout = null;
-                }
             }
         });
         return () => {
-            clearInterval(checkConnection);
-            if (connectingTimeout) {
-                clearTimeout(connectingTimeout);
-            }
+            clearInterval(checkConnectionInterval);
             unsubscribe();
         };
     }, [vscodeConnectionStatus]);
+    // Separate effect for handling connecting timeout
+    useEffect(() => {
+        if (vscodeConnectionStatus !== 'connecting') {
+            return;
+        }
+        // Set timeout for connecting state (30 seconds to allow for VSCode extension reconnection)
+        const connectingTimeout = setTimeout(() => {
+            const isConnected = vscodeConnection.isConnected();
+            const isServerRunning = vscodeConnection.isServerRunning();
+            // Only set error if still not connected after timeout
+            if (!isConnected) {
+                if (isServerRunning) {
+                    // Server is running but no connection - show error with helpful message
+                    setVscodeConnectionStatus('error');
+                }
+                else {
+                    // Server not running - go back to disconnected
+                    setVscodeConnectionStatus('disconnected');
+                }
+            }
+        }, 30000); // Increased to 30 seconds
+        return () => {
+            clearTimeout(connectingTimeout);
+        };
+    }, [vscodeConnectionStatus]);
     // Load snapshot file counts when session changes
     useEffect(() => {
         const loadSnapshotFileCounts = async () => {
@@ -231,12 +245,15 @@ export default function ChatScreen({}) {
             // Abort the controller
             abortController.abort();
             // Add discontinued message
-            setMessages(prev => [...prev, {
+            setMessages(prev => [
+                ...prev,
+                {
                     role: 'assistant',
                     content: '',
                     streaming: false,
-                    discontinued: true
-                }]);
+                    discontinued: true,
+                },
+            ]);
             // Stop streaming state
             setIsStreaming(false);
             setAbortController(null);
@@ -245,7 +262,9 @@ export default function ChatScreen({}) {
     });
     const handleCommandExecution = async (commandName, result) => {
         // Handle /compact command
-        if (commandName === 'compact' && result.success && result.action === 'compact') {
+        if (commandName === 'compact' &&
+            result.success &&
+            result.action === 'compact') {
             // Set compressing state (不添加命令面板消息)
             setIsCompressing(true);
             setCompressionError(null);
@@ -256,7 +275,7 @@ export default function ChatScreen({}) {
                     .map(msg => ({
                     role: msg.role,
                     content: msg.content,
-                    tool_call_id: msg.toolCallId
+                    tool_call_id: msg.toolCallId,
                 }));
                 // Compress the context
                 const result = await compressContext(chatMessages);
@@ -264,7 +283,7 @@ export default function ChatScreen({}) {
                 const summaryMessage = {
                     role: 'assistant',
                     content: result.summary,
-                    streaming: false
+                    streaming: false,
                 };
                 // Clear session and set new compressed state
                 sessionManager.clearCurrentSession();
@@ -275,7 +294,7 @@ export default function ChatScreen({}) {
                 setContextUsage({
                     prompt_tokens: result.usage.prompt_tokens,
                     completion_tokens: result.usage.completion_tokens,
-                    total_tokens: result.usage.total_tokens
+                    total_tokens: result.usage.total_tokens,
                 });
             }
             catch (error) {
@@ -285,7 +304,7 @@ export default function ChatScreen({}) {
                 const errorMessage = {
                     role: 'assistant',
                     content: `**Compression Failed**\n\n${errorMsg}`,
-                    streaming: false
+                    streaming: false,
                 };
                 setMessages(prev => [...prev, errorMessage]);
             }
@@ -302,7 +321,7 @@ export default function ChatScreen({}) {
                 const commandMessage = {
                     role: 'command',
                     content: '',
-                    commandName: commandName
+                    commandName: commandName,
                 };
                 setMessages(prev => [...prev, commandMessage]);
             }
@@ -322,11 +341,13 @@ export default function ChatScreen({}) {
             setRemountKey(prev => prev + 1);
             // Reset context usage (token statistics)
             setContextUsage(null);
+            // Note: yoloMode is preserved via localStorage (lines 68-76, 104-111)
+            // Note: VSCode connection is preserved and managed by vscodeConnection utility
             // Add command execution feedback
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages([commandMessage]);
         }
@@ -335,7 +356,7 @@ export default function ChatScreen({}) {
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages(prev => [...prev, commandMessage]);
         }
@@ -345,7 +366,7 @@ export default function ChatScreen({}) {
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages(prev => [...prev, commandMessage]);
         }
@@ -354,7 +375,7 @@ export default function ChatScreen({}) {
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages(prev => [...prev, commandMessage]);
         }
@@ -366,16 +387,18 @@ export default function ChatScreen({}) {
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages(prev => [...prev, commandMessage]);
         }
-        else if (result.success && result.action === 'initProject' && result.prompt) {
+        else if (result.success &&
+            result.action === 'initProject' &&
+            result.prompt) {
             // Add command execution feedback
             const commandMessage = {
                 role: 'command',
                 content: '',
-                commandName: commandName
+                commandName: commandName,
             };
             setMessages(prev => [...prev, commandMessage]);
             // Auto-send the prompt using basicModel, hide the prompt from UI
@@ -456,8 +479,16 @@ export default function ChatScreen({}) {
         const regularFiles = validFiles.filter(f => !f.isImage);
         // Convert image files to image content format
         const imageContents = [
-            ...(images || []).map(img => ({ type: 'image', data: img.data, mimeType: img.mimeType })),
-            ...imageFiles.map(f => ({ type: 'image', data: f.imageData, mimeType: f.mimeType }))
+            ...(images || []).map(img => ({
+                type: 'image',
+                data: img.data,
+                mimeType: img.mimeType,
+            })),
+            ...imageFiles.map(f => ({
+                type: 'image',
+                data: f.imageData,
+                mimeType: f.mimeType,
+            })),
         ];
         // Get system information
         const systemInfo = getSystemInfo();
@@ -468,7 +499,7 @@ export default function ChatScreen({}) {
                 content: cleanContent,
                 files: validFiles.length > 0 ? validFiles : undefined,
                 images: imageContents.length > 0 ? imageContents : undefined,
-                systemInfo
+                systemInfo,
             };
             setMessages(prev => [...prev, userMessage]);
         }
@@ -497,7 +528,7 @@ export default function ChatScreen({}) {
                 useBasicModel,
                 getPendingMessages: () => pendingMessagesRef.current,
                 clearPendingMessages: () => setPendingMessages([]),
-                setIsStreaming
+                setIsStreaming,
             });
         }
         catch (error) {
@@ -508,7 +539,7 @@ export default function ChatScreen({}) {
             const finalMessage = {
                 role: 'assistant',
                 content: `Error: ${errorMessage}`,
-                streaming: false
+                streaming: false,
             };
             setMessages(prev => [...prev, finalMessage]);
         }
@@ -538,7 +569,7 @@ export default function ChatScreen({}) {
         // Save user message
         saveMessage({
             role: 'user',
-            content: combinedMessage
+            content: combinedMessage,
         }).catch(error => {
             console.error('Failed to save user message:', error);
         });
@@ -560,7 +591,7 @@ export default function ChatScreen({}) {
                 setContextUsage,
                 getPendingMessages: () => pendingMessagesRef.current,
                 clearPendingMessages: () => setPendingMessages([]),
-                setIsStreaming
+                setIsStreaming,
             });
         }
         catch (error) {
@@ -571,7 +602,7 @@ export default function ChatScreen({}) {
             const finalMessage = {
                 role: 'assistant',
                 content: `Error: ${errorMessage}`,
-                streaming: false
+                streaming: false,
             };
             setMessages(prev => [...prev, finalMessage]);
         }
@@ -589,12 +620,13 @@ export default function ChatScreen({}) {
     if (terminalHeight < MIN_TERMINAL_HEIGHT) {
         return (React.createElement(Box, { flexDirection: "column", padding: 2 },
             React.createElement(Box, { borderStyle: "round", borderColor: "red", padding: 1 },
-                React.createElement(Text, { color: "red", bold: true }, "\u26A0  Terminal Too Small")),
+                React.createElement(Text, { color: "red", bold: true }, "\u26A0 Terminal Too Small")),
             React.createElement(Box, { marginTop: 1 },
                 React.createElement(Text, { color: "yellow" },
                     "Your terminal height is ",
                     terminalHeight,
-                    " lines, but at least ",
+                    " lines, but at least",
+                    ' ',
                     MIN_TERMINAL_HEIGHT,
                     " lines are required.")),
             React.createElement(Box, { marginTop: 1 },
@@ -613,7 +645,9 @@ export default function ChatScreen({}) {
                         React.createElement(Text, { color: "gray", dimColor: true },
                             "\u2022 Working directory: ",
                             workingDirectory))),
-                ...messages.filter(m => !m.streaming && !m.toolPending).map((message, index) => {
+                ...messages
+                    .filter(m => !m.streaming && !m.toolPending)
+                    .map((message, index) => {
                     // Determine tool message type and color
                     let toolStatusColor = 'cyan';
                     let isToolMessage = false;
@@ -636,42 +670,89 @@ export default function ChatScreen({}) {
                     }
                     return (React.createElement(Box, { key: `msg-${index}`, marginBottom: isToolMessage ? 0 : 1, marginX: 1, flexDirection: "column" },
                         React.createElement(Box, null,
-                            React.createElement(Text, { color: message.role === 'user' ? 'green' :
-                                    message.role === 'command' ? 'gray' : toolStatusColor, bold: true }, message.role === 'user' ? '⛇' : message.role === 'command' ? '⌘' : '❆'),
+                            React.createElement(Text, { color: message.role === 'user'
+                                    ? 'green'
+                                    : message.role === 'command'
+                                        ? 'gray'
+                                        : toolStatusColor, bold: true }, message.role === 'user'
+                                ? '⛇'
+                                : message.role === 'command'
+                                    ? '⌘'
+                                    : '❆'),
                             React.createElement(Box, { marginLeft: 1, marginBottom: 1, flexDirection: "column" }, message.role === 'command' ? (React.createElement(Text, { color: "gray", dimColor: true },
                                 "\u2514\u2500 ",
                                 message.commandName)) : message.showTodoTree ? (React.createElement(TodoTree, { todos: currentTodos })) : (React.createElement(React.Fragment, null,
-                                React.createElement(MarkdownRenderer, { content: message.content || ' ', color: message.role === 'user' ? 'gray' :
-                                        isToolMessage ? (message.content.startsWith('⚡') ? 'yellow' :
-                                            message.content.startsWith('✓') ? 'green' : 'red') : undefined }),
-                                message.toolDisplay && message.toolDisplay.args.length > 0 && (React.createElement(Box, { flexDirection: "column" }, message.toolDisplay.args.map((arg, argIndex) => (React.createElement(Text, { key: argIndex, color: "gray", dimColor: true },
+                                React.createElement(MarkdownRenderer, { content: message.content || ' ', color: message.role === 'user'
+                                        ? 'gray'
+                                        : isToolMessage
+                                            ? message.content.startsWith('⚡')
+                                                ? 'yellow'
+                                                : message.content.startsWith('✓')
+                                                    ? 'green'
+                                                    : 'red'
+                                            : undefined }),
+                                message.toolDisplay &&
+                                    message.toolDisplay.args.length > 0 && (React.createElement(Box, { flexDirection: "column" }, message.toolDisplay.args.map((arg, argIndex) => (React.createElement(Text, { key: argIndex, color: "gray", dimColor: true },
                                     arg.isLast ? '└─' : '├─',
                                     " ",
                                     arg.key,
-                                    ": ",
+                                    ":",
+                                    ' ',
                                     arg.value))))),
-                                message.toolCall && (message.toolCall.name === 'filesystem-create' || message.toolCall.name === 'filesystem-write') && message.toolCall.arguments.content && (React.createElement(Box, { marginTop: 1 },
-                                    React.createElement(DiffViewer, { newContent: message.toolCall.arguments.content, filename: message.toolCall.arguments.path, maxLines: 50 }))),
-                                message.toolCall && message.toolCall.name === 'filesystem-edit' && message.toolCall.arguments.oldContent && message.toolCall.arguments.newContent && (React.createElement(Box, { marginTop: 1 },
-                                    React.createElement(DiffViewer, { oldContent: message.toolCall.arguments.oldContent, newContent: message.toolCall.arguments.newContent, filename: message.toolCall.arguments.filename, maxLines: 50 }))),
-                                message.toolCall && message.toolCall.name === 'terminal-execute' && message.toolCall.arguments.command && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },
+                                message.toolCall &&
+                                    (message.toolCall.name === 'filesystem-create' ||
+                                        message.toolCall.name === 'filesystem-write') &&
+                                    message.toolCall.arguments.content && (React.createElement(Box, { marginTop: 1 },
+                                    React.createElement(DiffViewer, { newContent: message.toolCall.arguments.content, filename: message.toolCall.arguments.path }))),
+                                message.toolCall &&
+                                    message.toolCall.name === 'filesystem-edit' &&
+                                    message.toolCall.arguments.oldContent &&
+                                    message.toolCall.arguments.newContent && (React.createElement(Box, { marginTop: 1 },
+                                    React.createElement(DiffViewer, { oldContent: message.toolCall.arguments.oldContent, newContent: message.toolCall.arguments.newContent, filename: message.toolCall.arguments.filename }))),
+                                message.toolCall &&
+                                    message.toolCall.name === 'terminal-execute' &&
+                                    message.toolCall.arguments.command && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },
                                     React.createElement(Text, { color: "gray", dimColor: true },
-                                        "\u2514\u2500 Command: ",
+                                        "\u2514\u2500 Command:",
+                                        ' ',
                                         React.createElement(Text, { color: "white" }, message.toolCall.arguments.command)),
                                     React.createElement(Text, { color: "gray", dimColor: true },
-                                        "\u2514\u2500 Exit Code: ",
-                                        React.createElement(Text, { color: message.toolCall.arguments.exitCode === 0 ? 'green' : 'red' }, message.toolCall.arguments.exitCode)),
-                                    message.toolCall.arguments.stdout && message.toolCall.arguments.stdout.trim().length > 0 && (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
+                                        "\u2514\u2500 Exit Code:",
+                                        ' ',
+                                        React.createElement(Text, { color: message.toolCall.arguments.exitCode === 0
+                                                ? 'green'
+                                                : 'red' }, message.toolCall.arguments.exitCode)),
+                                    message.toolCall.arguments.stdout &&
+                                        message.toolCall.arguments.stdout.trim()
+                                            .length > 0 && (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
                                         React.createElement(Text, { color: "green", dimColor: true }, "\u2514\u2500 stdout:"),
                                         React.createElement(Box, { paddingLeft: 2 },
-                                            React.createElement(Text, { color: "white" }, message.toolCall.arguments.stdout.trim().split('\n').slice(0, 20).join('\n')),
-                                            message.toolCall.arguments.stdout.trim().split('\n').length > 20 && (React.createElement(Text, { color: "gray", dimColor: true }, "... (output truncated)"))))),
-                                    message.toolCall.arguments.stderr && message.toolCall.arguments.stderr.trim().length > 0 && (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
+                                            React.createElement(Text, { color: "white" }, message.toolCall.arguments.stdout
+                                                .trim()
+                                                .split('\n')
+                                                .slice(0, 20)
+                                                .join('\n')),
+                                            message.toolCall.arguments.stdout
+                                                .trim()
+                                                .split('\n').length > 20 && (React.createElement(Text, { color: "gray", dimColor: true }, "... (output truncated)"))))),
+                                    message.toolCall.arguments.stderr &&
+                                        message.toolCall.arguments.stderr.trim()
+                                            .length > 0 && (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
                                         React.createElement(Text, { color: "red", dimColor: true }, "\u2514\u2500 stderr:"),
                                         React.createElement(Box, { paddingLeft: 2 },
-                                            React.createElement(Text, { color: "red" }, message.toolCall.arguments.stderr.trim().split('\n').slice(0, 10).join('\n')),
-                                            message.toolCall.arguments.stderr.trim().split('\n').length > 10 && (React.createElement(Text, { color: "gray", dimColor: true }, "... (output truncated)"))))))),
-                                message.content.startsWith('✓') && message.toolResult && !message.toolCall && (React.createElement(ToolResultPreview, { toolName: message.content.replace('✓ ', '').split('\n')[0] || '', result: message.toolResult, maxLines: 5 })),
+                                            React.createElement(Text, { color: "red" }, message.toolCall.arguments.stderr
+                                                .trim()
+                                                .split('\n')
+                                                .slice(0, 10)
+                                                .join('\n')),
+                                            message.toolCall.arguments.stderr
+                                                .trim()
+                                                .split('\n').length > 10 && (React.createElement(Text, { color: "gray", dimColor: true }, "... (output truncated)"))))))),
+                                message.content.startsWith('✓') &&
+                                    message.toolResult &&
+                                    !message.toolCall && (React.createElement(ToolResultPreview, { toolName: message.content
+                                        .replace('✓ ', '')
+                                        .split('\n')[0] || '', result: message.toolResult, maxLines: 5 })),
                                 message.role === 'user' && message.systemInfo && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },
                                     React.createElement(Text, { color: "gray", dimColor: true },
                                         "\u2514\u2500 Platform: ",
@@ -680,20 +761,27 @@ export default function ChatScreen({}) {
                                         "\u2514\u2500 Shell: ",
                                         message.systemInfo.shell),
                                     React.createElement(Text, { color: "gray", dimColor: true },
-                                        "\u2514\u2500 Working Directory: ",
+                                        "\u2514\u2500 Working Directory:",
+                                        ' ',
                                         message.systemInfo.workingDirectory))),
                                 message.files && message.files.length > 0 && (React.createElement(Box, { flexDirection: "column" }, message.files.map((file, fileIndex) => (React.createElement(Text, { key: fileIndex, color: "gray", dimColor: true },
                                     "\u2514\u2500 ",
                                     file.path,
-                                    file.exists ? ` (total line ${file.lineCount})` : ' (file not found)'))))),
-                                message.role === 'user' && message.images && message.images.length > 0 && (React.createElement(Box, { marginTop: 1, flexDirection: "column" }, message.images.map((_image, imageIndex) => (React.createElement(Text, { key: imageIndex, color: "gray", dimColor: true },
+                                    file.exists
+                                        ? ` (total line ${file.lineCount})`
+                                        : ' (file not found)'))))),
+                                message.role === 'user' &&
+                                    message.images &&
+                                    message.images.length > 0 && (React.createElement(Box, { marginTop: 1, flexDirection: "column" }, message.images.map((_image, imageIndex) => (React.createElement(Text, { key: imageIndex, color: "gray", dimColor: true },
                                     "\u2514\u2500 [image #",
                                     imageIndex + 1,
                                     "]"))))),
                                 message.discontinued && (React.createElement(Text, { color: "red", bold: true }, "\u2514\u2500 user discontinue"))))))));
-                })
-            ] }, (item) => item),
-        messages.filter(m => m.toolPending).map((message, index) => (React.createElement(Box, { key: `pending-tool-${index}`, marginBottom: 1, marginX: 1 },
+                }),
+            ] }, item => item),
+        messages
+            .filter(m => m.toolPending)
+            .map((message, index) => (React.createElement(Box, { key: `pending-tool-${index}`, marginBottom: 1, marginX: 1 },
             React.createElement(Text, { color: "yellowBright", bold: true }, "\u2746"),
             React.createElement(Box, { marginLeft: 1, marginBottom: 1, flexDirection: "row" },
                 React.createElement(MarkdownRenderer, { content: message.content || ' ', color: "yellow" }),
@@ -709,15 +797,20 @@ export default function ChatScreen({}) {
                     streamTokenCount > 0 && (React.createElement(React.Fragment, null,
                         ' · ',
                         React.createElement(Text, { color: "cyan" },
-                            "\u2193 ",
+                            "\u2193",
+                            ' ',
                             streamTokenCount >= 1000
                                 ? `${(streamTokenCount / 1000).toFixed(1)}k`
                                 : streamTokenCount,
-                            " tokens"))),
+                            ' ',
+                            "tokens"))),
                     ")")) : ('Create the first dialogue record file...'))))),
         React.createElement(Box, { marginX: 1 },
             React.createElement(PendingMessages, { pendingMessages: pendingMessages })),
-        pendingToolConfirmation && (React.createElement(ToolConfirmation, { toolName: pendingToolConfirmation.batchToolNames || pendingToolConfirmation.tool.function.name, onConfirm: pendingToolConfirmation.resolve })),
+        pendingToolConfirmation && (React.createElement(ToolConfirmation, { toolName: pendingToolConfirmation.batchToolNames ||
+                pendingToolConfirmation.tool.function.name, toolArguments: !pendingToolConfirmation.allTools
+                ? pendingToolConfirmation.tool.function.arguments
+                : undefined, allTools: pendingToolConfirmation.allTools, onConfirm: pendingToolConfirmation.resolve })),
         showSessionPanel && (React.createElement(Box, { marginX: 1 },
             React.createElement(SessionListPanel, { onSelectSession: handleSessionPanelSelect, onClose: () => setShowSessionPanel(false) }))),
         showMcpPanel && (React.createElement(Box, { marginX: 1, flexDirection: "column" },
@@ -725,24 +818,43 @@ export default function ChatScreen({}) {
             React.createElement(Box, { marginTop: 1 },
                 React.createElement(Text, { color: "gray", dimColor: true }, "Press ESC to close")))),
         pendingRollback && (React.createElement(FileRollbackConfirmation, { fileCount: pendingRollback.fileCount, onConfirm: handleRollbackConfirm })),
-        !pendingToolConfirmation && !isCompressing && !showSessionPanel && !showMcpPanel && !pendingRollback && (React.createElement(React.Fragment, null,
-            React.createElement(ChatInput, { onSubmit: handleMessageSubmit, onCommand: handleCommandExecution, placeholder: "Ask me anything about coding...", disabled: !!pendingToolConfirmation, chatHistory: messages, onHistorySelect: handleHistorySelect, yoloMode: yoloMode, contextUsage: contextUsage ? {
-                    inputTokens: contextUsage.prompt_tokens,
-                    maxContextTokens: getOpenAiConfig().maxContextTokens || 4000,
-                    cacheCreationTokens: contextUsage.cache_creation_input_tokens,
-                    cacheReadTokens: contextUsage.cache_read_input_tokens,
-                    cachedTokens: contextUsage.cached_tokens
-                } : undefined, snapshotFileCount: snapshotFileCount }),
+        !pendingToolConfirmation &&
+            !isCompressing &&
+            !showSessionPanel &&
+            !showMcpPanel &&
+            !pendingRollback && (React.createElement(React.Fragment, null,
+            React.createElement(ChatInput, { onSubmit: handleMessageSubmit, onCommand: handleCommandExecution, placeholder: "Ask me anything about coding...", disabled: !!pendingToolConfirmation, chatHistory: messages, onHistorySelect: handleHistorySelect, yoloMode: yoloMode, contextUsage: contextUsage
+                    ? {
+                        inputTokens: contextUsage.prompt_tokens,
+                        maxContextTokens: getOpenAiConfig().maxContextTokens || 4000,
+                        cacheCreationTokens: contextUsage.cache_creation_input_tokens,
+                        cacheReadTokens: contextUsage.cache_read_input_tokens,
+                        cachedTokens: contextUsage.cached_tokens,
+                    }
+                    : undefined, snapshotFileCount: snapshotFileCount }),
             vscodeConnectionStatus !== 'disconnected' && (React.createElement(Box, { marginTop: 1 },
-                React.createElement(Text, { color: vscodeConnectionStatus === 'connecting' ? 'yellow' :
-                        vscodeConnectionStatus === 'connected' ? 'green' :
-                            vscodeConnectionStatus === 'error' ? 'red' : 'gray', dimColor: vscodeConnectionStatus !== 'error' },
-                    "\u25CF ",
-                    vscodeConnectionStatus === 'connecting' ? 'Connecting to VSCode...' :
-                        vscodeConnectionStatus === 'connected' ? 'VSCode Connected' :
-                            vscodeConnectionStatus === 'error' ? 'Connection Failed' : 'VSCode',
-                    vscodeConnectionStatus === 'connected' && editorContext.activeFile && ` | ${editorContext.activeFile}`,
-                    vscodeConnectionStatus === 'connected' && editorContext.selectedText && ` | ${editorContext.selectedText.length} chars selected`))))),
+                React.createElement(Text, { color: vscodeConnectionStatus === 'connecting'
+                        ? 'yellow'
+                        : vscodeConnectionStatus === 'connected'
+                            ? 'green'
+                            : vscodeConnectionStatus === 'error'
+                                ? 'red'
+                                : 'gray', dimColor: vscodeConnectionStatus !== 'error' },
+                    "\u25CF",
+                    ' ',
+                    vscodeConnectionStatus === 'connecting'
+                        ? 'Waiting for VSCode extension to connect...'
+                        : vscodeConnectionStatus === 'connected'
+                            ? 'VSCode Connected'
+                            : vscodeConnectionStatus === 'error'
+                                ? 'Connection Failed - Make sure Snow CLI extension is installed and active in VSCode'
+                                : 'VSCode',
+                    vscodeConnectionStatus === 'connected' &&
+                        editorContext.activeFile &&
+                        ` | ${editorContext.activeFile}`,
+                    vscodeConnectionStatus === 'connected' &&
+                        editorContext.selectedText &&
+                        ` | ${editorContext.selectedText.length} chars selected`))))),
         isCompressing && (React.createElement(Box, { marginTop: 1 },
             React.createElement(Text, { color: "cyan" },
                 React.createElement(Spinner, { type: "dots" }),