centaurus-cli 2.9.8 → 3.0.0

package/dist/ui/components/App.js

@@ -8,7 +8,7 @@ import * as path from 'path';
 import { quickLog } from '../../utils/conversation-logger.js';
 import { WelcomeBanner } from './WelcomeBanner.js';
 import { InputBox } from './InputBox.js';
-import { MessageDisplay, countImagesInMessage } from './MessageDisplay.js';
+import { MessageDisplay, countFilesInMessage } from './MessageDisplay.js';
 import { StreamingMessageDisplay } from './StreamingMessageDisplay.js';
 import { LoadingIndicator } from './LoadingIndicator.js';
 import { AgentTimer } from './AgentTimer.js';
@@ -69,21 +69,21 @@ const MessageList = React.memo(({ history, current, showBanner }) => {
     const staticItems = React.useMemo(() => {
         return showBanner ? [BANNER_ITEM, ...history] : history;
     }, [history, showBanner]);
-    // Calculate cumulative image counts for each message (for global numbering)
-    const imageCountsUpTo = React.useMemo(() => {
+    // Calculate cumulative file counts for each message (for global numbering)
+    const fileCountsUpTo = React.useMemo(() => {
         const counts = [];
         let cumulative = 0;
         for (const msg of history) {
             counts.push(cumulative);
             if (msg.role === 'user') {
-                cumulative += countImagesInMessage(msg.content);
+                cumulative += countFilesInMessage(msg.content);
             }
         }
         return counts;
     }, [history]);
-    // Get image count for current message (all images in history)
-    const totalHistoryImages = imageCountsUpTo.length > 0
-        ? imageCountsUpTo[imageCountsUpTo.length - 1] + (history[history.length - 1]?.role === 'user' ? countImagesInMessage(history[history.length - 1].content) : 0)
+    // Get file count for current message (all files in history)
+    const totalHistoryFiles = fileCountsUpTo.length > 0
+        ? fileCountsUpTo[fileCountsUpTo.length - 1] + (history[history.length - 1]?.role === 'user' ? countFilesInMessage(history[history.length - 1].content) : 0)
         : 0;
     return (React.createElement(Box, { flexDirection: "column", marginY: 1 },
         React.createElement(Static, { items: staticItems }, (item, index) => {
@@ -94,7 +94,7 @@ const MessageList = React.memo(({ history, current, showBanner }) => {
             const msg = item;
             // Calculate history index (account for banner if present)
             const historyIndex = showBanner ? index - 1 : index;
-            const imageCountBefore = imageCountsUpTo[historyIndex] || 0;
+            const fileCountBefore = fileCountsUpTo[historyIndex] || 0;
             if (msg.taskCompletion) {
                 return (React.createElement(TaskCompletedMessage, { key: item.id, taskNumber: msg.taskCompletion.taskNumber, totalTasks: msg.taskCompletion.totalTasks, taskDescription: msg.taskCompletion.taskDescription, completionNote: msg.taskCompletion.completionNote }));
             }
@@ -102,7 +102,7 @@ const MessageList = React.memo(({ history, current, showBanner }) => {
             if (msg.planAccepted) {
                 return (React.createElement(PlanAcceptedMessage, { key: item.id, planTitle: msg.planAccepted.planTitle, totalTasks: msg.planAccepted.totalTasks, tasks: msg.planAccepted.tasks }));
             }
-            return React.createElement(MessageDisplay, { key: item.id, message: item, imageCountBefore: imageCountBefore });
+            return React.createElement(MessageDisplay, { key: item.id, message: item, fileCountBefore: fileCountBefore });
         }),
         current && !history.some(msg => msg.id === current.id) && (() => {
             // Get terminal dimensions to determine if streaming should be enabled
@@ -114,7 +114,7 @@ const MessageList = React.memo(({ history, current, showBanner }) => {
                 return (React.createElement(StreamingMessageDisplay, { key: current.id, message: current, maxLines: dimensions.maxStreamingLines }));
             }
             else {
-                return React.createElement(MessageDisplay, { key: current.id, message: current, imageCountBefore: totalHistoryImages });
+                return React.createElement(MessageDisplay, { key: current.id, message: current, fileCountBefore: totalHistoryFiles });
             }
         })()));
 }, (prevProps, nextProps) => {
@@ -175,7 +175,7 @@ const RenameInputScreen = ({ currentTitle, onRename, onCancel }) => {
         React.createElement(Box, { marginTop: 1 },
             React.createElement(Text, { dimColor: true }, "Press Enter to save, ESC to cancel"))));
 };
-export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode, onResponseReceived, onDirectMessage, onResponseStream, onClearStreamedResponse, onThoughtStream, onThoughtComplete, onPickerSetup, onPickerSelection, onToolExecutionUpdate, onToolApprovalRequest, onToolStreamingOutput, onPlanModeChange, onPlanApprovalRequest, onPlanCreated, onTaskCompleted, onCommandModeChange, onToggleCommandMode, onBackgroundModeChange, onToggleBackgroundMode, onBackgroundTaskCountChange, onSubAgentCountChange, onSetAutoModeSetup, onCwdChange, onModelChange, onSubshellContextChange, onPasswordRequest, onShellInput, onShellSignal, onKillProcess, onInteractiveEditorMode, onConnectionStatusUpdate, onTokenCountUpdate, onContextLimitReached, onChatPickerSetup, onChatPickerSelection, onChatDeletePickerSetup, onChatDeletePickerSelection, onChatListSetup, onChatRenamePickerSetup, onChatRename, onRestoreMessagesSetup, onUIMessageHistoryUpdate, onBackgroundTaskListSetup, onBackgroundTaskSelection, onBackgroundTaskCancelSetup, onBackgroundTaskCancel, onBackgroundTaskViewSetup, onSessionQuotaUpdate, onMCPAddScreenSetup, onMCPRemoveScreenSetup, onMCPEnableScreenSetup, onMCPDisableScreenSetup, onMCPListScreenSetup, onMCPAddServer, onMCPRemoveServer, onMCPEnableServer, onMCPDisableServer, onMCPValidateConfig, onPromptAnswered, getMainConversation, onWarpifySession, onAiAutoSuggestChange, onWorkflowCreatorSetup, onWorkflowSave, getCheckpoints, onRevertToCheckpointSetup, onSetInputSetup }) => {
+export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode, onResponseReceived, onDirectMessage, onResponseStream, onClearStreamedResponse, onThoughtStream, onThoughtComplete, onPickerSetup, onPickerSelection, onToolExecutionUpdate, onToolApprovalRequest, onToolStreamingOutput, onPlanModeChange, onPlanApprovalRequest, onPlanCreated, onTaskCompleted, onCommandModeChange, onToggleCommandMode, onBackgroundModeChange, onToggleBackgroundMode, onBackgroundTaskCountChange, onSubAgentCountChange, onSetAutoModeSetup, onCwdChange, onModelChange, onSubshellContextChange, onPasswordRequest, onShellInput, onShellSignal, onKillProcess, onInteractiveEditorMode, onConnectionStatusUpdate, onTokenCountUpdate, onContextLimitReached, onChatPickerSetup, onChatPickerSelection, onChatDeletePickerSetup, onChatDeletePickerSelection, onChatListSetup, onChatRenamePickerSetup, onChatRename, onRestoreMessagesSetup, onUIMessageHistoryUpdate, onBackgroundTaskListSetup, onBackgroundTaskSelection, onBackgroundTaskCancelSetup, onBackgroundTaskCancel, onBackgroundTaskViewSetup, onSessionQuotaUpdate, onMCPAddScreenSetup, onMCPRemoveScreenSetup, onMCPEnableScreenSetup, onMCPDisableScreenSetup, onMCPListScreenSetup, onMCPAddServer, onMCPRemoveServer, onMCPEnableServer, onMCPDisableServer, onMCPValidateConfig, onPromptAnswered, getMainConversation, onWarpifySession, onAiAutoSuggestChange, onWorkflowCreatorSetup, onWorkflowSave, getCheckpoints, onRevertToCheckpointSetup, onSetInputSetup, onInterruptQueueUpdate, onQueuedMessageDispatched }) => {
     const { exit } = useApp();
     // Calculate limit for paginated lists (75% of terminal height)
     const listLimit = Math.max(5, Math.floor((process.stdout.rows || 24) * 0.75));
@@ -254,6 +254,7 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
         sessionQuotaExhausted: false,
         sessionQuotaTimeRemaining: '',
         aiAutoSuggest: false,
+        interruptQueue: [],
     });
     // Track last terminal width to detect actual width changes
     const lastTerminalWidthRef = React.useRef(process.stdout.columns || 80);
@@ -405,6 +406,38 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
             InputDetectionAgent.updateOutput(state.shellState.shellId, state.shellState.output);
         }
     }, [state.shellState?.output, state.shellState?.isAgentControlled, state.shellState?.shellId]);
+    // Handle interrupt queue updates
+    React.useEffect(() => {
+        onInterruptQueueUpdate((queue) => {
+            setState(prev => ({ ...prev, interruptQueue: [...queue] }));
+        });
+    }, [onInterruptQueueUpdate]);
+    // Handle queued message dispatch: add user message to history when it's actually being processed
+    // This ensures the correct order: only show the message when it's the AI's next turn, not when queued
+    React.useEffect(() => {
+        onQueuedMessageDispatched((message) => {
+            setState(prev => {
+                const userMessage = {
+                    id: `user-queued-${Date.now()}-${Math.random().toString(36).substring(2, 11)}`,
+                    role: 'user',
+                    content: message,
+                    timestamp: new Date()
+                };
+                // Move current message to history if present (skip thought-only)
+                const newHistory = prev.currentMessage && !shouldSkipMessage(prev.currentMessage)
+                    ? [...prev.messageHistory, prev.currentMessage, userMessage]
+                    : [...prev.messageHistory, userMessage];
+                return {
+                    ...prev,
+                    messageHistory: newHistory,
+                    currentMessage: null,
+                    isLoading: true,
+                    loadingMessage: 'Processing your request...',
+                    isAiWorking: true
+                };
+            });
+        });
+    }, [onQueuedMessageDispatched]);
     // Ref to track if we should strictly block incoming AI updates (Zombie Agent Protection)
     // This is set to true when an Agent-Controlled shell exits, essentially killing the "AI Agent"
     // associated with it from the UI perspective. It is reset when the user manually inputs a new message.
@@ -2268,7 +2301,7 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
             return;
         }
     }, { isActive: !state.isInteractiveEditorMode });
-    const handleSubmit = useCallback(async (value, clipboardImages) => {
+    const handleSubmit = useCallback(async (value, clipboardFiles) => {
         // Trim the value to remove any leading/trailing whitespace or newlines
         const trimmedValue = value.trim();
         if (!trimmedValue)
@@ -2351,69 +2384,37 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
             });
         }
         else if (!isSlashCommand) {
-            // Only add user message to display if it's not a slash command
-            // INTERRUPT HANDLING: If AI is currently working, cancel and clean up first
-            // This allows the new message to replace the interrupted turn
-            if (state.isAiWorking || state.isLoading) {
-                // Cancel current request (cli-adapter will clean up its history)
-                onCancelRequest();
-                // Small delay to allow abort to propagate before new request starts
-                await new Promise(resolve => setTimeout(resolve, 50));
-                // Clean up UI state: remove any partial/interrupted messages
-                setState(prev => {
-                    // Filter out the last user message (the one we're replacing)
-                    let cleanedHistory = [...prev.messageHistory];
-                    for (let i = cleanedHistory.length - 1; i >= 0; i--) {
-                        if (cleanedHistory[i].role === 'user') {
-                            cleanedHistory.splice(i, 1);
-                            break; // Only remove the most recent user message
-                        }
-                    }
-                    return {
-                        ...prev,
-                        messageHistory: cleanedHistory,
-                        currentMessage: null,
-                        isLoading: false,
-                        isAiWorking: false,
-                        approvalRequest: undefined, // Clear any pending approval
-                    };
-                });
-            }
-            // Show user message IMMEDIATELY with image breadcrumbs (uploading state)
-            // Images will be uploaded in background, then AI will be called
-            const hasImagesToUpload = clipboardImages && clipboardImages.length > 0;
-            // Build initial content with placeholder image markers for immediate display
+            // Only add user message to display if it's not a slash command.
+            // The user message is added to messageHistory via the onQueuedMessageDispatched
+            // callback (fired by cli-adapter at the very start of processing, for both direct
+            // messages and queued interrupts). This ensures correct ordering and no duplicates.
+            // Show user message IMMEDIATELY with file breadcrumbs (uploading state)
+            // Files will be uploaded in background, then AI will be called
+            const hasFilesToUpload = clipboardFiles && clipboardFiles.length > 0;
+            // Build initial content with placeholder file markers for immediate display
             let initialDisplayContent = trimmedValue;
-            if (hasImagesToUpload) {
+            if (hasFilesToUpload) {
                 // Add placeholder markers that will be shown immediately
-                for (let i = 0; i < clipboardImages.length; i++) {
-                    const image = clipboardImages[i];
+                for (let i = 0; i < clipboardFiles.length; i++) {
+                    const file = clipboardFiles[i];
                     // Use a placeholder format that MessageDisplay can render as breadcrumb
-                    // Format: [IMAGE: filename (uploading...)] - will be updated after upload
-                    initialDisplayContent = `${initialDisplayContent} [IMAGE: ${image.displayName} (gs://uploading)]`;
+                    // Format: [FILE: filename (uploading...)] - will be updated after upload
+                    const markerType = file.mimeType?.startsWith('image/') ? 'IMAGE' : 'FILE';
+                    initialDisplayContent = `${initialDisplayContent} [${markerType}: ${file.displayName} (gs://uploading)]`;
                 }
             }
             // Generate a stable message ID that we can use to update the message later
             const userMessageId = `user-${Date.now()}-${Math.random().toString(36).substring(2, 11)}`;
-            setState(prev => {
-                const newHistory = prev.currentMessage && !shouldSkipMessage(prev.currentMessage)
-                    ? [...prev.messageHistory, prev.currentMessage]
-                    : prev.messageHistory;
-                const userMessage = {
-                    id: userMessageId,
-                    role: 'user',
-                    content: initialDisplayContent,
-                    timestamp: new Date()
-                };
-                return {
-                    ...prev,
-                    messageHistory: [...newHistory, userMessage],
-                    currentMessage: null,
-                    isLoading: true,
-                    loadingMessage: hasImagesToUpload ? 'Uploading image(s)...' : 'Processing your request...',
-                    isAiWorking: true
-                };
-            });
+            // Update loading state immediately so the UI shows "processing" feedback.
+            // Note: we do NOT add to messageHistory here — that is handled by the
+            // onQueuedMessageDispatched callback which fires synchronously inside
+            // cli-adapter.handleMessage before AI processing begins.
+            setState(prev => ({
+                ...prev,
+                isLoading: true,
+                loadingMessage: hasFilesToUpload ? 'Uploading file(s)...' : 'Processing your request...',
+                isAiWorking: true
+            }));
         }
         else {
             // For slash commands, just show loading state
@@ -2432,12 +2433,12 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                 : [...prev.commandHistory, trimmedValue]
         }));
         try {
-            // Upload clipboard images if present
-            let messageWithImages = trimmedValue;
-            // Debug logging for clipboard images
-            logDebug(`[CLIPBOARD] clipboardImages count: ${clipboardImages?.length || 0}`);
+            // Upload clipboard files if present
+            let messageWithFiles = trimmedValue;
+            // Debug logging for clipboard files
+            logDebug(`[CLIPBOARD] clipboardFiles count: ${clipboardFiles?.length || 0}`);
             logDebug(`[CLIPBOARD] currentChatId: ${state.currentChatId || 'null'}`);
-            if (clipboardImages && clipboardImages.length > 0) {
+            if (clipboardFiles && clipboardFiles.length > 0) {
                 // Check for existing conversation ID - conversationManager is the single source of truth
                 // This ensures we use the same conversation that cli-adapter uses
                 let conversationId = conversationManager.getCurrentConversationId() || state.currentChatId;
@@ -2446,7 +2447,7 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                 if (!conversationId) {
                     // No conversation exists anywhere - create one via conversationManager
                     // This will set the internal state that cli-adapter's ensureConversationStarted checks
-                    logDebug(`[CLIPBOARD] No existing conversation - creating new one for image upload`);
+                    logDebug(`[CLIPBOARD] No existing conversation - creating new one for file upload`);
                     try {
                         const newConversation = await conversationManager.startNewConversation('New Chat', state.currentModel || 'gemini-2-flash-preview', 'google', undefined // workingDirectory - will use process.cwd()
                         );
@@ -2461,38 +2462,40 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                         logDebug(`[CLIPBOARD] Proceeding with upload`);
                     }
                     catch (createError) {
-                        logError('Failed to create conversation for image upload', createError instanceof Error ? createError : undefined);
+                        logError('Failed to create conversation for file upload', createError instanceof Error ? createError : undefined);
                         // Mark the upload as failed - don't use temp IDs that will fail FK constraint
-                        for (let i = 0; i < clipboardImages.length; i++) {
-                            messageWithImages = messageWithImages.replace(/#image\b/i, '[IMAGE UPLOAD FAILED - No conversation]');
+                        for (let i = 0; i < clipboardFiles.length; i++) {
+                            messageWithFiles = messageWithFiles.replace(/#image\b/i, '[FILE UPLOAD FAILED - No conversation]');
                         }
                         logDebug(`[CLIPBOARD] Skipping upload due to conversation creation failure`);
                     }
                 }
                 // Only attempt upload if we have a valid conversation ID
                 if (conversationId && !conversationId.startsWith('temp_')) {
-                    logDebug(`[CLIPBOARD] Starting upload for ${clipboardImages.length} images with conversationId: ${conversationId}`);
-                    // Upload each clipboard image and build the final message content
-                    const uploadedImageMarkers = [];
-                    for (const image of clipboardImages) {
+                    logDebug(`[CLIPBOARD] Starting upload for ${clipboardFiles.length} files with conversationId: ${conversationId}`);
+                    // Upload each clipboard file and build the final message content
+                    const uploadedFileMarkers = [];
+                    for (const file of clipboardFiles) {
                         try {
-                            logDebug(`[CLIPBOARD] Uploading image: ${image.displayName}, size: ${image.sizeBytes} bytes`);
-                            const uploadResult = await apiClient.uploadFile(conversationId, image.displayName, image.mimeType, image.base64Data);
+                            logDebug(`[CLIPBOARD] Uploading file: ${file.displayName}, size: ${file.sizeBytes} bytes`);
+                            const uploadResult = await apiClient.uploadFile(conversationId, file.displayName, file.mimeType, file.base64Data);
                             logDebug(`[CLIPBOARD] Upload success! gcsUri: ${uploadResult.gcsUri || 'none'}`);
-                            // Append image reference info to message (for AI to know an image was attached)
+                            const markerType = file.mimeType?.startsWith('image/') ? 'IMAGE' : 'FILE';
+                            // Append file reference info to message (for AI to know a file was attached)
                             // The backend will use gcsUri for Vertex AI multimodal input
                             if (uploadResult.gcsUri) {
-                                // Build the real image marker with actual GCS URI
-                                messageWithImages = `${messageWithImages} [IMAGE: ${uploadResult.fileName} (${uploadResult.gcsUri})]`;
-                                uploadedImageMarkers.push(`[IMAGE: ${uploadResult.fileName} (${uploadResult.gcsUri})]`);
-                                logDebug(`[CLIPBOARD] Appended image marker: [IMAGE: ${uploadResult.fileName} (${uploadResult.gcsUri})]`);
+                                // Build the real file marker with actual GCS URI
+                                messageWithFiles = `${messageWithFiles} [${markerType}: ${uploadResult.fileName} (${uploadResult.gcsUri})]`;
+                                uploadedFileMarkers.push(`[${markerType}: ${uploadResult.fileName} (${uploadResult.gcsUri})]`);
+                                logDebug(`[CLIPBOARD] Appended file marker: [${markerType}: ${uploadResult.fileName} (${uploadResult.gcsUri})]`);
                             }
                         }
                         catch (uploadError) {
-                            // Log error but continue - image upload is optional
-                            logError('Failed to upload clipboard image', uploadError instanceof Error ? uploadError : undefined);
+                            // Log error but continue - file upload is optional
+                            const markerType = file.mimeType?.startsWith('image/') ? 'IMAGE' : 'FILE';
+                            logError('Failed to upload clipboard file', uploadError instanceof Error ? uploadError : undefined);
                             // Add a failed marker so user knows upload failed
-                            uploadedImageMarkers.push(`[IMAGE: ${image.displayName} (upload failed)]`);
+                            uploadedFileMarkers.push(`[${markerType}: ${file.displayName} (upload failed)]`);
                         }
                     }
                     // Update the user message in history with actual GCS URIs
@@ -2501,9 +2504,9 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                         const updatedHistory = prev.messageHistory.map(msg => {
                             // Find the user message we just added (it has placeholder markers)
                             if (msg.role === 'user' && msg.content.includes('(gs://uploading)')) {
-                                // Build new content: original text + real image markers
+                                // Build new content: original text + real file markers
                                 let newContent = trimmedValue;
-                                for (const marker of uploadedImageMarkers) {
+                                for (const marker of uploadedFileMarkers) {
                                     newContent = `${newContent} ${marker}`;
                                 }
                                 return { ...msg, content: newContent };
@@ -2527,8 +2530,8 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                         return { ...prev, messageHistory: updatedHistory };
                     });
                 } // End: if (conversationId && !startsWith temp_)
-            } // End: if (clipboardImages && clipboardImages.length > 0)
-            await onMessage(messageWithImages);
+            } // End: if (clipboardFiles && clipboardFiles.length > 0)
+            await onMessage(messageWithFiles);
         }
         catch (error) {
             // Add error message
@@ -2772,6 +2775,13 @@ export const App = ({ onMessage, onCancelRequest, initialModel, initialPlanMode,
                 !(state.currentMessage?.toolExecution?.status === 'executing') && (React.createElement(Box, { marginBottom: 1, paddingLeft: 1 },
                 React.createElement(LoadingIndicator, { key: "loading-indicator" }),
                 React.createElement(AgentTimer, { key: "agent-timer" }))),
+            state.interruptQueue && state.interruptQueue.length > 0 && (React.createElement(Box, { flexDirection: "column", marginBottom: 1 }, state.interruptQueue.map((msg, i) => (React.createElement(Text, { key: `interrupt-${i}`, color: "gray", dimColor: true },
+                "[Queued Interrupt ",
+                i + 1,
+                "/",
+                state.interruptQueue.length,
+                "] ",
+                msg))))),
             !state.shellState?.isFocused && (state.passwordRequest ? (React.createElement(PasswordPrompt, { message: state.passwordRequest.message, onSubmit: (password) => {
                     const resolve = state.passwordRequest?.resolve;
                     if (resolve) {