@alpaca-editor/core 1.0.4118 → 1.0.4121

package/dist/editor/ai/AgentTerminal.js

@@ -13,6 +13,7 @@ import { getComponentById } from "../componentTreeHelper";
 import { Popover, PopoverContent, PopoverTrigger, } from "../../components/ui/popover";
 import { SecretAgentIcon } from "../ui/Icons";
 import { formatTime } from "../utils";
+import { Tooltip, TooltipTrigger, TooltipContent, } from "../../components/ui/tooltip";
 // 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-xs font-medium text-gray-900", children: "You" }), message.createdDate && (_jsx("span", { className: "text-xs text-gray-400", children: formatTime(new Date(message.createdDate)) }))] }), _jsx("div", { className: "prose prose-sm max-w-none text-xs text-gray-700 select-text", children: message.content })] })] }));
@@ -456,7 +457,17 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
     }, [createNewStreamMessage]);
     const handleToolCall = useCallback((message, agentData) => {
         const toolCallId = message.data?.toolCallId || message.data?.id || crypto.randomUUID();
-        const toolCallMessageId = message.data?.messageId;
+        // Prefer provided messageId, otherwise fall back to the last streaming assistant message
+        let toolCallMessageId = message.data?.messageId;
+        if (!toolCallMessageId) {
+            const current = messagesRef.current;
+            const lastStreaming = [...current]
+                .reverse()
+                .find((m) => m.role === "assistant" && !m.isCompleted);
+            if (lastStreaming?.id) {
+                toolCallMessageId = lastStreaming.id;
+            }
+        }
         // Find or create the target message for this tool call
         if (toolCallMessageId) {
             const currentMessages = messagesRef.current;
@@ -531,10 +542,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
     }, [createNewStreamMessage]);
     const handleToolResult = useCallback((message, agentData) => {
         const resultToolCallId = message.data?.toolCallId || message.data?.id || crypto.randomUUID();
-        const resultMessageId = message.data?.messageId;
+        // Prefer provided messageId, otherwise fall back to the last streaming assistant message
+        let resultMessageId = message.data?.messageId;
+        if (!resultMessageId) {
+            const current = messagesRef.current;
+            const lastStreaming = [...current]
+                .reverse()
+                .find((m) => m.role === "assistant" && !m.isCompleted);
+            if (lastStreaming?.id) {
+                resultMessageId = lastStreaming.id;
+            }
+        }
         // Update tool result directly in the messages array
         if (!resultMessageId) {
-            console.warn("⚠️ No messageId provided for tool result");
+            console.warn("⚠️ No messageId available for tool result");
             return;
         }
         console.log("📋 Updating tool result in message:", resultMessageId);
@@ -631,6 +652,73 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                         handleToolResult(message, currentAgent);
                         break;
                     case "statusUpdate":
+                        try {
+                            const kind = message?.data?.kind;
+                            if (kind === "contextWindow") {
+                                const data = message.data || {};
+                                // Store last context window status in a ref so we can render it below
+                                window.__agentContextWindowStatus = {
+                                    model: data.model,
+                                    normalizedModel: data.normalizedModel,
+                                    contextWindowTokens: data.contextWindowTokens,
+                                    maxCompletionTokens: data.maxCompletionTokens,
+                                    estimatedInputTokens: data.estimatedInputTokens,
+                                    messageCount: data.messageCount,
+                                    contextUsedPercent: data.contextUsedPercent,
+                                };
+                                // Force a re-render by toggling state (cheap no-op)
+                                setMessages((prev) => [...prev]);
+                            }
+                            else if (kind === "contextChanged") {
+                                const data = message.data || {};
+                                const nextContext = data.context || {};
+                                // Merge incoming context into local metadata
+                                setAgentMetadata((prev) => {
+                                    const current = (prev || {});
+                                    const next = {
+                                        ...current,
+                                        additionalData: {
+                                            ...(current.additionalData || {}),
+                                            context: nextContext,
+                                        },
+                                    };
+                                    return next;
+                                });
+                                // Also reflect in agent metadata string for consistency
+                                setAgent((prevAgent) => {
+                                    if (!prevAgent)
+                                        return prevAgent;
+                                    try {
+                                        const currentMeta = (() => {
+                                            try {
+                                                return prevAgent.metadata
+                                                    ? JSON.parse(prevAgent.metadata)
+                                                    : null;
+                                            }
+                                            catch {
+                                                return null;
+                                            }
+                                        })();
+                                        const nextMeta = {
+                                            ...(currentMeta || {}),
+                                            additionalData: {
+                                                ...(currentMeta?.additionalData ||
+                                                    {}),
+                                                context: nextContext,
+                                            },
+                                        };
+                                        return {
+                                            ...prevAgent,
+                                            metadata: JSON.stringify(nextMeta),
+                                        };
+                                    }
+                                    catch {
+                                        return prevAgent;
+                                    }
+                                });
+                            }
+                        }
+                        catch { }
                         break;
                     case "completed":
                         const completedMessageId = message.data?.messageId;
@@ -920,25 +1008,32 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                     if (localCtx?.additionalData?.context) {
                         const ctx = base.additionalData.context;
                         const local = localCtx.additionalData.context;
+                        // Normalize existing shape: migrate items -> pages if needed
+                        if (!ctx.pages && ctx.items) {
+                            ctx.pages = ctx.items;
+                            delete ctx.items;
+                        }
                         // Merge pages (avoid duplicates)
-                        if (local.pages && local.pages.length) {
-                            const existing = new Set((ctx.pages || []).map((p) => `${p.id}-${p.language}-${p.version}`));
-                            const mergedPages = [
-                                ...(ctx.pages || []),
-                                ...local.pages.filter((p) => !existing.has(`${p.id}-${p.language}-${p.version}`)),
-                            ];
-                            if (mergedPages.length)
-                                ctx.pages = mergedPages;
+                        if ((local.pages && local.pages.length) ||
+                            (local.items && local.items.length)) {
+                            const targetPages = Array.isArray(ctx.pages)
+                                ? [...ctx.pages]
+                                : [];
+                            const existingKeys = new Set(targetPages.map((p) => `${p.id}-${p.language || ""}-${p.version || ""}`));
+                            const incoming = (local.pages || local.items);
+                            const additions = incoming.filter((p) => !existingKeys.has(`${p.id}-${p.language || ""}-${p.version || ""}`));
+                            if (additions.length)
+                                ctx.pages = [...targetPages, ...additions];
                         }
-                        // Merge componentIds
+                        // Merge componentIds (avoid duplicates)
                         if (local.componentIds && local.componentIds.length) {
-                            const existingIds = new Set(ctx.componentIds || []);
-                            const mergedIds = [
-                                ...(ctx.componentIds || []),
-                                ...local.componentIds.filter((id) => !existingIds.has(id)),
-                            ];
-                            if (mergedIds.length)
-                                ctx.componentIds = mergedIds;
+                            const currentIds = Array.isArray(ctx.componentIds)
+                                ? ctx.componentIds
+                                : [];
+                            const existingIds = new Set(currentIds);
+                            const additions = local.componentIds.filter((id) => !!id && !existingIds.has(id));
+                            if (additions.length)
+                                ctx.componentIds = [...currentIds, ...additions];
                         }
                         // Set field if missing
                         if (!ctx.field && local.field) {
@@ -1240,6 +1335,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                 addSelectedComponents: !!effectiveSelection?.length,
                 addContextContent: false,
                 addAllContent: false,
+                context: agentMetadata?.additionalData?.context,
                 deterministic: deterministicFlags.deterministic,
                 seed: deterministicFlags.seed,
             };
@@ -1398,6 +1494,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                 addSelectedComponents: !!effectiveSelection?.length,
                 addContextContent: false,
                 addAllContent: false,
+                context: agentMetadata?.additionalData?.context,
                 deterministic: deterministicFlags.deterministic,
                 seed: deterministicFlags.seed,
             };
@@ -1947,35 +2044,39 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                                 if (currentHistoryIndex !== -1) {
                                     setCurrentHistoryIndex(-1);
                                 }
-                            }, onKeyDown: handleKeyPress, placeholder: inputPlaceholder, className: "h-[80px] flex-1 resize-none overflow-y-auto text-xs", "data-testid": "agent-terminal-prompt", disabled: isSubmitting }) }), _jsxs("div", { className: "flex items-stretch justify-between gap-2", children: [_jsxs("div", { className: "mt-2 flex items-center justify-start gap-2", children: [_jsxs("select", { className: "h-5 rounded border px-1.5 text-[10px] text-gray-500", value: mode, onChange: async (e) => {
-                                            const nextMode = e.target.value || "agent";
-                                            // Optimistic UI update
-                                            setMode(nextMode);
-                                            const current = agentMetadata || {};
-                                            const nextMeta = {
-                                                ...current,
-                                                mode: nextMode,
-                                            };
-                                            try {
-                                                if (!agent?.id || agent.status === "new") {
-                                                    setAgentMetadata(nextMeta);
-                                                    // Cache until first start when agent is persisted
-                                                    pendingSettingsRef.current = {
-                                                        ...(pendingSettingsRef.current || {}),
-                                                        mode: nextMode,
-                                                    };
-                                                    return;
-                                                }
-                                                await updateAgentSettings(agent.id, { mode: nextMode });
-                                                setAgentMetadata(nextMeta);
-                                                setAgent((prev) => prev
-                                                    ? { ...prev, metadata: JSON.stringify(nextMeta) }
-                                                    : prev);
-                                            }
-                                            catch (e2) {
-                                                console.error("Failed to persist mode change", e2);
-                                            }
-                                        }, title: "Mode", "aria-label": "Mode", "data-testid": "agent-mode-select", children: [_jsx("option", { value: "restricted", children: "Restricted" }), _jsx("option", { value: "agent", children: "Agent" }), _jsx("option", { value: "ask", children: "Ask" })] }), profiles?.length > 0 && (_jsx("select", { className: "h-5 rounded border px-1.5 text-[10px] text-gray-500", value: activeProfile?.id || "", onChange: (e) => {
+                            }, onKeyDown: handleKeyPress, placeholder: inputPlaceholder, className: "h-[80px] flex-1 resize-none overflow-y-auto text-xs", "data-testid": "agent-terminal-prompt", disabled: isSubmitting }) }), _jsxs("div", { className: "flex items-stretch justify-between gap-2", children: [_jsxs("div", { className: "mt-2 flex items-center justify-start gap-2", children: [_jsxs(Tooltip, { delayDuration: 400, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("select", { className: `h-5 rounded border px-1.5 text-[10px] ${mode === "ask"
+                                                        ? "border-green-300 bg-green-50 text-green-700"
+                                                        : mode === "restricted"
+                                                            ? "border-amber-300 bg-amber-50 text-amber-700"
+                                                            : "border-red-300 bg-red-50 text-red-700"}`, value: mode, onChange: async (e) => {
+                                                        const nextMode = e.target.value || "agent";
+                                                        // Optimistic UI update
+                                                        setMode(nextMode);
+                                                        const current = agentMetadata || {};
+                                                        const nextMeta = {
+                                                            ...current,
+                                                            mode: nextMode,
+                                                        };
+                                                        try {
+                                                            if (!agent?.id || agent.status === "new") {
+                                                                setAgentMetadata(nextMeta);
+                                                                // Cache until first start when agent is persisted
+                                                                pendingSettingsRef.current = {
+                                                                    ...(pendingSettingsRef.current || {}),
+                                                                    mode: nextMode,
+                                                                };
+                                                                return;
+                                                            }
+                                                            await updateAgentSettings(agent.id, { mode: nextMode });
+                                                            setAgentMetadata(nextMeta);
+                                                            setAgent((prev) => prev
+                                                                ? { ...prev, metadata: JSON.stringify(nextMeta) }
+                                                                : prev);
+                                                        }
+                                                        catch (e2) {
+                                                            console.error("Failed to persist mode change", e2);
+                                                        }
+                                                    }, title: "Mode", "aria-label": "Mode", "data-testid": "agent-mode-select", children: [_jsx("option", { value: "restricted", children: "Restricted" }), _jsx("option", { value: "agent", children: "Agent" }), _jsx("option", { value: "ask", children: "Ask" })] }) }), _jsx(TooltipContent, { side: "top", sideOffset: 6, children: _jsxs("div", { className: "max-w-[320px] space-y-1", children: [_jsxs("div", { children: [_jsx("span", { className: "font-semibold", children: "Restricted" }), ": Same as Agent, but writes are limited to pages/items in the current context."] }), _jsxs("div", { children: [_jsx("span", { className: "font-semibold", children: "Agent" }), ": Full tool access; can write across the site/project."] }), _jsxs("div", { children: [_jsx("span", { className: "font-semibold", children: "Ask" }), ": Limited tool access as configured by the profile (Ask Mode Tools)."] })] }) })] }), profiles?.length > 0 && (_jsx("select", { className: "h-5 rounded border px-1.5 text-[10px] text-gray-500", value: activeProfile?.id || "", onChange: (e) => {
                                             const p = profiles.find((x) => x.id === e.target.value);
                                             if (p)
                                                 setActiveProfile(p);
@@ -2006,6 +2107,19 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, }) {
                                                             setShowPredefined(false);
                                                             if (textareaRef.current)
                                                                 textareaRef.current.focus();
-                                                        }, children: p.title }, index))) }) })] })) : null] }), _jsxs("div", { className: "flex items-center gap-1 self-end", children: [isVoiceSupported ? (_jsx(Button, { onClick: toggleVoice, size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", title: isListening ? "Stop voice input" : "Start voice input", "aria-label": isListening ? "Stop voice input" : "Start voice input", "aria-pressed": isListening, children: isListening ? (_jsx(MicOff, { className: "size-3", strokeWidth: 1 })) : (_jsx(Mic, { className: "size-3", strokeWidth: 1 })) })) : null, _jsx(Button, { onClick: isExecuting ? handleStop : handleSubmit, disabled: !isExecuting && !prompt.trim(), size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", title: isExecuting ? "Stop" : "Send", "aria-label": isExecuting ? "Stop" : "Send", "data-testid": "agent-send-stop-button", "data-executing": isExecuting ? "true" : "false", children: isExecuting ? (_jsx(Square, { className: "size-3", strokeWidth: 1 })) : (_jsx(Send, { className: "size-3", strokeWidth: 1 })) })] })] }), _jsx("div", { className: "mt-1 flex justify-start", children: _jsx(AgentCostDisplay, { totalTokens: totalTokens }) })] })] }));
+                                                        }, children: p.title }, index))) }) })] })) : null] }), _jsxs("div", { className: "flex items-center gap-1 self-end", children: [isVoiceSupported ? (_jsx(Button, { onClick: toggleVoice, size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", title: isListening ? "Stop voice input" : "Start voice input", "aria-label": isListening ? "Stop voice input" : "Start voice input", "aria-pressed": isListening, children: isListening ? (_jsx(MicOff, { className: "size-3", strokeWidth: 1 })) : (_jsx(Mic, { className: "size-3", strokeWidth: 1 })) })) : null, _jsx(Button, { onClick: isExecuting ? handleStop : handleSubmit, disabled: !isExecuting && !prompt.trim(), size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", title: isExecuting ? "Stop" : "Send", "aria-label": isExecuting ? "Stop" : "Send", "data-testid": "agent-send-stop-button", "data-executing": isExecuting ? "true" : "false", children: isExecuting ? (_jsx(Square, { className: "size-3", strokeWidth: 1 })) : (_jsx(Send, { className: "size-3", strokeWidth: 1 })) })] })] }), _jsx("div", { className: "mt-1 flex justify-start", children: _jsx(AgentCostDisplay, { totalTokens: totalTokens }) }), _jsx("div", { className: "mt-1 flex items-center gap-2 text-[10px] text-gray-500", children: (() => {
+                            try {
+                                const s = window.__agentContextWindowStatus;
+                                if (!s || !s.contextWindowTokens)
+                                    return null;
+                                const pct = typeof s.contextUsedPercent === "number"
+                                    ? `${s.contextUsedPercent.toFixed(1)}%`
+                                    : undefined;
+                                return (_jsxs("div", { className: "rounded border border-gray-200 bg-gray-50 px-2 py-0.5", children: [_jsxs("span", { title: `Model: ${s.model} (${s.normalizedModel || ""})`, children: ["Context window: ", s.estimatedInputTokens || 0, " /", " ", s.contextWindowTokens] }), typeof s.maxCompletionTokens === "number" && (_jsxs("span", { children: [" \u00B7 Max completion: ", s.maxCompletionTokens] })), pct && _jsxs("span", { children: [" \u00B7 Used: ", pct] })] }));
+                            }
+                            catch {
+                                return null;
+                            }
+                        })() })] })] }));
 }
 //# sourceMappingURL=AgentTerminal.js.map