@parhelia/core 0.1.12515 → 0.1.12523

package/dist/editor/ai/AgentTerminal.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React, { useEffect, useState, useRef, useCallback, useLayoutEffect, useMemo, } from "react";
 import { Send, AlertCircle, Loader2, User, Wand2, Square, Mic, MicOff, ChevronDown, ChevronUp, ListTodo, ArrowLeft, DollarSign, ExternalLink, Settings2, Target, X, Plus, } from "lucide-react";
-import { getAgent, startAgent, claimAgentBrowser, updateAgentSettings, updateAgentCostLimit, updateAgentContext, getAgentSkillCatalog, getAgentAvailableTools, getAgentOperationAllowances, getAgentTriggerSubscriptions, cancelAgent, canonicalizeAgentMetadata, getPendingPrompts, releaseAgentBrowser, } from "../services/agentService";
+import { getAgent, startAgent, claimAgentBrowser, assignAgentSkill, updateAgentSettings, updateAgentCostLimit, updateAgentContext, getAgentSkillCatalog, getAgentAvailableTools, getAgentOperationAllowances, getAgentTriggerSubscriptions, cancelAgent, canonicalizeAgentMetadata, getPendingPrompts, releaseAgentBrowser, revokeAgentSkill, } from "../services/agentService";
 import { parseAgentStatus } from "../services/agentStatus";
 import { useEditContext, useFieldsEditContext } from "../client/editContext";
 import { localStorageService } from "../services/localStorageService";
@@ -1087,6 +1087,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const [selectableTemplateIds, setSelectableTemplateIds] = useState([]);
     const [skillsLoading, setSkillsLoading] = useState(false);
     const [skillsError, setSkillsError] = useState(null);
+    const [skillActionError, setSkillActionError] = useState(null);
     const [triggerSubscriptions, setTriggerSubscriptions] = useState([]);
     const [availableTools, setAvailableTools] = useState([]);
     const [operationAllowances, setOperationAllowances] = useState({
@@ -1289,9 +1290,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             .filter((id) => id.length > 0);
     }, [activeProfile?.preloadSkills]);
     const autoAssignedSkillIds = useMemo(() => {
-        const all = isNewAgent
-            ? [...preloadedSkillIds, ...backendAssignedSkillIds]
-            : backendAssignedSkillIds;
+        const preloadedIdSet = new Set(preloadedSkillIds.map((id) => id.toLowerCase()));
+        const all = backendAssignedSkillIds.filter((id) => preloadedIdSet.has(id.toLowerCase()));
         const seen = new Set();
         const unique = [];
         for (const id of all) {
@@ -1302,7 +1302,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             unique.push(id);
         }
         return unique;
-    }, [backendAssignedSkillIds, isNewAgent, preloadedSkillIds]);
+    }, [backendAssignedSkillIds, preloadedSkillIds]);
     const selectedSkillIds = useMemo(() => {
         const all = [...autoAssignedSkillIds, ...metadataSelectedSkillIds];
         const seen = new Set();
@@ -1444,7 +1444,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         return availableSkills.filter((skill) => listedProfileSkillIdSet.has(skill.id.toLowerCase()));
     }, [availableSkills, listedProfileSkillIdSet]);
     const profileFilteredSkillIdSet = useMemo(() => new Set(profileFilteredSkills.map((s) => s.id.toLowerCase())), [profileFilteredSkills]);
-    const availableSkillIdSet = useMemo(() => new Set(availableSkills.map((skill) => skill.id.toLowerCase())), [availableSkills]);
+    const manuallyAssignableSkillIdSet = useMemo(() => new Set((activeProfile?.allowedSkills ?? [])
+        .map((skill) => String(skill?.id || "").toLowerCase())
+        .filter((id) => id.length > 0)), [activeProfile?.allowedSkills]);
     const selectableTemplateIdSet = useMemo(() => new Set(selectableTemplateIds.map((id) => id.toLowerCase())), [selectableTemplateIds]);
     const selectedSkills = useMemo(() => selectedSkillIds
         .map((id) => availableSkills.find((s) => s.id.toLowerCase() === id.toLowerCase()))
@@ -1508,20 +1510,23 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             return meta;
         }
     }, []);
-    const updateSelectedSkillIds = useCallback(async (skillIds) => {
-        if (!agent?.id)
+    const getSkillActionErrorMessage = useCallback((error) => {
+        const message = error instanceof Error && error.message.trim()
+            ? error.message.trim()
+            : "Failed to update skill";
+        if (message.includes("Skill is not available for this agent profile")) {
+            return "This skill cannot be added for the current agent profile.";
+        }
+        return message;
+    }, []);
+    const clearLegacySelectedSkillsFromMetadata = useCallback(async () => {
+        const legacySkillIds = metadataSelectedSkillIds;
+        if (!agent?.id || legacySkillIds.length === 0) {
             return;
+        }
         const current = agentMetadata || {};
         const currentAdditionalData = current.additionalData || {};
-        const nextAdditionalData = {
-            ...currentAdditionalData,
-        };
-        if (skillIds.length > 0) {
-            nextAdditionalData.skillIds = skillIds;
-        }
-        else {
-            delete nextAdditionalData.skillIds;
-        }
+        const nextAdditionalData = Object.fromEntries(Object.entries(currentAdditionalData).filter(([key]) => key.toLowerCase() !== "skillids"));
         const next = {
             ...current,
         };
@@ -1532,26 +1537,86 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             delete next.additionalData;
         }
         try {
-            if (agent.status === "new") {
-                setAgentMetadata(next);
-                return;
-            }
             await updateAgentContext(agent.id, next);
             setAgentMetadata(next);
             setAgent((prev) => prev ? { ...prev, agentContext: JSON.stringify(next) } : prev);
         }
         catch (e) {
-            console.error("Failed to update selected skills", e);
+            console.error("Failed to clear legacy selected skills", e);
         }
-    }, [agent?.id, agent?.status, agentMetadata, setAgent, setAgentMetadata]);
+    }, [
+        agent?.id,
+        agentMetadata,
+        metadataSelectedSkillIds,
+        setAgent,
+        setAgentMetadata,
+    ]);
     const handleAddSkill = useCallback(async (skillId) => {
         if (selectedSkillSet.has(skillId.toLowerCase()))
             return;
-        await updateSelectedSkillIds([...metadataSelectedSkillIds, skillId]);
-    }, [metadataSelectedSkillIds, selectedSkillSet, updateSelectedSkillIds]);
+        if (!agent?.id)
+            return;
+        try {
+            setSkillActionError(null);
+            await assignAgentSkill({ agentId: agent.id, skillId });
+            setAgent((prev) => {
+                if (!prev)
+                    return prev;
+                const currentAssigned = Array.isArray(prev.assignedSkillIds)
+                    ? prev.assignedSkillIds
+                    : [];
+                if (currentAssigned.some((existingId) => String(existingId).toLowerCase() === skillId.toLowerCase())) {
+                    return prev;
+                }
+                return {
+                    ...prev,
+                    assignedSkillIds: [...currentAssigned, skillId],
+                };
+            });
+            await clearLegacySelectedSkillsFromMetadata();
+            return true;
+        }
+        catch (e) {
+            setSkillActionError(getSkillActionErrorMessage(e));
+            return false;
+        }
+    }, [
+        agent?.id,
+        assignAgentSkill,
+        clearLegacySelectedSkillsFromMetadata,
+        getSkillActionErrorMessage,
+        setAgent,
+        selectedSkillSet,
+    ]);
     const handleRemoveSkill = useCallback(async (skillId) => {
-        await updateSelectedSkillIds(metadataSelectedSkillIds.filter((id) => id.toLowerCase() !== skillId.toLowerCase()));
-    }, [metadataSelectedSkillIds, updateSelectedSkillIds]);
+        if (!agent?.id)
+            return;
+        try {
+            setSkillActionError(null);
+            await revokeAgentSkill({ agentId: agent.id, skillId });
+            setAgent((prev) => {
+                if (!prev)
+                    return prev;
+                const currentAssigned = Array.isArray(prev.assignedSkillIds)
+                    ? prev.assignedSkillIds
+                    : [];
+                return {
+                    ...prev,
+                    assignedSkillIds: currentAssigned.filter((existingId) => String(existingId).toLowerCase() !== skillId.toLowerCase()),
+                };
+            });
+            await clearLegacySelectedSkillsFromMetadata();
+        }
+        catch (e) {
+            setSkillActionError(getSkillActionErrorMessage(e));
+        }
+    }, [
+        agent?.id,
+        clearLegacySelectedSkillsFromMetadata,
+        getSkillActionErrorMessage,
+        revokeAgentSkill,
+        setAgent,
+    ]);
     const handleOpenProfileSettings = useCallback(async () => {
         if (!editContext || !activeProfile?.id)
             return;
@@ -2007,6 +2072,12 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         // If no messageId is provided, we'll use the last assistant message or create a new one
         let messageId = message.data?.messageId;
         if (!messageId && agentData?.id) {
+            console.warn("[AgentTerminal] Content chunk missing messageId; falling back to local resolution", {
+                agentId: agentData.id,
+                isIncremental: message.data?.isIncremental,
+                previousContentLength: message.data?.previousContentLength,
+                totalContentLength: message.data?.totalContentLength,
+            });
             // For backward compatibility: if no messageId, find or create the current streaming message
             // This handles cases where the backend doesn't send messageId
             const currentMessages = messagesRef.current;
@@ -2107,6 +2178,15 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             const existingMessageIndex = prev.findIndex((msg) => msg.id === messageId);
             if (existingMessageIndex === -1) {
                 // Message doesn't exist - create new streaming message
+                const previousContentLength = message.data?.previousContentLength || 0;
+                if (message.data?.isIncremental && previousContentLength > 0) {
+                    console.warn("[AgentTerminal] Incremental chunk arrived before its base message existed", {
+                        messageId,
+                        previousContentLength,
+                        totalContentLength: message.data?.totalContentLength,
+                        deltaLength: (message.data?.deltaContent || "").length,
+                    });
+                }
                 const newStreamMessage = createNewStreamMessage(messageId, agentData);
                 // Set the content for the new message
                 const updatedNewMessage = { ...newStreamMessage };
@@ -2129,8 +2209,21 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     return prev;
                 // Check if existing content is already longer than what we're trying to stream
                 const currentContentLength = existingMessage.content?.length || 0;
+                const previousContentLength = message.data?.previousContentLength || 0;
                 const totalContentLength = message.data?.totalContentLength || 0;
-                if (currentContentLength >= totalContentLength &&
+                if (message.data?.isIncremental &&
+                    previousContentLength !== currentContentLength &&
+                    (previousContentLength > 0 || currentContentLength > 0)) {
+                    console.warn("[AgentTerminal] Content chunk length mismatch", {
+                        messageId,
+                        previousContentLength,
+                        currentContentLength,
+                        totalContentLength,
+                        deltaLength: (message.data?.deltaContent || "").length,
+                    });
+                }
+                if (message.data?.isIncremental &&
+                    currentContentLength >= totalContentLength &&
                     totalContentLength > 0) {
                     return prev;
                 }
@@ -2159,6 +2252,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         // Prefer provided messageId, otherwise fall back to the last streaming assistant message
         let toolCallMessageId = message.data?.messageId;
         if (!toolCallMessageId) {
+            console.warn("[AgentTerminal] Tool call missing messageId; falling back", {
+                toolCallId,
+                toolName: message.data?.name || message.data?.displayName,
+            });
             const current = messagesRef.current;
             const lastStreaming = [...current]
                 .reverse()
@@ -2322,6 +2419,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         // Prefer provided messageId, otherwise fall back to the last streaming assistant message
         let resultMessageId = message.data?.messageId;
         if (!resultMessageId) {
+            console.warn("[AgentTerminal] Tool result missing messageId; falling back", {
+                toolCallId: resultToolCallId,
+                toolName: message.data?.functionName || message.data?.displayName,
+            });
             const current = messagesRef.current;
             const lastStreaming = [...current]
                 .reverse()
@@ -5196,9 +5297,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const renderBrowserClaimBanner = (variant = "inline") => {
         if (!agent?.id || !editContext?.sessionId)
             return null;
-        if (!isClaimedByCurrentSession &&
-            !isClaimedByAnotherBrowser &&
-            !isPendingBrowserCaptureWait) {
+        if (!isClaimedByCurrentSession && !isClaimedByAnotherBrowser) {
+            return null;
+        }
+        if (isPendingBrowserCaptureWait) {
             return null;
         }
         const label = isClaimedByCurrentSession
@@ -5222,6 +5324,24 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     };
     const fixedBrowserClaimBanner = renderBrowserClaimBanner("fixed");
     const inlineBrowserClaimBanner = null;
+    const browserCaptureInlinePrompt = isPendingBrowserCaptureWait && !isClaimedByCurrentSession
+        ? {
+            toolNames: ["capture-page-screenshot", "capture-page-dom"],
+            label: isClaimedByAnotherBrowser
+                ? "Attached in another browser"
+                : "No browser attached",
+            description: isClaimedByAnotherBrowser
+                ? "This capture request is waiting in another browser. Take over browser control here to continue."
+                : "This capture request is waiting for a browser attachment. Attach this browser to continue.",
+            actionLabel: isClaimedByAnotherBrowser
+                ? "Take over browser control"
+                : "Attach to this browser",
+            isPending: isBrowserClaimMutationPending,
+            onAction: () => {
+                void handleClaimBrowser(isClaimedByAnotherBrowser);
+            },
+        }
+        : null;
     useEffect(() => {
         if (agent?.status !== "waitingForInput") {
             setPendingBrowserCaptureDialogType(null);
@@ -5291,7 +5411,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                 __html: sanitizeSvg(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" })] })] }) })), inlineBrowserClaimBanner, renderErrorBanner(), inlineDialog ? (inlineDialog) : latestSummaryAssistantGroup ? (_jsx("div", { className: "space-y-0 divide-y divide-gray-100 select-text", children: _jsx(AiResponseMessage, { messages: summaryMessages, finished: !latestSummaryAssistantGroup.isLastGroup || !isExecuting, editOperations: summaryOperations, defaultCollapseJson: defaultCollapseJson, profileSvgIcon: activeProfile?.svgIcon, agentId: agent?.id || agentStub.id, agentName: activeProfile?.agentName ||
                                         activeProfile?.displayTitle ||
-                                        activeProfile?.name, allPendingApprovals: allPendingApprovals, onSwitchToAutonomous: handleSwitchToAutonomous, onQuickAction: (action) => {
+                                        activeProfile?.name, allPendingApprovals: allPendingApprovals, onSwitchToAutonomous: handleSwitchToAutonomous, browserCaptureInlinePrompt: browserCaptureInlinePrompt, onQuickAction: (action) => {
                                         const text = (action.prompt ||
                                             action.value ||
                                             action.label ||
@@ -5444,7 +5564,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                         const operationsForGroup = getOperationsForMessageGroup(convertedMessages, agentOperations);
                                         return (_jsx(AiResponseMessage, { messages: convertedMessages, finished: !isLastGroup || !isExecuting, editOperations: operationsForGroup, defaultCollapseJson: defaultCollapseJson, profileSvgIcon: activeProfile?.svgIcon, agentId: agent?.id || agentStub.id, agentName: activeProfile?.agentName ||
                                                 activeProfile?.displayTitle ||
-                                                activeProfile?.name, allPendingApprovals: allPendingApprovals, onSwitchToAutonomous: handleSwitchToAutonomous, onQuickAction: (action) => {
+                                                activeProfile?.name, allPendingApprovals: allPendingApprovals, onSwitchToAutonomous: handleSwitchToAutonomous, browserCaptureInlinePrompt: browserCaptureInlinePrompt, onQuickAction: (action) => {
                                                 const text = (action.prompt ||
                                                     action.value ||
                                                     action.label ||
@@ -5785,29 +5905,40 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                             catch (err) {
                                                                                 console.error("Failed to persist agent model", err);
                                                                             }
-                                                                        } })] })) : null, _jsxs("div", { children: [_jsxs("div", { className: "mb-1 flex items-center justify-between gap-2", children: [_jsxs("div", { className: "flex items-center gap-1 text-[11px] font-medium text-gray-700", children: [_jsx(Target, { className: "h-3 w-3", strokeWidth: 1 }), "Skills"] }), _jsxs(Popover, { open: showSkillPicker, onOpenChange: setShowSkillPicker, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { size: "xs", variant: "outline", className: "h-5 rounded border px-1.5 text-[10px] text-gray-600", "data-testid": "agent-skill-picker-trigger", children: [_jsx(Plus, { className: "mr-1 h-3 w-3", strokeWidth: 1.5 }), "Add"] }) }), _jsx(PopoverContent, { className: "w-88 p-2", align: "end", side: "bottom", children: _jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "text-[11px] font-medium text-gray-700", children: "Select a skill" }), _jsxs("div", { className: "relative h-56 rounded border border-gray-200 bg-gray-50", children: [_jsx(ScrollingContentTree, { rootItemIds: skillRootIds, selectedItemId: selectedSkillIds[selectedSkillIds.length - 1] || undefined, expandedItemId: selectedSkillIds[selectedSkillIds.length - 1] || skillRootIds[0], scrollToSelected: true, hideRootNodes: false, onSelectionChange: (selection) => {
+                                                                        } })] })) : null, _jsxs("div", { children: [_jsxs("div", { className: "mb-1 flex items-center justify-between gap-2", children: [_jsxs("div", { className: "flex items-center gap-1 text-[11px] font-medium text-gray-700", children: [_jsx(Target, { className: "h-3 w-3", strokeWidth: 1 }), "Skills"] }), _jsxs(Popover, { open: showSkillPicker, onOpenChange: (open) => {
+                                                                                    setShowSkillPicker(open);
+                                                                                    if (open) {
+                                                                                        setSkillActionError(null);
+                                                                                    }
+                                                                                }, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { size: "xs", variant: "outline", className: "h-5 rounded border px-1.5 text-[10px] text-gray-600", "data-testid": "agent-skill-picker-trigger", children: [_jsx(Plus, { className: "mr-1 h-3 w-3", strokeWidth: 1.5 }), "Add"] }) }), _jsx(PopoverContent, { className: "w-88 p-2", align: "end", side: "bottom", children: _jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "text-[11px] font-medium text-gray-700", children: "Select a skill" }), _jsxs("div", { className: "relative h-56 rounded border border-gray-200 bg-gray-50", children: [_jsx(ScrollingContentTree, { rootItemIds: skillRootIds, selectedItemId: selectedSkillIds[selectedSkillIds.length - 1] || undefined, expandedItemId: selectedSkillIds[selectedSkillIds.length - 1] || skillRootIds[0], scrollToSelected: true, hideRootNodes: false, onSelectionChange: (selection) => {
                                                                                                                 const selected = selection[0];
                                                                                                                 if (!selected?.id)
                                                                                                                     return;
+                                                                                                                setSkillActionError(null);
                                                                                                                 if (selectableTemplateIdSet.size > 0 &&
                                                                                                                     (!selected.templateId ||
                                                                                                                         !selectableTemplateIdSet.has(selected.templateId.toLowerCase()))) {
                                                                                                                     return;
                                                                                                                 }
-                                                                                                                if (!availableSkillIdSet.has(selected.id.toLowerCase())) {
+                                                                                                                if (!manuallyAssignableSkillIdSet.has(selected.id.toLowerCase())) {
+                                                                                                                    setSkillActionError("This skill cannot be added for the current agent profile.");
                                                                                                                     return;
                                                                                                                 }
-                                                                                                                void handleAddSkill(selected.id);
-                                                                                                                setShowSkillPicker(false);
+                                                                                                                void (async () => {
+                                                                                                                    const added = await handleAddSkill(selected.id);
+                                                                                                                    if (added) {
+                                                                                                                        setShowSkillPicker(false);
+                                                                                                                    }
+                                                                                                                })();
                                                                                                             } }), skillsLoading && (_jsx("div", { className: "bg-background/70 absolute inset-0 flex items-center justify-center text-[10px] text-gray-500", children: "Loading skills..." }))] }), !skillsLoading &&
                                                                                                     !skillsError &&
-                                                                                                    profileFilteredSkills.length > 0 && (_jsx("div", { className: "text-[10px] text-gray-500", children: "Click a skill item in the tree to add it." })), skillsError && (_jsx("div", { className: "text-[10px] text-red-600", children: skillsError })), !skillsLoading &&
+                                                                                                    profileFilteredSkills.length > 0 && (_jsx("div", { className: "text-[10px] text-gray-500", children: "Click a skill item in the tree to add it." })), skillsError && (_jsx("div", { className: "text-[10px] text-red-600", children: skillsError })), !skillsError && skillActionError && (_jsx("div", { className: "text-[10px] text-red-600", children: skillActionError })), !skillsLoading &&
                                                                                                     !skillsError &&
                                                                                                     skillRootIds.length === 0 && (_jsx("div", { className: "text-[10px] text-gray-500", children: "No skill roots available." })), !skillsLoading &&
                                                                                                     !skillsError &&
                                                                                                     profileFilteredSkills.length === 0 && (_jsx("div", { className: "text-[10px] text-gray-500", children: selectedSkillIds.length > 0
-                                                                                                        ? "All available/allowed skills are selected"
-                                                                                                        : "No available or allowed skills for this profile" }))] }) })] })] }), selectedSkillIds.length > 0 && (_jsx("div", { className: "mb-2 flex flex-wrap gap-1", children: selectedSkillIds.map((skillId) => {
+                                                                                                        ? "All addable skills are selected"
+                                                                                                        : "No skills can be added for this profile" }))] }) })] })] }), selectedSkillIds.length > 0 && (_jsx("div", { className: "mb-2 flex flex-wrap gap-1", children: selectedSkillIds.map((skillId) => {
                                                                             const skill = selectedSkills.find((s) => s.id === skillId);
                                                                             return (_jsxs("div", { className: "inline-flex items-center gap-1 rounded-full border border-gray-200 bg-gray-100 px-1.5 py-0.5 text-[10px] text-gray-700", children: [_jsx("span", { children: skill?.name || skillId }), _jsx("button", { type: "button", className: "rounded p-0.5 text-gray-500 hover:bg-gray-200 hover:text-gray-700", title: "Open skill item", "aria-label": `Open ${skill?.name || skillId}`, onClick: () => {
                                                                                             void handleOpenSkillItem(skillId);