@parhelia/core 0.1.12368 → 0.1.12393

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, updateAgentSettings, updateAgentCostLimit, updateAgentContext, getAgentSkillCatalog, getAgentTriggerSubscriptions, cancelAgent, canonicalizeAgentMetadata, getPendingPrompts, } from "../services/agentService";
+import { getAgent, startAgent, updateAgentSettings, updateAgentCostLimit, updateAgentContext, getAgentSkillCatalog, getAgentOperationAllowances, getAgentTriggerSubscriptions, cancelAgent, canonicalizeAgentMetadata, getPendingPrompts, } from "../services/agentService";
 import { useEditContext, useFieldsEditContext } from "../client/editContext";
 import { localStorageService } from "../services/localStorageService";
 import { Textarea } from "../../components/ui/textarea";
@@ -22,7 +22,6 @@ import { formatTime, formatDateTime } from "../utils";
 import { cn } from "../../lib/utils";
 import { Select } from "../../components/ui/select";
 import { AgentTerminalStatusBar } from "./AgentTerminalStatusBar";
-import { useMediaQuery } from "../client/hooks/useMediaQuery";
 import { SimpleTabs } from "../ui/SimpleTabs";
 import { Splitter } from "../ui/Splitter";
 import { ScrollingContentTree } from "../ScrollingContentTree";
@@ -46,6 +45,7 @@ function buildPlaceholderAgentDetails(agentStub) {
         totalInputTokenCost: 0,
         totalOutputTokenCost: 0,
         totalCachedInputTokenCost: 0,
+        totalImageCost: 0,
         totalCost: 0,
         currency: agentStub.currency || "USD",
         messageCount: agentStub.messageCount || 0,
@@ -54,6 +54,27 @@ function buildPlaceholderAgentDetails(agentStub) {
 function normalizeDialogAgentId(value) {
     return value?.trim().toLowerCase() || "";
 }
+function formatAllowanceSource(source) {
+    const normalized = source?.trim();
+    if (!normalized)
+        return null;
+    if (normalized === "user")
+        return "User granted";
+    if (normalized.startsWith("preconfigured:profile:"))
+        return "Profile";
+    if (normalized.startsWith("preconfigured:skill:"))
+        return "Skill";
+    if (normalized.startsWith("system:")) {
+        return normalized
+            .slice("system:".length)
+            .replace(/[-_]+/g, " ")
+            .trim();
+    }
+    return normalized;
+}
+function formatAllowanceLabel(allowance) {
+    return `${allowance.operationType || "*"}${"itemPath" in allowance ? ` ${allowance.itemPath}` : ` ${allowance.normalizedPath}`}`;
+}
 function getVisibleDialogRegistry() {
     const registry = globalThis.__agentDialogVisibleCallbacks;
     return registry && typeof registry === "object" ? registry : {};
@@ -538,6 +559,7 @@ const calculateTotalTokens = (messages) => {
             outputCost: acc.outputCost + (message.outputTokenCost || 0),
             cachedCost: acc.cachedCost + (message.cachedInputTokenCost || 0),
             cacheWriteCost: acc.cacheWriteCost,
+            imageCost: acc.imageCost,
             totalCost: acc.totalCost + (message.totalCost || 0),
         };
     }, {
@@ -549,6 +571,7 @@ const calculateTotalTokens = (messages) => {
         outputCost: 0,
         cachedCost: 0,
         cacheWriteCost: 0,
+        imageCost: 0,
         totalCost: 0,
     });
     return totals;
@@ -635,28 +658,36 @@ const convertAgentMessagesToAiFormat = (agentMessages) => {
             role: agentMessage.role,
             createdDate: agentMessage.createdDate,
             tool_calls: agentMessage.toolCalls
-                ? agentMessage.toolCalls.map((toolCall) => ({
-                    id: toolCall.toolCallId,
-                    displayName: toolCall.functionName,
-                    function: {
-                        name: toolCall.functionName,
-                        arguments: toolCall.functionArguments,
-                        result: toolCall.functionResult,
-                        error: toolCall.functionError,
-                    },
-                    // Pass through approval info if present on the tool call
-                    requiresApproval: toolCall.requiresApproval,
-                    // Pass through isCompleted so ToolCallDisplay knows when to hide spinner
-                    isCompleted: toolCall.isCompleted,
-                    // Tool call is streaming if message is not completed and tool call has no result yet
-                    isStreaming: !agentMessage.isCompleted &&
-                        !toolCall.isCompleted &&
-                        !toolCall.functionResult &&
-                        !toolCall.functionError,
-                    // Pass through message IDs for approval/rejection events
-                    messageId: toolCall.messageId,
-                    dbMessageId: toolCall.dbMessageId,
-                }))
+                ? agentMessage.toolCalls.map((toolCall) => {
+                    const isPruned = !!toolCall.isPruned ||
+                        /^PRUNED$/i.test(toolCall.functionError || "");
+                    return {
+                        id: toolCall.toolCallId,
+                        displayName: toolCall.functionName,
+                        function: {
+                            name: toolCall.functionName,
+                            arguments: toolCall.functionArguments,
+                            result: toolCall.functionResult,
+                            error: toolCall.functionError,
+                        },
+                        // Pass through approval info if present on the tool call
+                        requiresApproval: toolCall.requiresApproval,
+                        // Pass through prune metadata so the terminal can render a neutral state
+                        isPruned,
+                        prunedAt: toolCall.prunedAt,
+                        // Pass through isCompleted so ToolCallDisplay knows when to hide spinner
+                        isCompleted: toolCall.isCompleted,
+                        // Tool call is streaming if message is not completed and tool call has no result yet
+                        isStreaming: !agentMessage.isCompleted &&
+                            !toolCall.isCompleted &&
+                            !toolCall.functionResult &&
+                            !toolCall.functionError &&
+                            !isPruned,
+                        // Pass through message IDs for approval/rejection events
+                        messageId: toolCall.messageId,
+                        dbMessageId: toolCall.dbMessageId,
+                    };
+                })
                 : [],
         };
         if (agentMessage.toolCallId) {
@@ -881,7 +912,6 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const [mode, setMode] = useState("supervised");
     const [queuedPrompts, setQueuedPrompts] = useState([]);
     const [expandedQueuedTriggerIds, setExpandedQueuedTriggerIds] = useState({});
-    const isMobile = useMediaQuery("(max-width: 768px)");
     const [contextPanelsActiveTab, setContextPanelsActiveTab] = useState(0);
     const [hiddenContextPanelTabIds, setHiddenContextPanelTabIds] = useState(new Set());
     const [showCostAndAgent, setShowCostAndAgent] = useState(false);
@@ -893,8 +923,14 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const [skillsLoading, setSkillsLoading] = useState(false);
     const [skillsError, setSkillsError] = useState(null);
     const [triggerSubscriptions, setTriggerSubscriptions] = useState([]);
+    const [operationAllowances, setOperationAllowances] = useState({
+        sitecore: [],
+        filesystem: [],
+    });
     const [triggerSubscriptionsLoading, setTriggerSubscriptionsLoading] = useState(false);
+    const [operationAllowancesLoading, setOperationAllowancesLoading] = useState(false);
     const [triggerSubscriptionsError, setTriggerSubscriptionsError] = useState(null);
+    const [operationAllowancesError, setOperationAllowancesError] = useState(null);
     const hasSpawnedAgents = useMemo(() => {
         if (!agentMetadata)
             return false;
@@ -1030,7 +1066,11 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         }
         if (!agent?.id || agent.status === "new") {
             setTriggerSubscriptions([]);
+            setTriggerSubscriptionsLoading(false);
             setTriggerSubscriptionsError(null);
+            setOperationAllowances({ sitecore: [], filesystem: [] });
+            setOperationAllowancesLoading(false);
+            setOperationAllowancesError(null);
             return () => {
                 active = false;
             };
@@ -1055,7 +1095,28 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 }
             }
         };
+        const loadOperationAllowances = async () => {
+            try {
+                setOperationAllowancesLoading(true);
+                setOperationAllowancesError(null);
+                const allowances = await getAgentOperationAllowances(agent.id);
+                if (active) {
+                    setOperationAllowances(allowances);
+                }
+            }
+            catch (e) {
+                if (active) {
+                    setOperationAllowancesError(e?.message || "Failed to load allowances");
+                }
+            }
+            finally {
+                if (active) {
+                    setOperationAllowancesLoading(false);
+                }
+            }
+        };
         void loadTriggerSubscriptions();
+        void loadOperationAllowances();
         return () => {
             active = false;
         };
@@ -1132,6 +1193,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         return unique;
     }, [backendAssignedSkillIds, metadataSelectedSkillIds]);
     const activeTriggerSubscriptions = useMemo(() => triggerSubscriptions.filter((sub) => sub.isActive), [triggerSubscriptions]);
+    const allowanceGroups = useMemo(() => [
+        {
+            key: "sitecore",
+            label: "Sitecore",
+            rows: operationAllowances.sitecore,
+        },
+        {
+            key: "filesystem",
+            label: "Filesystem",
+            rows: operationAllowances.filesystem,
+        },
+    ], [operationAllowances]);
+    const hasAnyAllowances = useMemo(() => operationAllowances.sitecore.length > 0 ||
+        operationAllowances.filesystem.length > 0, [operationAllowances]);
     const allowedProfileSkillIdSet = useMemo(() => {
         const ids = activeProfile?.allowedSkills
             ?.map((skill) => String(skill?.id || "").toLowerCase())
@@ -1301,7 +1376,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     const seenMessageIdsRef = useRef(new Set());
     const lastSeqRef = useRef(0);
     const subscribedAgentIdRef = useRef(null);
-    // Cache mode/model changes made while the agent is still "new" (not yet persisted)
+    // Cache mode/model/profile changes made while the agent is still "new" (not yet persisted)
     const pendingSettingsRef = useRef(null);
     // Track whether textarea should maintain focus during re-renders
     const shouldMaintainFocusRef = useRef(false);
@@ -1652,6 +1727,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 outputCost: Number(cost.output) || 0,
                 cachedCost: Number(cost.cached) || 0,
                 cacheWriteCost: Number(cost.cacheWrite) || 0,
+                imageCost: Number(cost.imageCost ?? cost.totalImageCost) || 0,
                 totalCost: Number(cost.total) || 0,
                 currency: "USD",
             };
@@ -1795,6 +1871,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
         }
         // Add tool call to the message in the array
         if (toolCallMessageId && message.data && toolCallId) {
+            const toolCallError = message.data.functionError || message.data.error || "";
+            const isPruned = !!message.data?.isPruned || /^PRUNED$/i.test(String(toolCallError));
             const toolCall = {
                 id: toolCallId,
                 messageId: toolCallMessageId,
@@ -1803,7 +1881,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 functionName: extractedToolCall.functionName,
                 functionArguments: extractedToolCall.functionArguments,
                 functionResult: message.data.functionResult || message.data.result || "",
-                functionError: message.data.functionError || message.data.error || "",
+                functionError: toolCallError,
+                isPruned,
                 isCompleted: false,
                 responseTimeMs: message.data.responseTimeMs,
                 createdDate: new Date().toISOString(),
@@ -1936,6 +2015,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 outputCost: Number(cost.output) || 0,
                 cachedCost: Number(cost.cached) || 0,
                 cacheWriteCost: Number(cost.cacheWrite) || 0,
+                imageCost: Number(cost.imageCost) || 0,
                 totalCost: Number(cost.total) || 0,
                 currency: "USD",
             };
@@ -1984,6 +2064,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     outputCost: Number(data.totalOutputTokenCost) || 0,
                     cachedCost: Number(data.totalCachedTokenCost) || 0,
                     cacheWriteCost: Number(data.totalCacheWriteTokenCost) || 0,
+                    imageCost: Number(data.totalImageCost) || 0,
                     totalCost: Number(data.totalCost) || 0,
                     currency: data.currency || "USD",
                 };
@@ -2180,6 +2261,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                     totalInputTokenCost: 0,
                     totalOutputTokenCost: 0,
                     totalCachedInputTokenCost: 0,
+                    totalImageCost: 0,
                     totalCost: 0,
                     messageCount: 0,
                 });
@@ -2918,6 +3000,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                             outputCost: Number(totals.totalOutputTokenCost) || 0,
                             cachedCost: Number(totals.totalCachedInputTokenCost) || 0,
                             cacheWriteCost: Number(totals.totalCacheWriteTokenCost) || 0,
+                            imageCost: Number(totals.totalImageCost) || 0,
                             totalCost: totalCost,
                             currency: totals.currency,
                         };
@@ -3446,9 +3529,20 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             ? (profiles.find((p) => p.id?.toLowerCase() === normalizedProfileId) ??
                 profiles[0])
             : profiles[0];
-        if (candidate && (!activeProfile || activeProfile.id !== candidate.id)) {
-            setActiveProfile(candidate);
-        }
+        if (!candidate)
+            return;
+        // Keep active profile in sync whenever the matching entry in `profiles` changes —
+        // not only when the profile id changes. Otherwise allowedSkills (and similar fields)
+        // that are merged in the parent after async loads never update (e.g. Template Builder
+        // settings skills merged into the profile).
+        setActiveProfile((prev) => {
+            if (!prev || prev.id !== candidate.id)
+                return candidate;
+            const skillKey = (p) => JSON.stringify((p.allowedSkills ?? []).map((s) => [String(s?.id ?? ""), String(s?.name ?? "")]));
+            if (skillKey(prev) === skillKey(candidate))
+                return prev;
+            return candidate;
+        });
     }, [profiles, agent?.profileId, agentStub.profileId]);
     // Clear queued prompts when agent changes or is new;
     // initial fetch is handled by loadAgent() for better performance and reliability
@@ -3514,7 +3608,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
             textareaRef.current.focus();
         }
     }, [messages, activePlaceholderInput]);
-    // Persist any pending settings (mode/model) once an agent exists server-side
+    // Persist any pending settings (mode/model/profile) once an agent exists server-side
     const persistPendingSettingsIfNeeded = useCallback(async () => {
         try {
             if (!agent?.id)
@@ -3527,6 +3621,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                 payload.model = pending.modelName;
             if (pending.mode)
                 payload.mode = pending.mode;
+            if (pending.profileId)
+                payload.profileId = pending.profileId;
+            if (pending.profileName != null)
+                payload.profileName = pending.profileName;
             if (Object.keys(payload).length === 0)
                 return;
             await updateAgentSettings(agent.id, payload);
@@ -4431,8 +4529,16 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
     if (effectiveCostLimit === undefined) {
         effectiveCostLimit = undefined;
     }
-    // Calculate total token usage for cost display
-    const totalTokens = calculateTotalTokens(messages);
+    // Calculate total token usage for cost display.
+    // Message rows do not currently persist imageCost, so on refresh we fall back
+    // to the persisted agent aggregate for that single field.
+    const totalTokens = (() => {
+        const totals = calculateTotalTokens(messages);
+        return {
+            ...totals,
+            imageCost: totals.imageCost || Number(agent?.totalImageCost) || 0,
+        };
+    })();
     // Determine if the agent is actively executing (submitting, connecting, waiting, or streaming)
     const isExecuting = isSubmitting ||
         isConnecting ||
@@ -4809,7 +4915,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                             activeProfile?.name ||
                                                             "Agent" }), _jsx("span", { className: "text-xs text-gray-400", children: formatTime(new Date()) })] }), _jsxs("div", { className: "flex items-center gap-1 pt-2", children: [_jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.3s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400 [animation-delay:-0.15s]" }), _jsx("div", { className: "h-1 w-1 animate-bounce rounded-full bg-gray-400" })] })] })] }))] }), !simpleMode && renderCostLimitBanner(), _jsx("div", { ref: messagesEndRef })] }), !hideContext &&
                 !simpleMode &&
-                (isMobile ? (_jsx("div", { className: "border-t border-gray-200 bg-gray-50", "data-testid": "agent-context-panel-tabs", children: _jsx(SimpleTabs, { tabs: [
+                (editContext?.isMobile ? (_jsx("div", { className: "border-t border-gray-200 bg-gray-50", "data-testid": "agent-context-panel-tabs", children: _jsx(SimpleTabs, { tabs: [
                             {
                                 id: "context",
                                 label: "Context",
@@ -5034,6 +5140,8 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                                 else {
                                                                                     pendingSettingsRef.current = {
                                                                                         ...(pendingSettingsRef.current || {}),
+                                                                                        profileId: nextProfile.id,
+                                                                                        profileName: nextProfile.name,
                                                                                     };
                                                                                     setAgentMetadata((current) => {
                                                                                         const next = {
@@ -5120,7 +5228,16 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                                         }, children: _jsx(ExternalLink, { className: "h-2.5 w-2.5", strokeWidth: 1.5 }) }), backendAssignedSkillSet.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: [_jsx("div", { className: "mb-0.5 px-0.5 text-[11px] font-medium text-gray-700", children: "Subscribed triggers" }), _jsx("div", { className: "max-h-28 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", 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) => {
+                                                                        }) }))] }), _jsxs("div", { children: [_jsx("div", { className: "mb-0.5 px-0.5 text-[11px] font-medium text-gray-700", children: "Allowances" }), _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 uppercase tracking-wide text-gray-400", children: group.label }), group.rows.map((allowance, index) => {
+                                                                                        const sourceLabel = formatAllowanceSource(allowance.source);
+                                                                                        const pathLabel = "itemPath" in allowance
+                                                                                            ? allowance.itemPath
+                                                                                            : allowance.normalizedPath;
+                                                                                        return (_jsxs("div", { className: "rounded px-1 py-0.5 hover:bg-white/60 transition-colors", "data-testid": `agent-allowance-row-${group.key}`, children: [_jsxs("div", { className: "flex items-baseline gap-1.5", children: [_jsx("div", { className: "shrink-0 text-[10px] font-medium text-gray-700", children: allowance.operationType || "*" }), _jsx("div", { className: "truncate text-[9px] text-gray-500", title: formatAllowanceLabel(allowance), children: pathLabel })] }), (sourceLabel ||
+                                                                                                    allowance.grantedBy) && (_jsx("div", { className: "truncate pl-6 text-[9px] text-gray-400", children: [sourceLabel, allowance.grantedBy]
+                                                                                                        .filter(Boolean)
+                                                                                                        .join(" · ") }))] }, `${group.key}-${allowance.operationType}-${pathLabel}-${index}`));
+                                                                                    })] }, group.key)) : null) })) : (_jsx("div", { className: "px-1 text-[10px] text-gray-500", children: "No active allowances" })) }), operationAllowancesError && (_jsx("div", { className: "mt-1 text-[10px] text-red-600", children: operationAllowancesError }))] }), _jsxs("div", { children: [_jsx("div", { className: "mb-0.5 px-0.5 text-[11px] font-medium text-gray-700", children: "Subscribed triggers" }), _jsx("div", { className: "max-h-28 overflow-y-auto rounded border border-gray-100 bg-gray-50/50 p-1", 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 hover:bg-white/60 transition-colors", 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: "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: () => {
@@ -5128,10 +5245,10 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                 setShowPredefined(false);
                                                                 if (textareaRef.current)
                                                                     textareaRef.current.focus();
-                                                            }, children: p.title }, index))) }) })] })) : null, !hideBottomControls && !simpleMode && isMobile && (_jsxs(Popover, { open: showCostAndAgent, onOpenChange: setShowCostAndAgent, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { onClick: () => {
-                                                            if (isMobile)
+                                                            }, children: p.title }, index))) }) })] })) : null, !hideBottomControls && !simpleMode && editContext?.isMobile && (_jsxs(Popover, { open: showCostAndAgent, onOpenChange: setShowCostAndAgent, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { onClick: () => {
+                                                            if (editContext?.isMobile)
                                                                 setShowCostAndAgent((prev) => !prev);
-                                                        }, variant: "outline", size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", "aria-expanded": isMobile ? showCostAndAgent : undefined, "aria-label": "Toggle cost and context info", children: _jsx(DollarSign, { className: "size-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: _jsx(AgentTerminalStatusBar, { agent: agent, contextWindowStatus: contextWindowStatus, effectiveModelName: effectiveModelName, liveTotals: liveTotals, totalTokens: liveTotals
+                                                        }, variant: "outline", size: "sm", className: "h-5.5 w-5.5 cursor-pointer rounded-full", "aria-expanded": editContext?.isMobile ? showCostAndAgent : undefined, "aria-label": "Toggle cost and context info", children: _jsx(DollarSign, { className: "size-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: _jsx(AgentTerminalStatusBar, { agent: agent, contextWindowStatus: contextWindowStatus, effectiveModelName: effectiveModelName, liveTotals: liveTotals, totalTokens: liveTotals
                                                                 ? {
                                                                     input: liveTotals.input,
                                                                     output: liveTotals.output,
@@ -5141,6 +5258,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                                     outputCost: liveTotals.outputCost,
                                                                     cachedCost: liveTotals.cachedCost,
                                                                     cacheWriteCost: liveTotals.cacheWriteCost ?? 0,
+                                                                    imageCost: liveTotals.imageCost ?? 0,
                                                                     totalCost: liveTotals.totalCost,
                                                                 }
                                                                 : totalTokens, effectiveCostLimit: effectiveCostLimit, messages: messages, showCompressionPopover: showCompressionPopover, setShowCompressionPopover: setShowCompressionPopover }) }) })] }))] })), _jsxs("div", { className: "flex items-center gap-1 self-end", children: [_jsx("span", { title: isVoiceDisabled
@@ -5164,7 +5282,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                                 : allPendingApprovals.length > 0
                                                     ? "Approve or reject pending tool calls first"
                                                     : "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 })) })] })] }));
-                    })(), !hideBottomControls && !simpleMode && !isMobile && (_jsx(AgentTerminalStatusBar, { agent: agent, contextWindowStatus: contextWindowStatus, effectiveModelName: effectiveModelName, liveTotals: liveTotals, totalTokens: liveTotals
+                    })(), !hideBottomControls && !simpleMode && !editContext?.isMobile && (_jsx(AgentTerminalStatusBar, { agent: agent, contextWindowStatus: contextWindowStatus, effectiveModelName: effectiveModelName, liveTotals: liveTotals, totalTokens: liveTotals
                             ? {
                                 input: liveTotals.input,
                                 output: liveTotals.output,
@@ -5174,6 +5292,7 @@ export function AgentTerminal({ agentStub, initialMetadata, profiles, isActive =
                                 outputCost: liveTotals.outputCost,
                                 cachedCost: liveTotals.cachedCost,
                                 cacheWriteCost: liveTotals.cacheWriteCost ?? 0,
+                                imageCost: liveTotals.imageCost ?? 0,
                                 totalCost: liveTotals.totalCost,
                             }
                             : totalTokens, effectiveCostLimit: effectiveCostLimit, messages: messages, showCompressionPopover: showCompressionPopover, setShowCompressionPopover: setShowCompressionPopover }))] })] }));