@parhelia/core 0.1.12517 → 0.1.12534

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, persistDraftAgent, 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";
@@ -31,14 +31,14 @@ import { Splitter } from "../ui/Splitter";
 import { ScrollingContentTree } from "../ScrollingContentTree";
 import { MarkdownDisplay, } from "../../components/MarkdownDisplay";
 const userMessageMarkdownComponents = {
-    h1: (props) => (_jsx("h1", { ...props, className: "mb-2 text-sm font-semibold leading-5 text-gray-900" })),
-    h2: (props) => (_jsx("h2", { ...props, className: "mb-1.5 text-[13px] font-semibold leading-5 text-gray-900" })),
-    h3: (props) => (_jsx("h3", { ...props, className: "mb-1 text-[12px] font-semibold leading-5 text-gray-900" })),
-    h4: (props) => (_jsx("h4", { ...props, className: "mb-1 text-[12px] font-medium leading-5 text-gray-800" })),
-    p: (props) => _jsx("p", { ...props, className: "my-1 text-[12px] leading-5 text-gray-700" }),
+    h1: (props) => (_jsx("h1", { ...props, className: "mb-2 text-sm leading-5 font-semibold text-gray-900" })),
+    h2: (props) => (_jsx("h2", { ...props, className: "mb-1.5 text-[13px] leading-5 font-semibold text-gray-900" })),
+    h3: (props) => (_jsx("h3", { ...props, className: "mb-1 text-[12px] leading-5 font-semibold text-gray-900" })),
+    h4: (props) => (_jsx("h4", { ...props, className: "mb-1 text-[12px] leading-5 font-medium text-gray-800" })),
+    p: (props) => (_jsx("p", { ...props, className: "my-1 text-[12px] leading-5 text-gray-700" })),
     ul: (props) => (_jsx("ul", { ...props, className: "my-2 ml-5 list-disc space-y-1 text-[12px] leading-5 text-gray-700" })),
     ol: (props) => (_jsx("ol", { ...props, className: "my-2 ml-5 list-decimal space-y-1 text-[12px] leading-5 text-gray-700" })),
-    li: (props) => _jsx("li", { ...props, className: "text-[12px] leading-5 text-gray-700" }),
+    li: (props) => (_jsx("li", { ...props, className: "text-[12px] leading-5 text-gray-700" })),
     pre: (props) => (_jsx("pre", { ...props, className: "my-2 overflow-auto rounded-md bg-slate-100 px-3 py-2 text-[11px] leading-4 text-slate-700" })),
     code: ({ inline, className, ...props }) => inline ? (_jsx("code", { ...props, className: "rounded bg-slate-100 px-1 py-0.5 text-[11px] text-slate-700" })) : (_jsx("code", { ...props, className: className })),
 };
@@ -149,25 +149,36 @@ function toUserFacingAgentErrorMessage(value) {
     if (!normalizedValue)
         return "";
     const trimmed = normalizedValue.trim();
-    const maybeJson = trimmed.startsWith("{") || trimmed.startsWith("[") || trimmed.startsWith('"');
+    const maybeJson = trimmed.startsWith("{") ||
+        trimmed.startsWith("[") ||
+        trimmed.startsWith('"');
     if (maybeJson) {
         try {
             const parsed = JSON.parse(trimmed);
             const structuredMessage = typeof parsed === "string"
                 ? parsed
-                : typeof parsed?.error === "string"
-                    ? parsed.error
-                    : typeof parsed?.message === "string"
-                        ? parsed.message
-                        : typeof parsed?.detail === "string"
-                            ? parsed.detail
-                            : typeof parsed?.error_description === "string"
-                                ? parsed.error_description
-                                : typeof parsed?.error === "object" &&
-                                    parsed?.error &&
-                                    typeof parsed.error.message ===
-                                        "string"
-                                    ? String(parsed.error.message)
+                : typeof parsed?.error === "object" && parsed?.error
+                    ? (() => {
+                        const errObj = parsed.error;
+                        // Extract detailed message from metadata.raw (OpenRouter-style nested errors)
+                        if (typeof errObj.metadata?.raw ===
+                            "string") {
+                            return String(errObj.metadata.raw);
+                        }
+                        // Fall back to error.message
+                        if (typeof errObj.message === "string") {
+                            return errObj.message;
+                        }
+                        return "";
+                    })()
+                    : typeof parsed?.error === "string"
+                        ? parsed.error
+                        : typeof parsed?.message === "string"
+                            ? parsed.message
+                            : typeof parsed?.detail === "string"
+                                ? parsed.detail
+                                : typeof parsed?.error_description === "string"
+                                    ? parsed.error_description
                                     : "";
             if (structuredMessage.trim()) {
                 value = structuredMessage;
@@ -607,7 +618,8 @@ const groupConsecutiveMessages = (agentMessages) => {
             // Add user message
             groups.push({ type: "user", messages: [message] });
         }
-        else if (message.messageType === "heartbeat" || message.role === "system") {
+        else if (message.messageType === "heartbeat" ||
+            message.role === "system") {
             if (currentAssistantGroup.length > 0) {
                 groups.push({
                     type: "assistant-group",
@@ -720,6 +732,35 @@ const stringifyToolField = (value) => {
         return String(value);
     }
 };
+const parseToolResultValue = (value) => {
+    if (value === undefined || value === null) {
+        return undefined;
+    }
+    if (typeof value === "object") {
+        return value;
+    }
+    if (typeof value !== "string") {
+        return String(value);
+    }
+    const trimmed = value.trim();
+    if (!trimmed) {
+        return undefined;
+    }
+    try {
+        let parsed = JSON.parse(trimmed);
+        if (typeof parsed === "string" &&
+            (parsed.startsWith("{") || parsed.startsWith("["))) {
+            parsed = JSON.parse(parsed);
+        }
+        if (parsed && typeof parsed === "object") {
+            return parsed;
+        }
+    }
+    catch {
+        // Fall back to the original string when the payload is plain text.
+    }
+    return value;
+};
 const getFirstToolCallEnvelope = (data) => {
     if (!data || typeof data !== "object")
         return undefined;
@@ -779,13 +820,14 @@ const convertAgentMessagesToAiFormat = (agentMessages) => {
                 ? agentMessage.toolCalls.map((toolCall) => {
                     const isPruned = !!toolCall.isPruned ||
                         /^PRUNED$/i.test(toolCall.functionError || "");
+                    const displayResult = parseToolResultValue(toolCall.functionResultRichContent) ?? toolCall.functionResult;
                     return {
                         id: toolCall.toolCallId,
                         displayName: toolCall.functionName,
                         function: {
                             name: toolCall.functionName,
                             arguments: toolCall.functionArguments,
-                            result: toolCall.functionResult,
+                            result: displayResult,
                             error: toolCall.functionError,
                         },
                         // Pass through approval info if present on the tool call
@@ -798,7 +840,7 @@ const convertAgentMessagesToAiFormat = (agentMessages) => {
                         // Tool call is streaming if message is not completed and tool call has no result yet
                         isStreaming: !agentMessage.isCompleted &&
                             !toolCall.isCompleted &&
-                            !toolCall.functionResult &&
+                            !displayResult &&
                             !toolCall.functionError &&
                             !isPruned,
                         // Pass through message IDs for approval/rejection events
@@ -1087,6 +1129,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({
@@ -1102,7 +1145,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const [toolsSectionExpanded, setToolsSectionExpanded] = useState(false);
     const [allowancesSectionExpanded, setAllowancesSectionExpanded] = useState(false);
     const [subscribedTriggersSectionExpanded, setSubscribedTriggersSectionExpanded,] = useState(false);
-    const isNewAgent = agent?.status === "new";
+    const isPersistedAgent = !!agent?.userId;
+    const isLocalOnlyDraftAgent = agent?.status === "new" && !isPersistedAgent;
     const hasSpawnedAgents = useMemo(() => {
         if (!agentMetadata)
             return false;
@@ -1289,9 +1333,10 @@ 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 = isLocalOnlyDraftAgent
+            ? preloadedSkillIds
+            : backendAssignedSkillIds.filter((id) => preloadedIdSet.has(id.toLowerCase()));
         const seen = new Set();
         const unique = [];
         for (const id of all) {
@@ -1302,9 +1347,13 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             unique.push(id);
         }
         return unique;
-    }, [backendAssignedSkillIds, isNewAgent, preloadedSkillIds]);
+    }, [backendAssignedSkillIds, isLocalOnlyDraftAgent, preloadedSkillIds]);
     const selectedSkillIds = useMemo(() => {
-        const all = [...autoAssignedSkillIds, ...metadataSelectedSkillIds];
+        const all = [
+            ...autoAssignedSkillIds,
+            ...backendAssignedSkillIds,
+            ...metadataSelectedSkillIds,
+        ];
         const seen = new Set();
         const unique = [];
         for (const id of all) {
@@ -1315,7 +1364,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             unique.push(id);
         }
         return unique;
-    }, [autoAssignedSkillIds, metadataSelectedSkillIds]);
+    }, [autoAssignedSkillIds, backendAssignedSkillIds, metadataSelectedSkillIds]);
     useEffect(() => {
         let active = true;
         if (!showAgentSettings) {
@@ -1323,7 +1372,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 active = false;
             };
         }
-        if (!agent?.id || agent.status === "new") {
+        if (!agent?.id || isLocalOnlyDraftAgent) {
             setTriggerSubscriptions([]);
             setTriggerSubscriptionsLoading(false);
             setTriggerSubscriptionsError(null);
@@ -1407,6 +1456,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         showAgentSettings,
         agent?.id,
         agent?.status,
+        agent?.userId,
         agent?.profileId,
         mode,
         selectedSkillIds,
@@ -1444,7 +1494,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()))
@@ -1453,8 +1505,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const autoAssignedSkillSet = useMemo(() => new Set(autoAssignedSkillIds.map((id) => id.toLowerCase())), [autoAssignedSkillIds]);
     const previewAvailableTools = useMemo(() => {
         const baseToolNames = mode === "read-only"
-            ? activeProfile?.readOnlyToolNames ?? []
-            : activeProfile?.allowedToolNames ?? [];
+            ? (activeProfile?.readOnlyToolNames ?? [])
+            : (activeProfile?.allowedToolNames ?? []);
         const toolNames = new Set();
         for (const toolName of baseToolNames) {
             const normalized = String(toolName || "").trim();
@@ -1477,13 +1529,15 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         mode,
         selectedSkills,
     ]);
-    const displayedAvailableTools = isNewAgent
+    const displayedAvailableTools = isLocalOnlyDraftAgent
         ? previewAvailableTools
         : availableTools;
-    const displayedAvailableToolsLoading = isNewAgent
+    const displayedAvailableToolsLoading = isLocalOnlyDraftAgent
         ? false
         : availableToolsLoading;
-    const displayedAvailableToolsError = isNewAgent ? null : availableToolsError;
+    const displayedAvailableToolsError = isLocalOnlyDraftAgent
+        ? null
+        : availableToolsError;
     // Remove deprecated cost limit fields from metadata to avoid confusion with agent/profile settings
     const sanitizeAgentMetadata = useCallback((meta) => {
         try {
@@ -1508,20 +1562,24 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             return meta;
         }
     }, []);
-    const updateSelectedSkillIds = useCallback(async (skillIds) => {
-        if (!agent?.id)
-            return;
-        const current = agentMetadata || {};
-        const currentAdditionalData = current.additionalData || {};
-        const nextAdditionalData = {
-            ...currentAdditionalData,
-        };
-        if (skillIds.length > 0) {
-            nextAdditionalData.skillIds = skillIds;
+    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.";
         }
-        else {
-            delete nextAdditionalData.skillIds;
+        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 = Object.fromEntries(Object.entries(currentAdditionalData).filter(([key]) => key.toLowerCase() !== "skillids"));
         const next = {
             ...current,
         };
@@ -1532,26 +1590,168 @@ 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,
+        agentMetadata,
+        metadataSelectedSkillIds,
+        setAgent,
+        setAgentMetadata,
+    ]);
+    const parsePersistedAgentContext = (contextJson) => {
+        try {
+            if (!contextJson)
+                return null;
+            const parsedContext = JSON.parse(contextJson);
+            if (!parsedContext || typeof parsedContext !== "object") {
+                return null;
+            }
+            return sanitizeAgentMetadata(parsedContext);
+        }
+        catch {
+            return null;
+        }
+    };
+    const buildDraftPersistenceContext = () => {
+        let effectiveContext = agentMetadata;
+        try {
+            const normalizedAgentProfileId = agent?.profileId?.toLowerCase();
+            const profile = activeProfile ||
+                profiles.find((p) => p.id?.toLowerCase() === normalizedAgentProfileId);
+            const isLiveMode = profile?.editorContextMode === "live";
+            if (isLiveMode && typeof buildCurrentContext === "function") {
+                const freshContext = buildCurrentContext();
+                if (freshContext) {
+                    effectiveContext = {
+                        ...(agentMetadata || {}),
+                        items: freshContext.items,
+                        currentItemId: freshContext.currentItemId,
+                        components: freshContext.components,
+                        field: freshContext.field,
+                        activeWorkspace: freshContext.activeWorkspace,
+                        hasPageLoaded: freshContext.hasPageLoaded,
+                        openSidebars: freshContext.openSidebars,
+                    };
+                }
+            }
+        }
+        catch (e) {
+            console.warn("[AgentTerminal] Failed to compute draft context:", e);
         }
-    }, [agent?.id, agent?.status, agentMetadata, setAgent, setAgentMetadata]);
+        return sanitizeAgentMetadata(effectiveContext || null);
+    };
+    const ensureDraftAgentPersisted = async () => {
+        if (!agent?.id) {
+            throw new Error("Agent not ready. Please try again.");
+        }
+        if (!isLocalOnlyDraftAgent) {
+            return agent;
+        }
+        const requestSettings = getPendingRequestSettings();
+        if (!requestSettings.profileId) {
+            throw new Error("Select an agent profile before adding a skill.");
+        }
+        const effectiveContext = buildDraftPersistenceContext();
+        const persistedAgent = await persistDraftAgent({
+            agentId: agent.id,
+            sessionId: editContext?.sessionId || undefined,
+            profileId: requestSettings.profileId,
+            mode: requestSettings.mode,
+            model: requestSettings.modelId || undefined,
+            name: agent.name,
+            context: effectiveContext,
+        });
+        pendingSettingsRef.current = null;
+        const persistedMetadata = parsePersistedAgentContext(persistedAgent.agentContext) ??
+            effectiveContext;
+        setAgentMetadata(persistedMetadata ? { ...persistedMetadata } : null);
+        setAgent((prev) => {
+            const next = {
+                ...(prev || {}),
+                ...persistedAgent,
+            };
+            if (prev?.messages?.length && !persistedAgent.messages?.length) {
+                next.messages = prev.messages;
+            }
+            return next;
+        });
+        onAgentUpdate?.(persistedAgent);
+        return persistedAgent;
+    };
     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);
+            const persistedAgent = await ensureDraftAgentPersisted();
+            await assignAgentSkill({ agentId: persistedAgent.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,
+        ensureDraftAgentPersisted,
+        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;
@@ -2232,7 +2432,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         if (toolCallMessageId && message.data && toolCallId) {
             const toolCallError = message.data.functionError || message.data.error || "";
             const isPruned = !!message.data?.isPruned || /^PRUNED$/i.test(String(toolCallError));
-            const toolCallCreatedDate = message.data.createdDate || message.timestamp || new Date().toISOString();
+            const toolCallCreatedDate = message.data.createdDate ||
+                message.timestamp ||
+                new Date().toISOString();
             const toolCall = {
                 id: toolCallId,
                 messageId: toolCallMessageId,
@@ -2241,6 +2443,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 functionName: extractedToolCall.functionName,
                 functionArguments: extractedToolCall.functionArguments,
                 functionResult: message.data.functionResult || message.data.result || "",
+                functionResultRichContent: message.data.richContent || undefined,
                 functionError: toolCallError,
                 isPruned,
                 isCompleted: false,
@@ -2290,12 +2493,15 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     newArgsText !== existingArgsText) ||
                     (existingArgsText === "{}" && newArgsText !== "{}");
                 const hasNewResult = toolCall.functionResult && !existingToolCall.functionResult;
+                const hasNewRichContent = toolCall.functionResultRichContent &&
+                    !existingToolCall.functionResultRichContent;
                 const hasNewError = toolCall.functionError && !existingToolCall.functionError;
                 const hasNewApprovalInfo = toolCall.requiresApproval && !existingToolCall.requiresApproval;
                 const hasNewDbMessageId = toolCall.dbMessageId && !existingToolCall.dbMessageId;
                 // Only update if there's meaningful new data
                 if (hasMoreCompleteArgs ||
                     hasNewResult ||
+                    hasNewRichContent ||
                     hasNewError ||
                     hasNewApprovalInfo ||
                     hasNewDbMessageId) {
@@ -2315,6 +2521,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                         ? newArgsText
                                         : existingArgsText || existing.functionArguments,
                                     functionResult: toolCall.functionResult || existing.functionResult,
+                                    functionResultRichContent: toolCall.functionResultRichContent ||
+                                        existing.functionResultRichContent,
                                     functionError: toolCall.functionError || existing.functionError,
                                     requiresApproval: toolCall.requiresApproval || existing.requiresApproval,
                                 };
@@ -2475,6 +2683,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                 ? nextArgsText
                                 : existingToolCall.functionArguments,
                             functionResult: message.data.functionResult || message.data.result || "",
+                            functionResultRichContent: message.data.richContent ||
+                                existingToolCall.functionResultRichContent,
                             functionError: message.data.functionError || message.data.error || "",
                             isCompleted: true,
                             responseTimeMs: message.data.responseTimeMs,
@@ -2491,7 +2701,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 }
                 else if (message.data && resultToolCallId && resultMessageId) {
                     // Create new tool call if it doesn't exist
-                    const toolCallCreatedDate = message.data.createdDate || message.timestamp || new Date().toISOString();
+                    const toolCallCreatedDate = message.data.createdDate ||
+                        message.timestamp ||
+                        new Date().toISOString();
                     const toolCall = {
                         id: resultToolCallId,
                         messageId: resultMessageId,
@@ -2499,6 +2711,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                         functionName: extractedToolCall.functionName,
                         functionArguments: extractedToolCall.functionArguments,
                         functionResult: message.data.functionResult || message.data.result || "",
+                        functionResultRichContent: message.data.richContent || undefined,
                         functionError: message.data.functionError || message.data.error || "",
                         isCompleted: true,
                         responseTimeMs: message.data.responseTimeMs,
@@ -2593,7 +2806,9 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             // The agent might have been persisted after sending a prompt
             // Only treat as "new" if backend returns 404
             const hasExistingMessages = messagesRef.current.length > 0;
-            if (agentStub.status === "new" && !hasExistingMessages) {
+            if (agentStub.status === "new" &&
+                !agentStub.userId &&
+                !hasExistingMessages) {
                 // Only initialize as new if we have no messages yet (initial mount)
                 // Derive initial profile from provided metadata if present
                 const initialProfileIdFromMeta = (() => {
@@ -3939,14 +4154,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 return prev;
             return candidate;
         });
-    }, [profiles, agent?.id, agent?.profileId, agentStub.id, agentStub.profileId]);
+    }, [
+        profiles,
+        agent?.id,
+        agent?.profileId,
+        agentStub.id,
+        agentStub.profileId,
+    ]);
     // Clear queued prompts when agent changes or is new;
     // initial fetch is handled by loadAgent() for better performance and reliability
     useEffect(() => {
-        if (!agent?.id || agent.status === "new") {
+        if (!agent?.id || isLocalOnlyDraftAgent) {
             setQueuedPrompts([]);
         }
-    }, [agent?.id, agent?.status]);
+    }, [agent?.id, isLocalOnlyDraftAgent]);
     // Update selected model when the active profile or agent model changes
     useEffect(() => {
         if (!activeProfile)
@@ -5224,17 +5445,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const renderErrorBanner = () => {
         const currentAgent = agent || agentStub;
         const isErrorStatus = currentAgent?.status === "error";
-        const errorMessage = (isErrorStatus ? currentAgent?.statusMessage : null) || error;
-        if (!errorMessage)
+        const rawErrorMessage = (isErrorStatus ? currentAgent?.statusMessage : null) || error;
+        if (!rawErrorMessage)
             return null;
+        // Clean the error message (statusMessage from DB may contain raw JSON)
+        const errorMessage = toUserFacingAgentErrorMessage(rawErrorMessage) || rawErrorMessage;
         return (_jsx("div", { className: "m-3 rounded border border-red-300 bg-red-50 p-3 text-[11px] text-red-900", "data-testid": "agent-error-banner", children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx(AlertCircle, { className: "mt-0.5 h-4 w-4 shrink-0 text-red-500", strokeWidth: 1 }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "mb-1 font-semibold", children: "Agent Error" }), _jsx("div", { className: "text-red-800", children: errorMessage })] })] }) }));
     };
     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
@@ -5258,6 +5482,28 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     };
     const fixedBrowserClaimBanner = renderBrowserClaimBanner("fixed");
     const inlineBrowserClaimBanner = null;
+    const browserCaptureInlinePrompt = isPendingBrowserCaptureWait && !isClaimedByCurrentSession
+        ? {
+            toolNames: [
+                "capture-page-screenshot",
+                "capture-parhelia-ui-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);
@@ -5327,7 +5573,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 ||
@@ -5480,7 +5726,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 ||
@@ -5709,7 +5955,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                     mode: nextMode,
                                                 };
                                                 try {
-                                                    if (!agent?.id || agent.status === "new") {
+                                                    if (!agent?.id || isLocalOnlyDraftAgent) {
                                                         setMode(nextMode);
                                                         setAgentMetadata(nextMeta);
                                                         pendingSettingsRef.current = {
@@ -5721,7 +5967,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                     const result = await updateAgentSettings(agent.id, {
                                                         mode: nextMode,
                                                     });
-                                                    if (result.success === false || result.updates?.mode === false) {
+                                                    if (result.success === false ||
+                                                        result.updates?.mode === false) {
                                                         throw new Error("Mode change was not applied");
                                                     }
                                                     setMode(nextMode);
@@ -5748,7 +5995,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                                 return;
                                                                             setActiveProfile(nextProfile);
                                                                             try {
-                                                                                if (agent?.id && agent.status !== "new") {
+                                                                                if (agent?.id && !isLocalOnlyDraftAgent) {
                                                                                     await updateAgentSettings(agent.id, {
                                                                                         profileId: nextProfile.id,
                                                                                         profileName: nextProfile.name,
@@ -5806,7 +6053,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                             const modelName = activeProfile?.models?.find((m) => m.id === nextId)?.name || "";
                                                                             setAgent((prev) => prev ? { ...prev, model: modelName } : prev);
                                                                             try {
-                                                                                if (agent?.id && agent.status !== "new") {
+                                                                                if (agent?.id && !isLocalOnlyDraftAgent) {
                                                                                     await updateAgentSettings(agent.id, {
                                                                                         model: modelName,
                                                                                     });
@@ -5821,36 +6068,47 @@ 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);
                                                                                         }, children: _jsx(ExternalLink, { className: "h-2.5 w-2.5", strokeWidth: 1.5 }) }), autoAssignedSkillSet.has(skillId.toLowerCase()) ? (_jsx("span", { className: "text-[9px] text-gray-500", children: "auto" })) : (_jsx("button", { type: "button", className: "rounded p-0.5 text-gray-500 hover:bg-gray-200 hover:text-gray-700", onClick: () => {
                                                                                             void handleRemoveSkill(skillId);
                                                                                         }, title: "Remove skill", "aria-label": `Remove ${skill?.name || skillId}`, children: _jsx(X, { className: "h-2.5 w-2.5", strokeWidth: 1 }) }))] }, skillId));
-                                                                        }) }))] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setToolsSectionExpanded((open) => !open), className: "mb-0.5 flex w-full items-center justify-between rounded px-0.5 py-0.5 text-left text-[11px] font-medium text-gray-700 hover:bg-gray-100/80", "aria-expanded": toolsSectionExpanded, "data-testid": "agent-tools-section-toggle", children: [_jsxs("span", { children: ["Available tools (", displayedAvailableTools.length, ")"] }), toolsSectionExpanded ? (_jsx(ChevronUp, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 })) : (_jsx(ChevronDown, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 }))] }), toolsSectionExpanded && (_jsx("div", { className: "max-h-36 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", "data-testid": "agent-tools-section", children: displayedAvailableToolsLoading ? (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Loading available tools..." })) : displayedAvailableTools.length > 0 ? (_jsxs("div", { className: "space-y-0.5", children: [isNewAgent && (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Preview based on the current profile, mode, and selected skills." })), displayedAvailableTools.map((toolName) => (_jsx("div", { className: "rounded px-1 py-0.5 transition-colors hover:bg-white/60", "data-testid": "agent-tool-row", title: toolName, children: _jsx("div", { className: "truncate text-[10px] text-gray-700", children: toolName }) }, toolName)))] })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isNewAgent
+                                                                        }) }))] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setToolsSectionExpanded((open) => !open), className: "mb-0.5 flex w-full items-center justify-between rounded px-0.5 py-0.5 text-left text-[11px] font-medium text-gray-700 hover:bg-gray-100/80", "aria-expanded": toolsSectionExpanded, "data-testid": "agent-tools-section-toggle", children: [_jsxs("span", { children: ["Available tools (", displayedAvailableTools.length, ")"] }), toolsSectionExpanded ? (_jsx(ChevronUp, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 })) : (_jsx(ChevronDown, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 }))] }), toolsSectionExpanded && (_jsx("div", { className: "max-h-36 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", "data-testid": "agent-tools-section", children: displayedAvailableToolsLoading ? (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Loading available tools..." })) : displayedAvailableTools.length > 0 ? (_jsxs("div", { className: "space-y-0.5", children: [isLocalOnlyDraftAgent && (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Preview based on the current profile, mode, and selected skills." })), displayedAvailableTools.map((toolName) => (_jsx("div", { className: "rounded px-1 py-0.5 transition-colors hover:bg-white/60", "data-testid": "agent-tool-row", title: toolName, children: _jsx("div", { className: "truncate text-[10px] text-gray-700", children: toolName }) }, toolName)))] })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isLocalOnlyDraftAgent
                                                                                 ? "No available tools for this profile and mode"
                                                                                 : "No available tools" })) })), displayedAvailableToolsError && (_jsx("div", { className: "mt-1 text-[10px] text-red-600", children: displayedAvailableToolsError }))] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setAllowancesSectionExpanded((open) => !open), className: "mb-0.5 flex w-full items-center justify-between rounded px-0.5 py-0.5 text-left text-[11px] font-medium text-gray-700 hover:bg-gray-100/80", "aria-expanded": allowancesSectionExpanded, "data-testid": "agent-allowances-section-toggle", children: [_jsxs("span", { children: ["Allowances (", allowancesTotalCount, ")"] }), allowancesSectionExpanded ? (_jsx(ChevronUp, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 })) : (_jsx(ChevronDown, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 }))] }), allowancesSectionExpanded && (_jsx("div", { className: "max-h-36 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", "data-testid": "agent-allowances-section", children: operationAllowancesLoading ? (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Loading allowances..." })) : hasAnyAllowances ? (_jsx("div", { className: "space-y-1", children: allowanceGroups.map((group) => group.rows.length > 0 ? (_jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "px-1 text-[9px] font-medium tracking-wide text-gray-400 uppercase", children: group.label }), group.rows.map((allowance, index) => {
                                                                                         const sourceLabel = formatAllowanceSource(allowance.source);
@@ -5865,12 +6123,12 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                                                     ]
                                                                                                         .filter(Boolean)
                                                                                                         .join(" · ") }))] }, `${group.key}-${allowance.operationType}-${pathLabel}-${index}`));
-                                                                                    })] }, group.key)) : null) })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isNewAgent
+                                                                                    })] }, group.key)) : null) })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isLocalOnlyDraftAgent
                                                                                 ? "Allowances are shown after the agent is created"
                                                                                 : "No active allowances" })) })), operationAllowancesError && (_jsx("div", { className: "mt-1 text-[10px] text-red-600", children: operationAllowancesError }))] }), _jsxs("div", { children: [_jsxs("button", { type: "button", onClick: () => setSubscribedTriggersSectionExpanded((open) => !open), className: "mb-0.5 flex w-full items-center justify-between rounded px-0.5 py-0.5 text-left text-[11px] font-medium text-gray-700 hover:bg-gray-100/80", "aria-expanded": subscribedTriggersSectionExpanded, "data-testid": "agent-subscribed-triggers-section-toggle", children: [_jsx("span", { children: `Subscribed triggers (${activeTriggerSubscriptions.length})` }), subscribedTriggersSectionExpanded ? (_jsx(ChevronUp, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 })) : (_jsx(ChevronDown, { className: "h-3 w-3 shrink-0 text-gray-400", strokeWidth: 1.5 }))] }), subscribedTriggersSectionExpanded && (_jsx("div", { className: "max-h-28 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", "data-testid": "agent-subscribed-triggers-section", children: triggerSubscriptionsLoading ? (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "Loading subscribed triggers..." })) : activeTriggerSubscriptions.length > 0 ? (_jsx("div", { className: "space-y-0.5", children: activeTriggerSubscriptions.map((sub) => {
                                                                                 const filterText = (sub.filter || "").trim();
                                                                                 return (_jsxs("div", { className: "flex items-baseline gap-1.5 rounded px-1 py-0.5 transition-colors hover:bg-white/60", children: [_jsx("div", { className: "shrink-0 text-[10px] font-medium text-gray-700", children: sub.triggerName }), filterText.length > 0 && (_jsx("div", { className: "truncate text-[9px] text-gray-400", title: filterText, children: filterText }))] }, sub.id));
-                                                                            }) })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isNewAgent
+                                                                            }) })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: isLocalOnlyDraftAgent
                                                                                 ? "Subscribed triggers are shown after the agent is created"
                                                                                 : "No active trigger subscriptions" })) })), triggerSubscriptionsError && (_jsx("div", { className: "mt-1 text-[10px] text-red-600", children: triggerSubscriptionsError }))] })] }) })] }), activeProfile?.prompts?.length ? (_jsxs(Popover, { open: showPredefined, onOpenChange: setShowPredefined, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { className: "rounded p-1 hover:bg-gray-100", onClick: () => { }, title: "Predefined prompts", "aria-label": "Predefined prompts", type: "button", children: _jsx(Wand2, { className: "h-3 w-3", strokeWidth: 1 }) }) }), _jsx(PopoverContent, { className: "w-64 p-0", align: "start", children: _jsx("div", { className: "max-h-56 overflow-y-auto p-2", children: activeProfile.prompts.map((p, index) => (_jsx("div", { className: "cursor-pointer rounded p-1.5 text-[10px] text-gray-700 hover:bg-gray-100", onClick: () => {
                                                                 setPrompt(p.prompt);