@alpaca-editor/core 1.0.4049 → 1.0.4052

package/dist/editor/ai/AgentTerminal.js

@@ -0,0 +1,753 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, useRef, useCallback } from "react";
+import { Send, Bot, AlertCircle, Loader2, User } from "lucide-react";
+import { DancingDots } from "./DancingDots";
+import { getAgent, startAgent, connectToAgentStream, } from "../services/agentService";
+import { useEditContext } from "../client/editContext";
+import { Textarea } from "../../components/ui/textarea";
+import { Button } from "../../components/ui/button";
+import { AiResponseMessage } from "./AiResponseMessage";
+import { AgentCostDisplay } from "./AgentCostDisplay";
+// Simple user message component
+const UserMessage = ({ message }) => {
+    return (_jsxs("div", { className: "flex gap-3 p-4", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx(User, { className: "h-6 w-6 text-blue-600", strokeWidth: 1 }) }), _jsxs("div", { className: "min-w-0 flex-1 select-text", children: [_jsxs("div", { className: "mb-1 flex items-center gap-2", children: [_jsx("span", { className: "text-sm font-medium text-gray-900", children: "You" }), message.createdDate && (_jsx("span", { className: "text-xs text-gray-400", children: new Date(message.createdDate).toLocaleTimeString() }))] }), _jsx("div", { className: "prose prose-sm max-w-none text-sm text-gray-700 select-text", children: message.content })] })] }));
+};
+const groupConsecutiveMessages = (agentMessages) => {
+    // Work directly with the messages array - streaming messages are identified by their properties
+    const allMessages = agentMessages;
+    const groups = [];
+    let currentAssistantGroup = [];
+    for (const message of allMessages) {
+        if (message.role === "user") {
+            // Finish any current assistant group
+            if (currentAssistantGroup.length > 0) {
+                groups.push({
+                    type: "assistant-group",
+                    messages: currentAssistantGroup,
+                });
+                currentAssistantGroup = [];
+            }
+            // Add user message
+            groups.push({ type: "user", messages: [message] });
+        }
+        else if (message.role === "assistant") {
+            // Add to current assistant group
+            currentAssistantGroup.push(message);
+        }
+        // Skip tool messages as they're handled within assistant messages
+    }
+    // Add any remaining assistant group
+    if (currentAssistantGroup.length > 0) {
+        groups.push({ type: "assistant-group", messages: currentAssistantGroup });
+    }
+    return groups;
+};
+// Calculate total token usage and cost data from agent messages
+const calculateTotalTokens = (messages) => {
+    const totals = messages.reduce((acc, message) => {
+        return {
+            input: acc.input + (message.inputTokens || 0),
+            output: acc.output + (message.outputTokens || 0),
+            cached: acc.cached + (message.cachedInputTokens || 0),
+            inputCost: acc.inputCost + (message.inputTokenCost || 0),
+            outputCost: acc.outputCost + (message.outputTokenCost || 0),
+            cachedCost: acc.cachedCost + (message.cachedInputTokenCost || 0),
+            totalCost: acc.totalCost + (message.totalCost || 0),
+        };
+    }, {
+        input: 0,
+        output: 0,
+        cached: 0,
+        inputCost: 0,
+        outputCost: 0,
+        cachedCost: 0,
+        totalCost: 0,
+    });
+    return totals;
+};
+// Convert agent messages to AI terminal format for a response group
+const convertAgentMessagesToAiFormat = (agentMessages) => {
+    return agentMessages.map((agentMessage) => {
+        const message = {
+            id: agentMessage.id,
+            content: agentMessage.content,
+            formattedContent: agentMessage.content
+                ?.replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>")
+                ?.replace(/\n/g, "<br/>"),
+            name: agentMessage.name,
+            role: agentMessage.role,
+            tool_calls: agentMessage.toolCalls
+                ? agentMessage.toolCalls.map((toolCall) => ({
+                    id: toolCall.toolCallId,
+                    displayName: toolCall.functionName,
+                    function: {
+                        name: toolCall.functionName,
+                        arguments: toolCall.functionArguments,
+                        result: toolCall.functionResult,
+                        error: toolCall.functionError,
+                    },
+                }))
+                : [],
+        };
+        if (agentMessage.toolCallId) {
+            message.tool_call_id = agentMessage.toolCallId;
+        }
+        return message;
+    });
+};
+// interface AgentTerminalProps {
+//   agentStub: Agent;
+// }
+export function AgentTerminal({ agentStub }) {
+    const editContext = useEditContext();
+    const [agent, setAgent] = useState(undefined);
+    const [messages, setMessages] = useState([]);
+    const [prompt, setPrompt] = useState("");
+    const [isLoading, setIsLoading] = useState(false);
+    const [isConnecting, setIsConnecting] = useState(false);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [isWaitingForResponse, setIsWaitingForResponse] = useState(false);
+    const [promptHistory, setPromptHistory] = useState(() => {
+        if (typeof window !== "undefined") {
+            return JSON.parse(localStorage.getItem("editor.agent.promptHistory") || "[]");
+        }
+        return [];
+    });
+    const [currentHistoryIndex, setCurrentHistoryIndex] = useState(-1);
+    useEffect(() => {
+        localStorage.setItem("editor.agent.promptHistory", JSON.stringify(promptHistory));
+    }, [promptHistory]);
+    useEffect(() => {
+        // Keep messagesRef synchronized with messages state
+        messagesRef.current = messages;
+    }, [messages]);
+    const [error, setError] = useState(null);
+    // Flag to track when we should create a new message
+    const shouldCreateNewMessage = useRef(false);
+    // Keep a ref to the current messages for immediate access
+    const messagesRef = useRef([]);
+    const abortControllerRef = useRef(null);
+    const messagesEndRef = useRef(null);
+    const textareaRef = useRef(null);
+    const messagesContainerRef = useRef(null);
+    const [shouldAutoScroll, setShouldAutoScroll] = useState(true);
+    // Auto-scroll to bottom when new messages arrive
+    const scrollToBottom = useCallback(() => {
+        messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+    }, []);
+    // Check if user is at the bottom of the scroll container
+    const isAtBottom = useCallback(() => {
+        const container = messagesContainerRef.current;
+        if (!container)
+            return true;
+        const threshold = 100; // pixels from bottom to consider "at bottom"
+        return (container.scrollHeight - container.scrollTop - container.clientHeight <
+            threshold);
+    }, []);
+    // Handle scroll events to detect manual scrolling
+    const handleScroll = useCallback(() => {
+        const atBottom = isAtBottom();
+        if (atBottom !== shouldAutoScroll) {
+            setShouldAutoScroll(atBottom);
+        }
+    }, [isAtBottom, shouldAutoScroll]);
+    // Shared stream message handlers with messageId support
+    const createNewStreamMessage = useCallback((messageId, agentData) => {
+        const currentAgent = agentData || agent;
+        if (!currentAgent) {
+            console.error("❌ createNewStreamMessage: No agent available", {
+                messageId,
+                agentData: !!agentData,
+                agent: !!agent,
+            });
+            throw new Error("No agent available");
+        }
+        console.log("✅ Creating new stream message with agent:", currentAgent.id);
+        return {
+            id: messageId,
+            agentId: currentAgent.id,
+            messageIndex: -1,
+            role: "assistant",
+            content: "",
+            name: "agent",
+            messageType: "streaming",
+            isCompleted: false,
+            model: currentAgent.model || "",
+            tokensUsed: 0,
+            inputTokens: 0,
+            outputTokens: 0,
+            cachedInputTokens: 0,
+            inputTokenCost: 0,
+            outputTokenCost: 0,
+            cachedInputTokenCost: 0,
+            totalCost: 0,
+            currency: currentAgent.currency || "USD",
+            createdDate: new Date().toISOString(),
+            toolCalls: [],
+        };
+    }, [agent]);
+    const handleContentChunk = useCallback((message, agentData) => {
+        const messageId = message.data?.messageId;
+        if (!messageId) {
+            console.error("No messageId found in message data!");
+            return;
+        }
+        // Clear waiting state when first content chunk arrives
+        setIsWaitingForResponse(false);
+        // Always call setMessages and handle all logic in the callback with latest messages
+        setMessages((prev) => {
+            // Find existing message by messageId in the latest messages
+            const existingMessageIndex = prev.findIndex((msg) => msg.id === messageId);
+            if (existingMessageIndex === -1) {
+                // Message doesn't exist - create new streaming message
+                const newStreamMessage = createNewStreamMessage(messageId, agentData);
+                // Set the content for the new message
+                const updatedNewMessage = { ...newStreamMessage };
+                if (!message.data.isIncremental) {
+                    updatedNewMessage.content = message.data?.deltaContent || "";
+                }
+                else {
+                    updatedNewMessage.content = message.data?.deltaContent || "";
+                }
+                const updated = [...prev, updatedNewMessage];
+                messagesRef.current = updated;
+                return updated;
+            }
+            else {
+                // Message exists - update it
+                const existingMessage = prev[existingMessageIndex];
+                if (!existingMessage)
+                    return prev;
+                // Check if existing content is already longer than what we're trying to stream
+                const currentContentLength = existingMessage.content?.length || 0;
+                const totalContentLength = message.data?.totalContentLength || 0;
+                if (currentContentLength >= totalContentLength &&
+                    totalContentLength > 0) {
+                    return prev;
+                }
+                const updatedMessage = { ...existingMessage };
+                if (!message.data.isIncremental) {
+                    updatedMessage.content = message.data?.deltaContent || "";
+                }
+                else {
+                    updatedMessage.content =
+                        existingMessage.content + (message.data?.deltaContent || "");
+                }
+                const updated = prev.map((msg, index) => index === existingMessageIndex ? updatedMessage : msg);
+                messagesRef.current = updated;
+                return updated;
+            }
+        });
+    }, [createNewStreamMessage]);
+    const handleToolCall = useCallback((message, agentData) => {
+        const toolCallId = message.data?.toolCallId || message.data?.id || crypto.randomUUID();
+        const toolCallMessageId = message.data?.messageId;
+        // Find or create the target message for this tool call
+        if (toolCallMessageId) {
+            const currentMessages = messagesRef.current;
+            const existingMessageIndex = currentMessages.findIndex((msg) => msg.id === toolCallMessageId);
+            if (existingMessageIndex === -1) {
+                // Double-check with current ref to prevent race conditions
+                const currentMessages = messagesRef.current;
+                const existsInRef = currentMessages.find((msg) => msg.id === toolCallMessageId);
+                if (!existsInRef) {
+                    // Create new message for this tool call
+                    const newStreamMessage = createNewStreamMessage(toolCallMessageId, agentData);
+                    setMessages((prev) => {
+                        // Final check before adding to prevent duplicates
+                        const finalCheck = prev.find((msg) => msg.id === toolCallMessageId);
+                        if (finalCheck) {
+                            console.log("#!# ⚠️ Tool call message already exists in state, skipping:", toolCallMessageId);
+                            return prev;
+                        }
+                        const updated = [...prev, newStreamMessage];
+                        messagesRef.current = updated;
+                        return updated;
+                    });
+                }
+            }
+            else {
+                console.log("📋 Adding tool call to existing message:", toolCallMessageId);
+            }
+        }
+        // Add tool call to the message in the array
+        if (toolCallMessageId && message.data && toolCallId) {
+            const functionName = message.data.functionName ||
+                message.data.name ||
+                message.data.function?.name ||
+                "unknown";
+            const toolCall = {
+                id: toolCallId,
+                messageId: toolCallMessageId,
+                toolCallId: toolCallId,
+                functionName: functionName,
+                functionArguments: message.data.functionArguments ||
+                    message.data.arguments ||
+                    JSON.stringify(message.data.function?.arguments || {}),
+                functionResult: message.data.functionResult || message.data.result || "",
+                functionError: message.data.functionError || message.data.error || "",
+                isCompleted: false,
+                responseTimeMs: message.data.responseTimeMs,
+                createdDate: new Date().toISOString(),
+            };
+            // Check for duplicates using the current messages ref
+            const currentMessages = messagesRef.current;
+            const targetMessage = currentMessages.find((msg) => msg.id === toolCallMessageId);
+            if (targetMessage) {
+                const existingToolCalls = targetMessage.toolCalls || [];
+                const existingToolCallIndex = existingToolCalls.findIndex((tc) => tc.toolCallId === toolCallId);
+                if (existingToolCallIndex !== -1) {
+                    return; // Skip adding duplicate
+                }
+            }
+            setMessages((prev) => {
+                const updated = prev.map((msg) => {
+                    if (msg.id !== toolCallMessageId)
+                        return msg;
+                    const existingToolCalls = msg.toolCalls || [];
+                    return { ...msg, toolCalls: [...existingToolCalls, toolCall] };
+                });
+                messagesRef.current = updated;
+                return updated;
+            });
+        }
+    }, [createNewStreamMessage]);
+    const handleToolResult = useCallback((message, agentData) => {
+        const resultToolCallId = message.data?.toolCallId || message.data?.id || crypto.randomUUID();
+        const resultMessageId = message.data?.messageId;
+        // Update tool result directly in the messages array
+        if (!resultMessageId) {
+            console.warn("⚠️ No messageId provided for tool result");
+            return;
+        }
+        console.log("📋 Updating tool result in message:", resultMessageId);
+        // Update the message with tool result
+        setMessages((prev) => {
+            const updated = prev.map((msg) => {
+                if (msg.id !== resultMessageId)
+                    return msg;
+                const updatedMessage = { ...msg };
+                if (!updatedMessage.toolCalls) {
+                    updatedMessage.toolCalls = [];
+                }
+                // Find and update the tool call with the result
+                const toolCallIndex = updatedMessage.toolCalls.findIndex((tc) => tc.toolCallId === resultToolCallId);
+                if (toolCallIndex >= 0) {
+                    const existingToolCall = updatedMessage.toolCalls[toolCallIndex];
+                    if (existingToolCall && message.data) {
+                        const updatedToolCalls = [...updatedMessage.toolCalls];
+                        const toolCall = {
+                            id: existingToolCall.id,
+                            messageId: existingToolCall.messageId,
+                            toolCallId: existingToolCall.toolCallId,
+                            functionName: existingToolCall.functionName,
+                            functionArguments: existingToolCall.functionArguments,
+                            functionResult: message.data.functionResult || message.data.result || "",
+                            functionError: message.data.functionError || message.data.error || "",
+                            isCompleted: true,
+                            responseTimeMs: message.data.responseTimeMs,
+                            createdDate: existingToolCall.createdDate,
+                        };
+                        updatedToolCalls[toolCallIndex] = toolCall;
+                        updatedMessage.toolCalls = updatedToolCalls;
+                    }
+                    // Check if all tool calls in message are completed
+                    const allToolCallsCompleted = updatedMessage.toolCalls.every((tc) => tc.isCompleted);
+                    if (allToolCallsCompleted) {
+                        shouldCreateNewMessage.current = true;
+                    }
+                }
+                else if (message.data && resultToolCallId && resultMessageId) {
+                    // Create new tool call if it doesn't exist
+                    const functionName = message.data.functionName ||
+                        message.data.name ||
+                        message.data.function?.name ||
+                        "unknown";
+                    const toolCall = {
+                        id: resultToolCallId,
+                        messageId: resultMessageId,
+                        toolCallId: resultToolCallId,
+                        functionName: functionName,
+                        functionArguments: message.data.functionArguments ||
+                            message.data.arguments ||
+                            JSON.stringify(message.data.function?.arguments || {}),
+                        functionResult: message.data.functionResult || message.data.result || "",
+                        functionError: message.data.functionError || message.data.error || "",
+                        isCompleted: true,
+                        responseTimeMs: message.data.responseTimeMs,
+                        createdDate: new Date().toISOString(),
+                    };
+                    updatedMessage.toolCalls = [...updatedMessage.toolCalls, toolCall];
+                }
+                console.log("🔧 Updated tool calls count:", updatedMessage.toolCalls.length);
+                return updatedMessage;
+            });
+            messagesRef.current = updated;
+            return updated;
+        });
+    }, []);
+    // Connect to agent stream for real-time updates
+    const connectToStream = useCallback(async (agentData) => {
+        const currentAgent = agentData || agent;
+        if (!currentAgent)
+            return;
+        // Cancel any existing connection
+        if (abortControllerRef.current) {
+            abortControllerRef.current.abort();
+        }
+        const abortController = new AbortController();
+        abortControllerRef.current = abortController;
+        try {
+            setIsConnecting(true);
+            console.log("🔌 connectToStream: Starting stream connection");
+            await connectToAgentStream(currentAgent.id, (message) => {
+                switch (message.type) {
+                    case "contentChunk":
+                        handleContentChunk(message, currentAgent);
+                        break;
+                    case "toolCall":
+                        handleToolCall(message, currentAgent);
+                        break;
+                    case "toolResult":
+                        handleToolResult(message, currentAgent);
+                        break;
+                    case "statusUpdate":
+                        break;
+                    case "completed":
+                        const completedMessageId = message.data?.messageId;
+                        console.log("💾 Stream completed for message:", completedMessageId, "messages count:", messages.length);
+                        // Mark the specific message as completed by messageId
+                        if (completedMessageId) {
+                            setMessages((prev) => prev.map((msg) => {
+                                if (msg.id === completedMessageId) {
+                                    const updatedMessage = {
+                                        ...msg,
+                                        isCompleted: true,
+                                        messageType: "completed",
+                                    };
+                                    // Update token usage data if provided in the completed event
+                                    if (message.data) {
+                                        const data = message.data;
+                                        if (data.numInputTokens !== undefined) {
+                                            updatedMessage.inputTokens = data.numInputTokens;
+                                        }
+                                        if (data.numOutputTokens !== undefined) {
+                                            updatedMessage.outputTokens = data.numOutputTokens;
+                                        }
+                                        if (data.numCachedTokens !== undefined) {
+                                            updatedMessage.cachedInputTokens =
+                                                data.numCachedTokens;
+                                        }
+                                        // Update total tokens used
+                                        updatedMessage.tokensUsed =
+                                            (updatedMessage.inputTokens || 0) +
+                                                (updatedMessage.outputTokens || 0);
+                                        // Handle content that might only be sent in the completed event
+                                        if (data.deltaContent && data.deltaContent.trim()) {
+                                            if (!data.isIncremental) {
+                                                // Non-incremental: replace the entire content
+                                                updatedMessage.content = data.deltaContent;
+                                            }
+                                            else {
+                                                // Incremental: append to existing content
+                                                updatedMessage.content =
+                                                    (updatedMessage.content || "") +
+                                                        data.deltaContent;
+                                            }
+                                        }
+                                    }
+                                    return updatedMessage;
+                                }
+                                return msg;
+                            }));
+                        }
+                        else {
+                            // Fallback: Mark any streaming messages as completed (old behavior)
+                            console.warn("⚠️ No messageId in completed event, falling back to marking all streaming messages as completed");
+                            setMessages((prev) => prev.map((msg) => !msg.isCompleted && msg.messageType === "streaming"
+                                ? {
+                                    ...msg,
+                                    isCompleted: true,
+                                    messageType: "completed",
+                                }
+                                : msg));
+                        }
+                        shouldCreateNewMessage.current = false;
+                        break;
+                    case "error":
+                        console.error("❌ Stream error:", message.error);
+                        setError(message.error || "Stream error occurred");
+                        setIsWaitingForResponse(false);
+                        shouldCreateNewMessage.current = false;
+                        break;
+                    default:
+                        console.warn("❓ Unhandled message type:", {
+                            type: message.type,
+                            typeOf: typeof message.type,
+                            length: message.type?.length,
+                            charCodes: message.type
+                                ?.split("")
+                                .map((c) => c.charCodeAt(0)),
+                            message: message,
+                        });
+                        break;
+                }
+            }, abortController.signal);
+        }
+        catch (err) {
+            if (!abortController.signal.aborted) {
+                console.error("Stream connection failed:", err);
+                setError("Failed to connect to agent stream");
+            }
+        }
+        finally {
+            setIsConnecting(false);
+        }
+    }, [agent?.id, handleContentChunk, handleToolCall, handleToolResult]);
+    // Load agent data and messages
+    const loadAgent = useCallback(async () => {
+        try {
+            if (agentStub.status === "new") {
+                console.log("✅ Setting up new agent");
+                setAgent({
+                    ...agentStub,
+                    messages: [],
+                    status: "new",
+                    updatedDate: new Date().toISOString(),
+                    createdDate: new Date().toISOString(),
+                    id: agentStub.id,
+                    name: agentStub.name,
+                    model: "",
+                    currency: "USD",
+                    itemId: "",
+                    itemPath: "",
+                    language: "",
+                    version: 0,
+                    profileId: "",
+                    profileName: "",
+                    totalTokensUsed: 0,
+                    totalInputTokens: 0,
+                    totalOutputTokens: 0,
+                    totalCachedInputTokens: 0,
+                    totalInputTokenCost: 0,
+                    totalOutputTokenCost: 0,
+                    totalCachedInputTokenCost: 0,
+                    totalCost: 0,
+                    messageCount: 0,
+                });
+                setMessages([]);
+                setError(null);
+                setIsLoading(false);
+                return;
+            }
+            setIsLoading(true);
+            setError(null);
+            const agentData = await getAgent(agentStub.id);
+            setAgent(agentData);
+            setMessages(agentData.messages || []);
+            // Connect to stream if agent is running (handle both string and numeric status)
+            const isRunning = agentData.status === "running" || agentData.status === 1;
+            if (isRunning) {
+                console.log("🚀 Agent is running, connecting to stream...", {
+                    agentId: agentData.id,
+                    status: agentData.status,
+                    messageCount: agentData.messages?.length || 0,
+                });
+                // Use setTimeout to ensure state updates are processed first
+                setTimeout(async () => {
+                    // Check if we're already connecting to avoid duplicate connections
+                    if (abortControllerRef.current) {
+                        console.log("⚠️ loadAgent: Already connected to stream, skipping duplicate connection");
+                        return;
+                    }
+                    // Reset streaming state for reconnection
+                    shouldCreateNewMessage.current = false;
+                    // Use the existing connectToStream function with the loaded agent data
+                    await connectToStream(agentData);
+                }, 100);
+            }
+            else {
+                console.log("⏸️ Agent is not running, status:", agentData.status, "(0=new, 1=running, 2=closed, 3=cancelled)");
+            }
+        }
+        catch (err) {
+            console.error("❌ Failed to load agent:", err);
+            // For new agents that don't exist yet, this is expected
+            if (err?.message?.includes("404") ||
+                err?.message?.includes("not found")) {
+                console.log("ℹ️ Agent does not exist, treating as new");
+                setAgent(undefined);
+                setMessages([]);
+                setError(null);
+            }
+            else {
+                console.error("❌ Load error:", err.message);
+                setError("Failed to load agent data");
+            }
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [agentStub.id]);
+    // Initial load
+    useEffect(() => {
+        loadAgent();
+    }, [loadAgent]);
+    // Cleanup stream connection when component unmounts or agent changes
+    useEffect(() => {
+        return () => {
+            if (abortControllerRef.current) {
+                console.log("Cleaning up stream connection");
+                abortControllerRef.current.abort();
+            }
+        };
+    }, [agent?.id]);
+    // Auto-scroll when messages change (only if user hasn't manually scrolled up)
+    useEffect(() => {
+        if (shouldAutoScroll) {
+            scrollToBottom();
+        }
+    }, [messages, scrollToBottom, shouldAutoScroll]);
+    const handleSubmit = async () => {
+        if (!prompt.trim() || isSubmitting || !editContext)
+            return;
+        try {
+            setIsSubmitting(true);
+            setError(null);
+            const agentId = agent?.id;
+            if (!agentId)
+                return;
+            // Add user message to local state immediately for better UX
+            const userMessage = {
+                id: `user-${Date.now()}`,
+                agentId,
+                messageIndex: messages.length,
+                role: "user",
+                content: prompt.trim(),
+                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(),
+            };
+            setMessages((prev) => [...prev, userMessage]);
+            const request = {
+                agentId: agent.id,
+                message: prompt.trim(),
+                sessionId: editContext.sessionId,
+                profileId: "default", // TODO: Get from context or settings
+                itemid: editContext.currentItemDescriptor?.id || "",
+                language: editContext.currentItemDescriptor?.language || "en",
+                version: editContext.currentItemDescriptor?.version || 1,
+            };
+            console.log("Starting agent:", request);
+            // Set waiting state to show dancing dots immediately
+            setIsWaitingForResponse(true);
+            // 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
+            await startAgent(request);
+            // Save prompt to history
+            if (prompt.trim()) {
+                setPromptHistory((prev) => [
+                    prompt.trim(),
+                    ...prev.filter((p) => p !== prompt.trim()).slice(0, 9),
+                ]);
+                setCurrentHistoryIndex(-1);
+            }
+            setPrompt("");
+            // Connect to stream immediately to start receiving updates
+            await connectToStream();
+        }
+        catch (err) {
+            console.error("Failed to submit prompt:", err);
+            setError("Failed to submit prompt");
+            setIsWaitingForResponse(false);
+            // Remove the optimistically added user message on error
+            setMessages((prev) => prev.slice(0, -1));
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    };
+    const handleKeyPress = (e) => {
+        if (e.key === "Enter" && !e.ctrlKey && !e.metaKey) {
+            e.preventDefault();
+            handleSubmit();
+        }
+        if (e.key === "ArrowUp") {
+            // Only navigate history if prompt is empty or we're already navigating history
+            const canNavigateHistory = prompt.trim().length === 0 || currentHistoryIndex !== -1;
+            if (canNavigateHistory) {
+                e.preventDefault();
+                if (promptHistory.length > 0) {
+                    const newIndex = currentHistoryIndex < promptHistory.length - 1
+                        ? currentHistoryIndex + 1
+                        : currentHistoryIndex;
+                    setCurrentHistoryIndex(newIndex);
+                    const historicalPrompt = promptHistory[newIndex];
+                    if (textareaRef.current && historicalPrompt) {
+                        setPrompt(historicalPrompt);
+                        setTimeout(() => {
+                            if (textareaRef.current) {
+                                textareaRef.current.selectionStart = historicalPrompt.length;
+                                textareaRef.current.selectionEnd = historicalPrompt.length;
+                            }
+                        }, 0);
+                    }
+                }
+            }
+        }
+        if (e.key === "ArrowDown" && currentHistoryIndex >= 0) {
+            e.preventDefault();
+            const newIndex = currentHistoryIndex - 1;
+            setCurrentHistoryIndex(newIndex);
+            const historicalPrompt = newIndex >= 0 ? promptHistory[newIndex] || "" : "";
+            setPrompt(historicalPrompt);
+            if (textareaRef.current) {
+                setTimeout(() => {
+                    if (textareaRef.current) {
+                        textareaRef.current.selectionStart = historicalPrompt.length;
+                        textareaRef.current.selectionEnd = historicalPrompt.length;
+                    }
+                }, 0);
+            }
+        }
+    };
+    if (isLoading) {
+        return (_jsx("div", { className: "flex h-full items-center justify-center", children: _jsxs("div", { className: "flex items-center gap-2 text-sm text-gray-500", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin", strokeWidth: 1 }), "Loading agent..."] }) }));
+    }
+    // Calculate total token usage for cost display
+    const totalTokens = calculateTotalTokens(messages);
+    return (_jsxs("div", { className: "flex h-full flex-col", children: [_jsxs("div", { ref: messagesContainerRef, className: "flex-1 overflow-y-auto", onScroll: handleScroll, children: [error && (_jsx("div", { className: "m-4 rounded-lg border-l-4 border-red-500 bg-red-50 p-3", children: _jsxs("div", { className: "flex items-start", children: [_jsx(AlertCircle, { className: "mt-0.5 h-5 w-5 text-red-400", strokeWidth: 1 }), _jsxs("div", { className: "ml-3", children: [_jsx("p", { className: "text-sm font-medium text-red-800", children: "Error" }), _jsx("p", { className: "mt-1 text-sm text-red-700", children: error })] })] }) })), messages.length === 0 && !error && (_jsx("div", { className: "flex h-full items-center justify-center p-8", children: _jsxs("div", { className: "text-center", children: [_jsx(Bot, { className: "mx-auto mb-4 h-12 w-12 text-gray-400", strokeWidth: 1 }), _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." })] }) })), _jsxs("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));
+                                }
+                                else {
+                                    // Render bundled assistant messages
+                                    // Check if this group contains any streaming message
+                                    const hasStreamingMessage = group.messages.some((msg) => !msg.isCompleted && msg.messageType === "streaming");
+                                    const convertedMessages = convertAgentMessagesToAiFormat(group.messages);
+                                    return (_jsx(AiResponseMessage, { messages: convertedMessages, finished: !isSubmitting && !isConnecting, editOperations: [], error: error || undefined }, groupIndex));
+                                }
+                            }), (isWaitingForResponse ||
+                                groupConsecutiveMessages(messages).some((group) => group.type === "assistant-group" &&
+                                    group.messages.some((msg) => !msg.isCompleted && msg.messageType === "streaming"))) && _jsx(DancingDots, {})] }), _jsx("div", { ref: messagesEndRef })] }), totalTokens.totalCost > 0 && (_jsx("div", { className: "border-t border-gray-100 px-4 py-2", children: _jsx(AgentCostDisplay, { totalTokens: totalTokens, className: "flex justify-end" }) })), _jsx("div", { className: "border-t border-gray-200 p-4", children: _jsxs("div", { className: "flex items-stretch gap-2", children: [_jsx(Textarea, { ref: textareaRef, value: prompt, onChange: (e) => {
+                                setPrompt(e.target.value);
+                                // Reset history index when user starts typing
+                                if (currentHistoryIndex !== -1) {
+                                    setCurrentHistoryIndex(-1);
+                                }
+                            }, onKeyDown: handleKeyPress, placeholder: "Type your message... (Enter to send, Ctrl+Enter for new line)", className: "resize-nones min-h-[80px] flex-1 text-xs", disabled: isSubmitting }), _jsx(Button, { onClick: handleSubmit, disabled: !prompt.trim() || isSubmitting, size: "sm", className: "self-end", children: isSubmitting ? (_jsx(Loader2, { className: "h-4 w-4 animate-spin", strokeWidth: 1 })) : (_jsx(Send, { className: "h-4 w-4", strokeWidth: 1 })) })] }) })] }));
+}
+//# sourceMappingURL=AgentTerminal.js.map