@parhelia/core 0.1.11014 → 0.1.11062

package/dist/editor/ai/AgentTerminal.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React, { useEffect, useState, useRef, useCallback, useLayoutEffect, ViewTransition, } from "react";
+import React, { useEffect, useState, useRef, useCallback, useLayoutEffect, useMemo, ViewTransition, } from "react";
 import { Send, AlertCircle, Loader2, User, Wand2, Square, Mic, MicOff, ChevronDown, ChevronUp, ListTodo, ExternalLink, } from "lucide-react";
 import { getAgent, startAgent, updateAgentSettings, updateAgentCostLimit, updateAgentContext, cancelAgent, canonicalizeAgentMetadata, getPendingPrompts, } from "../services/agentService";
 import { useEditContext, useFieldsEditContext } from "../client/editContext";
 import { Textarea } from "../../components/ui/textarea";
 import { Button } from "../../components/ui/button";
-import { PlaceholderInput } from "../../components/ui/PlaceholderInput";
+import { PlaceholderInput, } from "../../components/ui/PlaceholderInput";
 import { AiResponseMessage } from "./AiResponseMessage";
 import { AgentCostDisplay } from "./AgentCostDisplay";
 import { ContextInfoBar } from "./ContextInfoBar";
@@ -51,7 +51,8 @@ const extractPartialTodos = (jsonText) => {
     // First try to parse complete JSON
     try {
         const parsed = JSON.parse(jsonText);
-        return Array.isArray(parsed) ? parsed : parsed?.items || [];
+        const result = Array.isArray(parsed) ? parsed : parsed?.items || [];
+        return result;
     }
     catch (e) {
         // If JSON is incomplete, try to extract whatever todo items we can find
@@ -269,26 +270,53 @@ const extractTodosFromMessages = (messages) => {
             }
         }
     }
-    return todos;
+    // Deduplicate todos by ID (or text if no ID), keeping the latest version
+    // Later entries (from more recent messages) overwrite earlier ones
+    const todoMap = new Map();
+    for (const todo of todos) {
+        const key = todo.id || todo.text;
+        todoMap.set(key, todo);
+    }
+    const result = Array.from(todoMap.values());
+    // Only log when duplicates were actually removed (to reduce noise)
+    if (todos.length > result.length) {
+        console.log("🟡 TODO_DEBUG deduplication:", {
+            removed: todos.length - result.length,
+            before: todos.length,
+            after: result.length,
+        });
+    }
+    return result;
 };
 // TodoListPanel component
 const TodoListPanel = ({ messages, agentMetadata, }) => {
     const [isExpanded, setIsExpanded] = useState(true);
     // First try to get todos from agent metadata (real-time updates)
+    // Server sends additionalData.todoList directly via contextChanged status
     const metadataTodos = (() => {
         try {
             const todoList = agentMetadata?.additionalData?.todoList;
             if (todoList?.items && Array.isArray(todoList.items)) {
-                return todoList.items
+                const rawItems = todoList.items
                     .map((item, idx) => ({
                     id: item.id || `metadata-${idx}`,
                     text: item.text || item.label || String(item.task || item.title || ""),
-                    done: !!(item.done ?? item.completed ?? item.checked),
+                    done: !!(item.done ??
+                        item.completed ??
+                        item.checked ??
+                        item.status === "completed"),
                     note: item.note || item.description,
                     messageId: undefined,
                     sourceTitle: todoList.title,
                 }))
                     .filter((item) => item.text);
+                // Apply deduplication to metadata todos as well
+                const todoMap = new Map();
+                for (const todo of rawItems) {
+                    const key = todo.id || todo.text;
+                    todoMap.set(key, todo);
+                }
+                return Array.from(todoMap.values());
             }
         }
         catch (e) {
@@ -297,7 +325,8 @@ const TodoListPanel = ({ messages, agentMetadata, }) => {
         return null;
     })();
     // If we have metadata todos, use them; otherwise extract from messages
-    const todos = metadataTodos && metadataTodos.length > 0
+    const usingMetadata = metadataTodos && metadataTodos.length > 0;
+    const todos = usingMetadata
         ? metadataTodos
         : extractTodosFromMessages(messages);
     // Check if there's an active streaming message with incomplete todo content
@@ -528,9 +557,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     useEffect(() => {
         isWaitingRef.current = isWaitingForResponse;
     }, [isWaitingForResponse]);
-    // Dots visibility controlled by 1s idle timer since last incremental update
-    const [showDots, setShowDots] = useState(false);
-    const dotsTimeoutRef = useRef(null);
+    // Server-driven state: true when agent is actively processing (set by WebSocket messages)
+    const [isAgentThinking, setIsAgentThinking] = useState(false);
     const hasActiveStreaming = useCallback(() => {
         const current = messagesRef.current || [];
         return current.some((m) => !m.isCompleted && m.messageType === "streaming");
@@ -543,33 +571,32 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             return hasApprovalMetadata || hasPendingSuffix;
         }));
     }, []);
-    const resetDotsTimer = useCallback(() => {
-        if (dotsTimeoutRef.current) {
-            clearTimeout(dotsTimeoutRef.current);
-            dotsTimeoutRef.current = null;
-        }
-        const waiting = isWaitingRef.current;
-        const streaming = hasActiveStreaming();
-        const pendingApprovals = hasPendingApprovals();
-        // Don't show dots if there are pending approvals (waiting for user action)
-        if (!waiting && !streaming) {
-            setShowDots(false);
-            return;
-        }
-        if (pendingApprovals) {
-            setShowDots(false);
-            return;
+    // Collect all pending tool calls for batch approval functionality
+    const allPendingApprovals = useMemo(() => {
+        const pending = [];
+        for (const msg of messages) {
+            const toolCalls = msg.toolCalls || [];
+            for (const tc of toolCalls) {
+                const hasApprovalMetadata = !!tc.requiresApproval && tc.isCompleted === false;
+                const hasPendingSuffix = (tc.functionName || "").includes("(pending approval)");
+                const isApproved = (tc.functionName || "").includes("(approved)");
+                const isRejected = (tc.functionName || "").includes("(rejected)");
+                if ((hasApprovalMetadata || hasPendingSuffix) && !isApproved && !isRejected) {
+                    pending.push({
+                        messageId: tc.messageId || msg.id,
+                        dbMessageId: tc.dbMessageId,
+                        toolCallId: tc.toolCallId,
+                        riskLevel: tc.requiresApproval?.riskLevel,
+                    });
+                }
+            }
         }
-        // Show dots immediately when waiting or streaming
-        setShowDots(true);
-        dotsTimeoutRef.current = setTimeout(() => {
-            // Re-check conditions after a brief delay to avoid flicker
-            const stillWaiting = isWaitingRef.current;
-            const stillStreaming = hasActiveStreaming();
-            const stillPendingApprovals = hasPendingApprovals();
-            setShowDots((stillWaiting || stillStreaming) && !stillPendingApprovals);
-        }, 100);
-    }, [hasActiveStreaming, hasPendingApprovals]);
+        return pending;
+    }, [messages]);
+    // Handle mode switch to autonomous
+    const handleSwitchToAutonomous = useCallback(() => {
+        setMode("autonomous");
+    }, []);
     const [resolvedPageName, setResolvedPageName] = useState(undefined);
     const [resolvedComponentName, setResolvedComponentName] = useState(undefined);
     const [resolvedFieldName, setResolvedFieldName] = useState(undefined);
@@ -634,19 +661,6 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     useEffect(() => {
         localStorage.setItem("editor.agent.promptHistory", JSON.stringify(promptHistory));
     }, [promptHistory]);
-    // Clear idle timer on unmount
-    useEffect(() => {
-        return () => {
-            if (dotsTimeoutRef.current) {
-                clearTimeout(dotsTimeoutRef.current);
-                dotsTimeoutRef.current = null;
-            }
-        };
-    }, []);
-    // Whenever waiting state changes, restart idle timer logic
-    useEffect(() => {
-        resetDotsTimer();
-    }, [isWaitingForResponse, resetDotsTimer]);
     useEffect(() => {
         // Keep messagesRef synchronized with messages state
         messagesRef.current = messages;
@@ -662,6 +676,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const abortControllerRef = useRef(null);
     const messagesEndRef = useRef(null);
     const textareaRef = useRef(null);
+    const placeholderInputRef = useRef(null);
     const messagesContainerRef = useRef(null);
     const [shouldAutoScroll, setShouldAutoScroll] = useState(true);
     // WebSocket subscription state for agent streaming
@@ -885,8 +900,6 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         // Clear waiting state when first content chunk arrives
         setIsWaitingForResponse(false);
         isWaitingRef.current = false;
-        // Any content chunk is an incremental update -> reset idle timer
-        resetDotsTimer();
         // Extract cost/token data from message.cost (new structure)
         const cost = message.cost;
         if (cost &&
@@ -1048,8 +1061,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 messagesRef.current = updated;
                 return updated;
             });
-            // Tool call activity counts as activity; keep dots hidden for 1s
-            resetDotsTimer();
+            // If tool requires approval, agent is now waiting for user action - stop thinking
+            if (message.data?.requiresApproval) {
+                setIsAgentThinking(false);
+            }
         }
     }, [createNewStreamMessage]);
     const handleToolResult = useCallback((message, agentData) => {
@@ -1185,9 +1200,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             messagesRef.current = updated;
             return updated;
         });
-        // Tool result activity; reset idle timer
-        resetDotsTimer();
-    }, [resetDotsTimer]);
+    }, []);
     // Listen for local approval resolution to update UI
     useEffect(() => {
         const onApprovalResolved = (ev) => {
@@ -1196,6 +1209,12 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 const messageId = detail.messageId;
                 const toolCallId = detail.toolCallId;
                 const approved = !!detail.approved;
+                console.log("[AgentTerminal] Approval resolved:", {
+                    messageId,
+                    toolCallId,
+                    approved,
+                });
+                console.log("[AgentTerminal] Current message IDs:", messagesRef.current.map((m) => m.id));
                 if (!messageId || !toolCallId)
                     return;
                 // Update local state to reflect approval status
@@ -1238,20 +1257,13 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     messagesRef.current = updated;
                     return updated;
                 });
-                // After approval/rejection, check if there are any remaining pending approvals
-                // Only set waiting state if all approvals have been resolved
-                const stillHasPendingApprovals = messagesRef.current.some((m) => (m.toolCalls || []).some((tc) => {
-                    const hasApprovalMetadata = !!tc.requiresApproval && tc.isCompleted === false;
-                    const hasPendingSuffix = (tc.functionName || "").includes("(pending approval)");
-                    return hasApprovalMetadata || hasPendingSuffix;
-                }));
-                if (!stillHasPendingApprovals) {
-                    // All approvals resolved - agent will continue processing
-                    // Set waiting state and show dots to indicate ongoing activity
-                    setIsWaitingForResponse(true);
-                    isWaitingRef.current = true;
-                    resetDotsTimer();
-                }
+                // After any approval/rejection, the agent will resume processing
+                // Set thinking state immediately - if there are more pending approvals,
+                // the server will send another tool call requiring approval and we'll pause again
+                console.log("[AgentTerminal] Setting isAgentThinking=true after approval");
+                setIsWaitingForResponse(true);
+                isWaitingRef.current = true;
+                setIsAgentThinking(true);
             }
             catch (err) {
                 console.error("❌ Error handling approval resolution:", err);
@@ -1259,7 +1271,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         };
         window.addEventListener("agent:toolApprovalResolved", onApprovalResolved);
         return () => window.removeEventListener("agent:toolApprovalResolved", onApprovalResolved);
-    }, [resetDotsTimer]);
+    }, []);
     // Load agent data and messages
     const loadAgent = useCallback(async () => {
         try {
@@ -1486,17 +1498,29 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             setMessages(merged);
             // Normalize waiting/connecting/dots state based on freshly loaded status
             const runningNow = agentData.status === "running" || agentData.status === 1;
+            const waitingForApprovalNow = agentData.status === "waitingForApproval" ||
+                agentData.status === 2;
             const hasStreamingNow = merged.some((m) => !m.isCompleted && m.messageType === "streaming");
             if (runningNow || hasStreamingNow) {
                 setIsWaitingForResponse(true);
                 isWaitingRef.current = true;
+                // Agent is actively running, show thinking dots
+                setIsAgentThinking(true);
+            }
+            else if (waitingForApprovalNow) {
+                setIsWaitingForResponse(false);
+                isWaitingRef.current = false;
+                setIsConnecting(false);
+                // Agent is waiting for user approval, hide thinking dots
+                setIsAgentThinking(false);
             }
             else {
                 setIsWaitingForResponse(false);
                 isWaitingRef.current = false;
                 setIsConnecting(false);
+                // Agent is idle, hide thinking dots
+                setIsAgentThinking(false);
             }
-            resetDotsTimer();
             // Check if cost limit was exceeded (detect from existing messages)
             try {
                 const costLimitMessage = (agentData.messages || []).find((msg) => msg.role === "assistant" &&
@@ -1642,7 +1666,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             setIsWaitingForResponse(true);
             isWaitingRef.current = true;
             shouldCreateNewMessage.current = false;
-            resetDotsTimer();
+            // Server says agent is now thinking
+            setIsAgentThinking(true);
             return;
         }
         // Handle agent:user:message
@@ -1651,44 +1676,72 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             // Track in seenMessageIds for deduplication
             const normalizedId = messageId.toLowerCase();
             if (seenMessageIdsRef.current.has(normalizedId)) {
+                console.log("[AgentTerminal] Skipping duplicate user message:", messageId);
                 return;
             }
             seenMessageIdsRef.current.add(normalizedId);
-            // Add user message to the messages list
+            // Build the server user message
+            const serverUserMessage = {
+                id: messageId,
+                agentId: agent.id,
+                messageIndex: -1, // Will be determined by position
+                role: "user",
+                content: content,
+                name: "user",
+                messageType: "user",
+                isCompleted: true,
+                model: "",
+                tokensUsed: 0,
+                inputTokens: 0,
+                outputTokens: 0,
+                cachedInputTokens: 0,
+                inputTokenCost: 0,
+                outputTokenCost: 0,
+                cachedInputTokenCost: 0,
+                totalCost: 0,
+                currency: "USD",
+                createdDate: timestamp || new Date().toISOString(),
+                toolCalls: [],
+                // Store source agent information for display
+                ...(sourceAgentName || sourceAgent?.name
+                    ? {
+                        sourceAgentName: sourceAgentName || sourceAgent?.name,
+                    }
+                    : {}),
+            };
+            // Reconcile with optimistic message or add as new
             setMessages((prev) => {
-                // Double-check if message already exists (deduplication)
+                // Check if message already exists by server ID (deduplication)
                 if (prev.some((m) => m.id && m.id.toLowerCase() === normalizedId)) {
+                    console.log("[AgentTerminal] Message already exists by ID, skipping:", messageId);
                     return prev;
                 }
-                const userMessage = {
-                    id: messageId,
-                    agentId: agent.id,
-                    messageIndex: prev.length,
-                    role: "user",
-                    content: content,
-                    name: "user",
-                    messageType: "user",
-                    isCompleted: true,
-                    model: "",
-                    tokensUsed: 0,
-                    inputTokens: 0,
-                    outputTokens: 0,
-                    cachedInputTokens: 0,
-                    inputTokenCost: 0,
-                    outputTokenCost: 0,
-                    cachedInputTokenCost: 0,
-                    totalCost: 0,
-                    currency: "USD",
-                    createdDate: timestamp || new Date().toISOString(),
-                    toolCalls: [],
-                    // Store source agent information for display
-                    ...(sourceAgentName || sourceAgent?.name
-                        ? {
-                            sourceAgentName: sourceAgentName || sourceAgent?.name,
-                        }
-                        : {}),
-                };
-                const updated = [...prev, userMessage];
+                // Look for an optimistic (temp) message with matching content to replace
+                // Temp messages have IDs starting with "temp-"
+                const tempMessageIndex = prev.findIndex((m) => m.id?.startsWith("temp-") &&
+                    m.role === "user" &&
+                    m.content === content);
+                let updated;
+                if (tempMessageIndex !== -1) {
+                    // Replace the optimistic message with the server version
+                    console.log("[AgentTerminal] Replacing temp message with server message:", {
+                        tempId: prev[tempMessageIndex]?.id,
+                        serverId: messageId,
+                    });
+                    updated = [...prev];
+                    updated[tempMessageIndex] = {
+                        ...serverUserMessage,
+                        messageIndex: tempMessageIndex,
+                    };
+                }
+                else {
+                    // No matching temp message - add as new (e.g., message from another agent)
+                    console.log("[AgentTerminal] Adding new user message from server:", messageId);
+                    updated = [
+                        ...prev,
+                        { ...serverUserMessage, messageIndex: prev.length },
+                    ];
+                }
                 messagesRef.current = updated;
                 return updated;
             });
@@ -1754,6 +1807,22 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             else if (type === "ToolResult" || type === "toolResult") {
                 handleToolResult(agentStreamMessage, agent);
             }
+            else if (type === "ContextUpdate" || type === "contextUpdate") {
+                // Handle context updates from streaming - data contains additionalData.todoList
+                const contextData = data;
+                if (contextData?.additionalData) {
+                    setAgentMetadata((prev) => {
+                        const current = (prev || {});
+                        return {
+                            ...current,
+                            additionalData: {
+                                ...(current.additionalData || {}),
+                                ...contextData.additionalData,
+                            },
+                        };
+                    });
+                }
+            }
             return;
         }
         // Unified: agent:run:status (state only)
@@ -1789,7 +1858,6 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                         messagesRef.current = updated;
                         return updated;
                     });
-                    resetDotsTimer();
                     return;
                 }
                 if (statusData?.state === "streamOpen") {
@@ -1908,19 +1976,17 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     return;
                 }
                 if (statusData?.state === "contextChanged") {
-                    const nextContext = statusData.context || {};
+                    // Server sends additionalData directly (with todoList inside)
+                    const serverAdditionalData = statusData.additionalData || statusData.AdditionalData || {};
                     setAgentMetadata((prev) => {
                         const current = (prev || {});
-                        const currentWithoutContext = { ...current };
-                        delete currentWithoutContext.context;
-                        const next = {
-                            ...currentWithoutContext,
+                        return {
+                            ...current,
                             additionalData: {
                                 ...(current.additionalData || {}),
-                                context: nextContext,
+                                ...serverAdditionalData,
                             },
                         };
-                        return next;
                     });
                     return;
                 }
@@ -1950,7 +2016,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             isWaitingRef.current = false;
             setIsConnecting(false);
             shouldCreateNewMessage.current = false;
-            resetDotsTimer();
+            // Server says agent finished thinking
+            setIsAgentThinking(false);
             return;
         }
         // Lifecycle: agent:run:error
@@ -1962,26 +2029,17 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             setIsWaitingForResponse(false);
             isWaitingRef.current = false;
             setIsConnecting(false);
-            resetDotsTimer();
+            // Server says agent stopped thinking (error)
+            setIsAgentThinking(false);
             return;
         }
-    }, [
-        agent,
-        handleContentChunk,
-        handleToolCall,
-        handleToolResult,
-        resetDotsTimer,
-    ]);
-    // Keep refs for latest agent and resetDotsTimer to avoid adding them to effect deps
+    }, [agent, handleContentChunk, handleToolCall, handleToolResult]);
+    // Keep refs for latest agent to avoid adding them to effect deps
     const agentRef = useRef(agent);
-    const resetDotsTimerRef = useRef(resetDotsTimer);
     const handleAgentWebSocketMessageRef = useRef(handleAgentWebSocketMessage);
     useEffect(() => {
         agentRef.current = agent;
     }, [agent]);
-    useEffect(() => {
-        resetDotsTimerRef.current = resetDotsTimer;
-    }, [resetDotsTimer]);
     useEffect(() => {
         handleAgentWebSocketMessageRef.current = handleAgentWebSocketMessage;
     }, [handleAgentWebSocketMessage]);
@@ -2030,17 +2088,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 setIsWaitingForResponse(true);
                 isWaitingRef.current = true;
                 shouldCreateNewMessage.current = false;
-                resetDotsTimerRef.current();
+                // Agent is currently running, show thinking dots
+                setIsAgentThinking(true);
             }
             else if (isWaitingForApproval) {
                 setIsWaitingForResponse(false);
                 isWaitingRef.current = false;
-                resetDotsTimerRef.current();
+                // Agent is waiting for user approval, hide thinking dots
+                setIsAgentThinking(false);
             }
             else {
                 setIsWaitingForResponse(false);
                 isWaitingRef.current = false;
-                resetDotsTimerRef.current();
+                // Agent is idle, hide thinking dots
+                setIsAgentThinking(false);
             }
         }
         return () => {
@@ -2057,7 +2118,12 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             unsubscribe();
             subscribedAgentIdRef.current = null;
         };
-    }, [isActive, agentStub.id, editContext?.addSocketMessageListener]);
+    }, [
+        isActive,
+        agentStub.id,
+        editContext?.addSocketMessageListener,
+        editContext?.socketConnectionVersion,
+    ]);
     // Focus prompt when requested globally (from AI command)
     useEffect(() => {
         const focusHandler = () => {
@@ -2098,6 +2164,11 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             setQueuedPrompts([]);
             return;
         }
+        // Skip fetching for new agents that don't exist on the server yet
+        if (agent.status === "new") {
+            setQueuedPrompts([]);
+            return;
+        }
         // Fetch once on mount, then rely on WebSocket updates
         const fetchInitialPrompts = async () => {
             try {
@@ -2109,7 +2180,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             }
         };
         fetchInitialPrompts();
-    }, [agent?.id]);
+    }, [agent?.id, agent?.status]);
     // Update selected model when the active profile or agent model changes
     useEffect(() => {
         if (!activeProfile)
@@ -2186,15 +2257,77 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         }
     }, [agent?.id]);
     const handleSubmit = async () => {
-        if (isSubmitting || !editContext)
+        // Guard against double-submit and missing context
+        if (isSubmitting) {
+            console.warn("[AgentTerminal] handleSubmit blocked: already submitting");
+            return;
+        }
+        if (!editContext) {
+            console.error("[AgentTerminal] handleSubmit blocked: editContext is undefined");
+            setError("Editor context not available. Please refresh the page.");
+            return;
+        }
+        // If placeholder input is active, delegate to its submit method
+        if (activePlaceholderInput && allPlaceholdersFilled) {
+            placeholderInputRef.current?.submit();
             return;
+        }
+        // Save the prompt text before any state changes
+        const savedPrompt = prompt.trim();
+        // Check if agent is new - allow empty prompts for new agents to trigger greeting
+        const isNewAgent = agentStub.status === "new" || agent?.status === "new";
+        if (!savedPrompt && !isNewAgent) {
+            console.warn("[AgentTerminal] handleSubmit blocked: empty prompt");
+            return;
+        }
+        // For new agents, use agentStub.id; for existing agents, use agent.id
+        const agentId = agent?.id || agentStub.id;
+        if (!agentId) {
+            console.error("[AgentTerminal] handleSubmit blocked: no agentId available");
+            setError("Agent not ready. Please try again.");
+            return;
+        }
+        // Generate a temporary ID for optimistic UI - will be replaced by server ID
+        const tempMessageId = `temp-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
         try {
             setIsSubmitting(true);
             setError(null);
-            // For new agents, use agentStub.id; for existing agents, use agent.id
-            const agentId = agent?.id || agentStub.id;
-            if (!agentId)
-                return;
+            // Clear prompt immediately for responsive UX
+            setPrompt("");
+            // Only add optimistic user message if there's actual content
+            // Empty prompts for new agents will trigger greeting generation
+            if (savedPrompt) {
+                const optimisticUserMessage = {
+                    id: tempMessageId,
+                    agentId: agentId,
+                    messageIndex: -1, // Will be set by server
+                    role: "user",
+                    content: savedPrompt,
+                    name: "user",
+                    messageType: "user",
+                    isCompleted: true,
+                    model: "",
+                    tokensUsed: 0,
+                    inputTokens: 0,
+                    outputTokens: 0,
+                    cachedInputTokens: 0,
+                    inputTokenCost: 0,
+                    outputTokenCost: 0,
+                    cachedInputTokenCost: 0,
+                    totalCost: 0,
+                    currency: "USD",
+                    createdDate: new Date().toISOString(),
+                    toolCalls: [],
+                };
+                setMessages((prev) => {
+                    const updated = [...prev, optimisticUserMessage];
+                    messagesRef.current = updated;
+                    return updated;
+                });
+                console.log("[AgentTerminal] Added optimistic user message:", tempMessageId);
+            }
+            // Re-enable auto-scroll when user submits a new message
+            setShouldAutoScroll(true);
             // Optional context factory: invoke if configured and available, otherwise continue
             const factoryName = agentMetadata?.additionalData
                 ?.contextFactory;
@@ -2212,12 +2345,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     console.warn(`Context factory not found: ${factoryName}. Proceeding without it.`);
                 }
             }
-            // NOTE: User message is no longer added optimistically here
-            // It will be added when we receive the agent:user:message broadcast from the server
-            // This ensures all tabs (including the sending tab) have the same messageId from the database
             const request = {
                 agentId: agentId,
-                message: prompt.trim(),
+                message: savedPrompt,
                 sessionId: editContext.sessionId,
                 profileId: activeProfile?.id || profiles[0]?.id || "",
                 profile: activeProfile?.name || profiles[0]?.name || "",
@@ -2227,18 +2357,16 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 deterministic: deterministicFlags.deterministic,
                 seed: deterministicFlags.seed,
             };
-            // Starting agent
-            // Re-enable auto-scroll when user submits a new message
-            setShouldAutoScroll(true);
-            // No need to create a temporary message - the stream will create messages as needed
+            console.log("[AgentTerminal] Calling startAgent API for agent:", agentId);
             const response = await startAgent(request);
+            console.log("[AgentTerminal] startAgent response:", response);
             // Check if prompt was queued (agent was already running)
             const wasQueued = response.message?.toLowerCase().includes("queued") ||
                 response.status === "Queued";
             if (wasQueued) {
                 // Prompt was queued - show a brief notification but don't set waiting state
                 // The prompt will be processed when the agent becomes idle
-                console.log("Prompt queued for processing");
+                console.log("[AgentTerminal] Prompt queued for processing");
                 // Don't set isWaitingForResponse since the agent is already running
                 setIsWaitingForResponse(false);
                 isWaitingRef.current = false;
@@ -2246,30 +2374,34 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             else {
                 // Normal submission - set waiting state to show dancing dots immediately
                 setIsWaitingForResponse(true);
-                // Update the ref immediately so resetDotsTimer sees the new state
                 isWaitingRef.current = true;
-                // Start idle timer; dots appear only if no chunks for >1s
-                resetDotsTimer();
+                // Optimistically set thinking state (will be confirmed by agent:run:start)
+                setIsAgentThinking(true);
             }
             // If user changed mode/model while the agent was new, persist them now
             await persistPendingSettingsIfNeeded();
             // Save prompt to history
-            if (prompt.trim()) {
-                setPromptHistory((prev) => [
-                    prompt.trim(),
-                    ...prev.filter((p) => p !== prompt.trim()).slice(0, 9),
-                ]);
-                setCurrentHistoryIndex(-1);
-            }
-            setPrompt("");
+            setPromptHistory((prev) => [
+                savedPrompt,
+                ...prev.filter((p) => p !== savedPrompt).slice(0, 9),
+            ]);
+            setCurrentHistoryIndex(-1);
             // WebSocket connection is already active via subscription - no need for SSE
         }
         catch (err) {
-            console.error("Failed to submit prompt:", err);
-            setError("Failed to submit prompt");
+            console.error("[AgentTerminal] Failed to submit prompt:", err);
+            setError("Failed to submit prompt. Please try again.");
             setIsWaitingForResponse(false);
-            // Remove the optimistically added user message on error
-            setMessages((prev) => prev.slice(0, -1));
+            isWaitingRef.current = false;
+            // Remove the optimistic user message on API error
+            // Match by the temp ID we generated
+            setMessages((prev) => {
+                const updated = prev.filter((m) => m.id !== tempMessageId);
+                messagesRef.current = updated;
+                return updated;
+            });
+            // Restore the prompt so user doesn't lose their text
+            setPrompt(savedPrompt);
         }
         finally {
             setIsSubmitting(false);
@@ -2326,14 +2458,64 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     };
     // Send a message programmatically (used by quick-action buttons)
     const sendQuickMessage = async (text) => {
-        if (!text.trim() || isSubmitting || !editContext)
+        const savedPrompt = text.trim();
+        if (!savedPrompt) {
+            console.warn("[AgentTerminal] sendQuickMessage blocked: empty text");
             return;
+        }
+        if (isSubmitting) {
+            console.warn("[AgentTerminal] sendQuickMessage blocked: already submitting");
+            return;
+        }
+        if (!editContext) {
+            console.error("[AgentTerminal] sendQuickMessage blocked: editContext is undefined");
+            setError("Editor context not available. Please refresh the page.");
+            return;
+        }
+        const agentId = agent?.id;
+        if (!agentId) {
+            console.error("[AgentTerminal] sendQuickMessage blocked: no agentId available");
+            setError("Agent not ready. Please try again.");
+            return;
+        }
+        // Generate a temporary ID for optimistic UI
+        const tempMessageId = `temp-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
         try {
             setIsSubmitting(true);
             setError(null);
-            const agentId = agent?.id;
-            if (!agentId)
-                return;
+            // Add optimistic user message to UI immediately
+            const optimisticUserMessage = {
+                id: tempMessageId,
+                agentId: agentId,
+                messageIndex: -1,
+                role: "user",
+                content: savedPrompt,
+                name: "user",
+                messageType: "user",
+                isCompleted: true,
+                model: "",
+                tokensUsed: 0,
+                inputTokens: 0,
+                outputTokens: 0,
+                cachedInputTokens: 0,
+                inputTokenCost: 0,
+                outputTokenCost: 0,
+                cachedInputTokenCost: 0,
+                totalCost: 0,
+                currency: "USD",
+                createdDate: new Date().toISOString(),
+                toolCalls: [],
+            };
+            setMessages((prev) => {
+                const updated = [...prev, optimisticUserMessage];
+                messagesRef.current = updated;
+                return updated;
+            });
+            console.log("[AgentTerminal] Added optimistic quick message:", tempMessageId);
+            setIsWaitingForResponse(true);
+            isWaitingRef.current = true;
+            setIsAgentThinking(true);
+            setShouldAutoScroll(true);
             // Optional context factory: invoke if configured and available, otherwise continue
             const factoryName = agentMetadata?.additionalData
                 ?.contextFactory;
@@ -2351,12 +2533,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     console.warn(`Context factory not found: ${factoryName}. Proceeding without it.`);
                 }
             }
-            // NOTE: User message is no longer added optimistically here
-            // It will be added when we receive the agent:user:message broadcast from the server
-            // This ensures all tabs (including the sending tab) have the same messageId from the database
             const request = {
                 agentId: agent.id,
-                message: text.trim(),
+                message: savedPrompt,
                 sessionId: editContext.sessionId,
                 profileId: activeProfile?.id || profiles[0]?.id || "",
                 profile: activeProfile?.name || profiles[0]?.name || "",
@@ -2366,21 +2545,23 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 deterministic: deterministicFlags.deterministic,
                 seed: deterministicFlags.seed,
             };
-            setIsWaitingForResponse(true);
-            // Update the ref immediately so resetDotsTimer sees the new state
-            isWaitingRef.current = true;
-            resetDotsTimer();
-            setShouldAutoScroll(true);
+            console.log("[AgentTerminal] Calling startAgent API for quick message");
             await startAgent(request);
             // If user changed mode/model while the agent was new, persist them now
             await persistPendingSettingsIfNeeded();
             // WebSocket connection is already active via subscription - no need for SSE
         }
         catch (err) {
-            console.error("Failed to submit quick message:", err);
-            setError("Failed to submit prompt");
+            console.error("[AgentTerminal] Failed to submit quick message:", err);
+            setError("Failed to submit prompt. Please try again.");
             setIsWaitingForResponse(false);
-            setMessages((prev) => prev.slice(0, -1));
+            isWaitingRef.current = false;
+            // Remove the optimistic user message on API error
+            setMessages((prev) => {
+                const updated = prev.filter((m) => m.id !== tempMessageId);
+                messagesRef.current = updated;
+                return updated;
+            });
         }
         finally {
             setIsSubmitting(false);
@@ -2629,6 +2810,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         try {
             setIsWaitingForResponse(false);
             isWaitingRef.current = false;
+            // User stopped the agent, hide thinking dots
+            setIsAgentThinking(false);
             // Request backend to stop the current execution (does NOT close the agent)
             if (agentStub?.id) {
                 try {
@@ -2654,13 +2837,11 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 messagesRef.current = updated;
                 return updated;
             });
-            // Update indicator state
-            resetDotsTimer();
         }
         catch (e) {
             console.error("Failed to stop agent execution", e);
         }
-    }, [resetDotsTimer]);
+    }, []);
     // Determine effective cost limit from agent, profile, or metadata so the cost display
     // is visible immediately even before any messages or server-side persistence.
     let effectiveCostLimit;
@@ -2688,6 +2869,17 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         isConnecting ||
         isWaitingForResponse ||
         hasActiveStreaming();
+    // Compute dots visibility: server-driven state takes priority
+    const shouldShowDots = useMemo(() => {
+        // Don't show if cost limit exceeded (waiting for user action)
+        if (costLimitExceeded)
+            return false;
+        // Use server-driven state as the primary source of truth
+        // This is set by agent:run:start and cleared by agent:run:complete/error
+        // It's also paused when a tool requires approval and resumed after approval
+        // Dots show during streaming too - they indicate the agent is actively working
+        return isAgentThinking;
+    }, [isAgentThinking, costLimitExceeded]);
     // Move useMemo hook before early return to comply with Rules of Hooks
     const isLiveEditorContextMode = React.useMemo(() => {
         try {
@@ -2724,6 +2916,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                 setCostLimitExceeded(null);
                                 setIsWaitingForResponse(true);
                                 isWaitingRef.current = true;
+                                setIsAgentThinking(true);
                                 setShouldAutoScroll(true);
                             }
                             catch (e) {
@@ -2746,7 +2939,12 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                             __html: activeProfile.svgIcon,
                                         } })) : (_jsx(SecretAgentIcon, { size: 96, strokeWidth: 1, className: "mx-auto mb-4 text-gray-400" })), activeProfile.greetingMessage ? (_jsx(ViewTransition, { children: _jsx("div", { className: "prose prose-sm mx-auto text-center", dangerouslySetInnerHTML: {
                                                 __html: activeProfile.greetingMessage,
-                                            } }) })) : (_jsxs(_Fragment, { children: [_jsx("h3", { className: "mb-2 text-lg font-medium text-gray-900", children: "Start a conversation" }), _jsx("p", { className: "mb-4 text-sm text-gray-500", children: "Send a message to begin working with your AI agent." }), _jsx("div", { className: "text-xs text-gray-400", children: "Your agent can help with content editing, research, and automation tasks." })] }))] })) }) })), renderErrorBanner(), _jsx("div", { className: "space-y-0 divide-y divide-gray-100 select-text", children: groupConsecutiveMessages(messages).map((group, groupIndex) => {
+                                            } }) })) : (_jsxs(_Fragment, { children: [_jsx("h3", { className: "mb-2 text-lg font-medium text-gray-900", children: "Start a conversation" }), _jsx("p", { className: "mb-4 text-sm text-gray-500", children: "Send a message to begin working with your AI agent." }), _jsx("div", { className: "text-xs text-gray-400", children: "Your agent can help with content editing, research, and automation tasks." })] }))] })) }) })), messages.length === 0 &&
+                        !error &&
+                        hideGreeting &&
+                        (isSubmitting || isConnecting) && (_jsx("div", { className: "flex h-full items-center justify-center p-8", children: _jsxs("div", { className: "flex flex-col items-center gap-4", children: [activeProfile?.svgIcon ? (_jsx("div", { className: "flex h-16 w-16 items-center justify-center text-gray-400 [&>svg]:h-full [&>svg]:w-full", dangerouslySetInnerHTML: {
+                                        __html: activeProfile.svgIcon,
+                                    } })) : (_jsx(SecretAgentIcon, { size: 64, strokeWidth: 1, className: "text-gray-400" })), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("span", { className: "h-2 w-2 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.3s]" }), _jsx("span", { className: "h-2 w-2 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.15s]" }), _jsx("span", { className: "h-2 w-2 animate-bounce rounded-full bg-gray-400" })] })] }) })), renderErrorBanner(), _jsx("div", { className: "space-y-0 divide-y divide-gray-100 select-text", children: groupConsecutiveMessages(messages).map((group, groupIndex) => {
                             if (group.type === "user" && group.messages[0]) {
                                 // Render user message
                                 return (_jsx(UserMessage, { message: group.messages[0] }, groupIndex));
@@ -2766,7 +2964,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                     return null;
                                 }
                                 const convertedMessages = convertAgentMessagesToAiFormat(filteredMessages);
-                                return (_jsx(AiResponseMessage, { messages: convertedMessages, finished: !isSubmitting && !isConnecting, editOperations: [], error: error || undefined, profileSvgIcon: activeProfile?.svgIcon, agentId: agent?.id || agentStub.id, agentName: activeProfile?.name, onQuickAction: (action) => {
+                                return (_jsx(AiResponseMessage, { messages: convertedMessages, finished: !isSubmitting && !isConnecting, editOperations: [], error: error || undefined, profileSvgIcon: activeProfile?.svgIcon, agentId: agent?.id || agentStub.id, agentName: activeProfile?.name, allPendingApprovals: allPendingApprovals, onSwitchToAutonomous: handleSwitchToAutonomous, onQuickAction: (action) => {
                                         const text = (action.prompt ||
                                             action.value ||
                                             action.label ||
@@ -2808,12 +3006,23 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                         sendQuickMessage(text);
                                     } }, groupIndex));
                             }
-                        }) }), messages.length > 0 && !hasActiveStreaming() && (_jsx("div", { className: showDots ? "visible" : "invisible", children: _jsxs("div", { className: "flex gap-3 p-4", children: [_jsx("div", { className: "flex-shrink-0", children: activeProfile?.svgIcon ? (_jsx("div", { className: "flex h-6 w-6 items-center justify-center text-gray-500 [&>svg]:h-full [&>svg]:w-full", dangerouslySetInnerHTML: {
-                                            __html: activeProfile.svgIcon,
-                                        } })) : (_jsx(SecretAgentIcon, { size: 24, strokeWidth: 1, className: "text-gray-500" })) }), _jsx("div", { className: "flex min-w-0 flex-1 items-center", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.3s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.15s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400" })] }) })] }) })), renderCostLimitBanner(), _jsx("div", { ref: messagesEndRef })] }), !hideContext && renderContextInfoBar(), !hideContext && agent?.id && activeProfile && (_jsx(AgentDocumentList, { agentId: agent.id, maxFileSizeMB: activeProfile.maxDocumentSizeMB ?? 10, enabled: activeProfile.enableDocumentUpload ?? false, profileId: activeProfile.id }, `${agent.id}-${agent.updatedDate || ""}-${activeProfile.id}`)), !hideContext && (_jsx(TodoListPanel, { messages: messages, agentMetadata: agentMetadata })), queuedPrompts.length > 0 && (_jsx("div", { className: "border-t border-gray-200 bg-amber-50/50", children: _jsxs("div", { className: "px-4 pt-3 pb-2", children: [_jsxs("div", { className: "mb-2 flex items-center gap-2", children: [_jsx("div", { className: "h-2 w-2 animate-pulse rounded-full bg-amber-500" }), _jsxs("span", { className: "text-xs font-semibold text-amber-900", children: ["Queued Messages (", queuedPrompts.length, ")"] })] }), _jsx("div", { className: "space-y-2", children: queuedPrompts.map((qp) => (_jsx("div", { className: "rounded-md border border-amber-200 bg-white p-2.5 text-xs", children: _jsx("div", { className: "flex items-start justify-between gap-2", children: _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "mb-1 flex items-center gap-1.5", children: qp.sourceAgentName ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "font-medium text-gray-700", children: ["From ", qp.sourceAgentName] }), qp.priority > 5 && (_jsx("span", { className: "rounded bg-red-100 px-1.5 py-0.5 text-[10px] font-medium text-red-700", children: "High Priority" }))] })) : (_jsx("span", { className: "font-medium text-gray-700", children: "From User" })) }), _jsx("div", { className: "break-words whitespace-pre-wrap text-gray-600", children: qp.prompt }), qp.createdDate && (_jsx("div", { className: "mt-1.5 text-[10px] text-gray-400", children: formatTime(new Date(qp.createdDate)) }))] }) }) }, qp.id))) })] }) })), _jsxs("div", { className: "border-t border-gray-200 p-4", children: [activePlaceholderInput ? (
+                        }) }), shouldShowDots &&
+                        (() => {
+                            // Check if there's any assistant content visible
+                            const hasAssistantContent = messages.some((m) => m.role === "assistant" &&
+                                (m.content || (m.toolCalls && m.toolCalls.length > 0)));
+                            if (!hasAssistantContent) {
+                                // No content yet - show dots WITH icon (like a new message row)
+                                return (_jsxs("div", { className: "flex gap-3 p-4", children: [_jsx("div", { className: "flex-shrink-0", children: activeProfile?.svgIcon ? (_jsx("div", { className: "flex h-6 w-6 items-center justify-center text-gray-500 [&>svg]:h-full [&>svg]:w-full", dangerouslySetInnerHTML: {
+                                                    __html: activeProfile.svgIcon,
+                                                } })) : (_jsx(SecretAgentIcon, { size: 24, strokeWidth: 1, className: "text-gray-500" })) }), _jsx("div", { className: "flex min-w-0 flex-1 items-center", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.3s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.15s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400" })] }) })] }));
+                            }
+                            // Content exists - show dots WITHOUT icon (inline at bottom)
+                            return (_jsxs("div", { className: "flex gap-3 px-4 pb-4", children: [_jsx("div", { className: "w-7 flex-shrink-0" }), _jsx("div", { className: "min-w-0 flex-1", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.3s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.15s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400" })] }) })] }));
+                        })(), renderCostLimitBanner(), _jsx("div", { ref: messagesEndRef })] }), !hideContext && renderContextInfoBar(), !hideContext && agent?.id && activeProfile && (_jsx(AgentDocumentList, { agentId: agent.id, maxFileSizeMB: activeProfile.maxDocumentSizeMB ?? 10, enabled: activeProfile.enableDocumentUpload ?? false, profileId: activeProfile.id }, `${agent.id}-${agent.updatedDate || ""}-${activeProfile.id}`)), !hideContext && (_jsx(TodoListPanel, { messages: messages, agentMetadata: agentMetadata })), queuedPrompts.length > 0 && (_jsx("div", { className: "border-t border-gray-200 bg-amber-50/50", children: _jsxs("div", { className: "px-4 pt-3 pb-2", children: [_jsxs("div", { className: "mb-2 flex items-center gap-2", children: [_jsx("div", { className: "h-2 w-2 animate-pulse rounded-full bg-amber-500" }), _jsxs("span", { className: "text-xs font-semibold text-amber-900", children: ["Queued Messages (", queuedPrompts.length, ")"] })] }), _jsx("div", { className: "space-y-2", children: queuedPrompts.map((qp) => (_jsx("div", { className: "rounded-md border border-amber-200 bg-white p-2.5 text-xs", children: _jsx("div", { className: "flex items-start justify-between gap-2", children: _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "mb-1 flex items-center gap-1.5", children: qp.sourceAgentName ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "font-medium text-gray-700", children: ["From ", qp.sourceAgentName] }), qp.priority > 5 && (_jsx("span", { className: "rounded bg-red-100 px-1.5 py-0.5 text-[10px] font-medium text-red-700", children: "High Priority" }))] })) : (_jsx("span", { className: "font-medium text-gray-700", children: "From User" })) }), _jsx("div", { className: "break-words whitespace-pre-wrap text-gray-600", children: qp.prompt }), qp.createdDate && (_jsx("div", { className: "mt-1.5 text-[10px] text-gray-400", children: formatTime(new Date(qp.createdDate)) }))] }) }) }, qp.id))) })] }) })), _jsxs("div", { className: "border-t border-gray-200 p-4", children: [activePlaceholderInput ? (
                     // Placeholder Input (from quick actions)
                     // Show buttons when hideBottomControls is true (e.g., splash screen) since normal submit area is hidden
-                    _jsx(PlaceholderInput, { text: activePlaceholderInput.text, showButtons: hideBottomControls, buttonsClassName: hideBottomControls ? "justify-end" : "", onFilledChange: setAllPlaceholdersFilled, onComplete: (filledText) => {
+                    _jsx(PlaceholderInput, { ref: placeholderInputRef, text: activePlaceholderInput.text, showButtons: hideBottomControls, buttonsClassName: hideBottomControls ? "justify-end" : "", onFilledChange: setAllPlaceholdersFilled, onComplete: (filledText) => {
                             setActivePlaceholderInput(null);
                             setAllPlaceholdersFilled(false);
                             if (activePlaceholderInput.behavior === "compose") {
@@ -3033,6 +3242,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                             language: lang,
                                                             version: 0,
                                                         });
+                                                        // Switch to content-tree view to show the profile settings
+                                                        editContext.switchView("content-tree");
                                                     }, children: [_jsx("span", { className: "max-w-[100px] truncate", children: activeProfile.name }), _jsx(ExternalLink, { className: "h-2.5 w-2.5 shrink-0", strokeWidth: 1.5 })] }) }), _jsx(TooltipContent, { side: "top", sideOffset: 6, children: "Open profile settings" })] }))] })] }))] })] }));
 }
 //# sourceMappingURL=AgentTerminal.js.map