@agent-native/core 0.137.2 → 0.137.4

package/dist/client/resources/ResourceTree.d.ts

@@ -27,6 +27,9 @@ export interface ResourceTreeProps {
     sectionAction?: React.ReactNode;
     /** Scope-specific action shown beneath an empty collection message. */
     emptyStateAction?: React.ReactNode;
+    /** Optional copy for collection empty states. */
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
 }
-export declare function ResourceTree({ tree, variant, selectedId, onSelect, onCreateFile, onCreateFolder, onDelete, onDrop, title, titleTooltip, isLoading, deletingId, readOnly, headingHint, sectionAction, emptyStateAction, }: ResourceTreeProps): React.JSX.Element;
+export declare function ResourceTree({ tree, variant, selectedId, onSelect, onCreateFile, onCreateFolder, onDelete, onDrop, title, titleTooltip, isLoading, deletingId, readOnly, headingHint, sectionAction, emptyStateAction, emptyStateTitle, emptyStateDescription, }: ResourceTreeProps): React.JSX.Element;
 //# sourceMappingURL=ResourceTree.d.ts.map

package/dist/client/resources/ResourceTree.js

@@ -109,9 +109,9 @@ function getCollectionDescriptor(node) {
             "Scheduled job");
     }
     if (node.kind === "mcp-server")
-        return "MCP server";
+        return "Agent integration";
     if (node.kind === "mcp-builtin")
-        return "Built-in MCP";
+        return "Built-in agent tool";
     return formatResourceSize(node.resource.size);
 }
 function CollectionResourceRow({ node, selectedId, deletingId, readOnly, onSelect, onDelete, }) {
@@ -197,7 +197,7 @@ function InlineInput({ depth, onConfirm, onCancel, }) {
                 }, className: "min-w-0 flex-1 bg-transparent text-[12px] leading-none text-foreground outline-none placeholder:text-muted-foreground/50", placeholder: "filename.md" })] }));
 }
 // ─── ResourceTree ───────────────────────────────────────────────────────────
-export function ResourceTree({ tree, variant = "tree", selectedId, onSelect, onCreateFile, onCreateFolder, onDelete, onDrop, title = "Files", titleTooltip, isLoading = false, deletingId = null, readOnly = false, headingHint, sectionAction, emptyStateAction, }) {
+export function ResourceTree({ tree, variant = "tree", selectedId, onSelect, onCreateFile, onCreateFolder, onDelete, onDrop, title = "Files", titleTooltip, isLoading = false, deletingId = null, readOnly = false, headingHint, sectionAction, emptyStateAction, emptyStateTitle, emptyStateDescription, }) {
     const [expanded, setExpanded] = useState(() => new Set());
     const [creating, setCreating] = useState(null);
     const [dragOver, setDragOver] = useState(false);
@@ -258,14 +258,19 @@ export function ResourceTree({ tree, variant = "tree", selectedId, onSelect, onC
             onDrop(e.dataTransfer.files);
         }
     }, [onDrop, readOnly]);
-    return (_jsxs("div", { className: cn("p-1", dragOver && !readOnly && "ring-1 ring-inset ring-accent"), onDragOver: readOnly ? undefined : handleDragOver, onDragLeave: readOnly ? undefined : handleDragLeave, onDrop: readOnly ? undefined : handleDrop, children: [_jsx("div", { className: "group/root flex items-center justify-between px-1.5 py-1", children: _jsxs(TooltipProvider, { delayDuration: 200, children: [_jsxs("span", { className: "flex items-center gap-1.5 text-[11px] font-medium uppercase tracking-wide text-muted-foreground/60", children: [title, headingHint && (_jsx("span", { className: "text-[10px] font-normal normal-case tracking-normal text-muted-foreground/50", children: headingHint })), titleTooltip && (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": `About ${title}`, className: "flex h-3.5 w-3.5 items-center justify-center rounded-full text-muted-foreground/40 hover:text-muted-foreground", children: _jsx(IconHelpCircle, { className: "h-3 w-3" }) }) }), _jsx(TooltipContent, { children: titleTooltip })] }))] }), sectionAction ??
+    return (_jsxs("div", { className: cn(variant === "collection"
+            ? "overflow-hidden rounded-xl border border-border/70 bg-card text-card-foreground"
+            : "p-1", dragOver && !readOnly && "ring-1 ring-inset ring-accent"), onDragOver: readOnly ? undefined : handleDragOver, onDragLeave: readOnly ? undefined : handleDragLeave, onDrop: readOnly ? undefined : handleDrop, children: [_jsx("div", { className: cn("group/root flex items-center justify-between", variant === "collection" ? "px-4 py-3" : "px-1.5 py-1"), children: _jsxs(TooltipProvider, { delayDuration: 200, children: [_jsxs("span", { className: cn("flex items-center gap-1.5 font-medium text-muted-foreground", variant === "collection"
+                                ? "text-sm"
+                                : "text-[11px] uppercase tracking-wide text-muted-foreground/60"), children: [title, headingHint && (_jsx("span", { className: "text-[10px] font-normal normal-case tracking-normal text-muted-foreground/50", children: headingHint })), titleTooltip && (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": `About ${title}`, className: "flex h-3.5 w-3.5 items-center justify-center rounded-full text-muted-foreground/40 hover:text-muted-foreground", children: _jsx(IconHelpCircle, { className: "h-3 w-3" }) }) }), _jsx(TooltipContent, { children: titleTooltip })] }))] }), sectionAction ??
                             (variant === "tree" && !readOnly && (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { onClick: () => handleStartCreate("", "file"), "aria-label": "New file", className: "flex h-5 w-5 items-center justify-center rounded text-muted-foreground/50 opacity-0 group-hover/root:opacity-100 hover:text-foreground hover:bg-accent/50", children: _jsx(IconPlus, { className: "h-3 w-3" }) }) }), _jsx(TooltipContent, { children: "New file" })] })))] }) }), variant === "collection"
-                ? leafResources.length > 0 && (_jsx("div", { className: "space-y-1", children: leafResources.map((node) => (_jsx(CollectionResourceRow, { node: node, selectedId: selectedId, deletingId: deletingId, readOnly: readOnly, onSelect: onSelect, onDelete: onDelete }, node.resource.id))) }))
+                ? leafResources.length > 0 && (_jsx("div", { className: "divide-y divide-border/60 px-4", children: leafResources.map((node) => (_jsx(CollectionResourceRow, { node: node, selectedId: selectedId, deletingId: deletingId, readOnly: readOnly, onSelect: onSelect, onDelete: onDelete }, node.resource.id))) }))
                 : tree.map((node) => (_jsx(TreeNodeRow, { node: node, depth: 0, expanded: expanded, selectedId: selectedId, deletingId: deletingId, readOnly: readOnly, onToggle: toggleExpand, onSelect: onSelect, onDelete: onDelete, onStartCreate: handleStartCreate }, node.resource?.id ?? node.path))), isLoading && isEmpty && (_jsx("div", { className: cn("px-1 py-1"), children: Array.from({ length: 3 }).map((_, i) => (_jsxs("div", { className: cn("flex items-center gap-2 px-1.5 py-1", variant === "collection" && "gap-3 px-2.5 py-3"), children: [_jsx("div", { className: cn("rounded bg-muted-foreground/10 animate-pulse", variant === "collection" ? "size-8" : "h-3.5 w-3.5"), style: { animationDelay: `${i * 75}ms` } }), _jsx("div", { className: "h-3 rounded bg-muted-foreground/10 animate-pulse", style: {
                                 width: `${50 + ((i * 37) % 40)}%`,
                                 animationDelay: `${i * 75}ms`,
-                            } })] }, i))) })), creating && creating.parentPath === "" && (_jsx(InlineInput, { depth: 0, onConfirm: handleConfirmCreate, onCancel: handleCancelCreate })), creating && creating.parentPath !== "" && (_jsx(InlineInput, { depth: creating.parentPath.split("/").filter(Boolean).length, onConfirm: handleConfirmCreate, onCancel: handleCancelCreate })), isEmpty && !creating && !isLoading && (_jsxs("div", { className: "flex flex-col items-start px-2 py-5", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: variant === "collection"
-                            ? "No resources in this collection yet"
-                            : "No files yet" }), emptyStateAction && _jsx("div", { className: "mt-4", children: emptyStateAction })] }))] }));
+                            } })] }, i))) })), creating && creating.parentPath === "" && (_jsx(InlineInput, { depth: 0, onConfirm: handleConfirmCreate, onCancel: handleCancelCreate })), creating && creating.parentPath !== "" && (_jsx(InlineInput, { depth: creating.parentPath.split("/").filter(Boolean).length, onConfirm: handleConfirmCreate, onCancel: handleCancelCreate })), isEmpty && !creating && !isLoading && (_jsxs("div", { className: cn("flex flex-col px-4 py-8", variant === "collection" && "items-center px-5 py-10 text-center"), children: [variant === "collection" && (_jsx("span", { className: "mb-3 flex size-10 items-center justify-center rounded-full bg-muted text-muted-foreground", children: _jsx(IconFolder, { className: "size-5" }) })), _jsx("p", { className: "text-sm font-medium text-foreground", children: variant === "collection"
+                            ? (emptyStateTitle ?? "No resources in this collection yet")
+                            : "No files yet" }), variant === "collection" && (_jsx("p", { className: "mt-1 max-w-sm text-xs leading-5 text-muted-foreground", children: emptyStateDescription ??
+                            "Add a resource to give your agent more context." })), emptyStateAction && _jsx("div", { className: "mt-4", children: emptyStateAction })] }))] }));
 }
 //# sourceMappingURL=ResourceTree.js.map

package/dist/client/resources/ResourcesPanel.js

@@ -892,7 +892,7 @@ export function ResourcesPanel({ showMcpServers = true, scope: requestedScope, s
                                                     : "Delete resource", className: cn("flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground hover:text-destructive hover:bg-accent/50", toolbarDeleteConfirmId === selectedResourceId &&
                                                     "bg-destructive/10 text-destructive"), children: _jsx(IconTrash, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: toolbarDeleteConfirmId === selectedResourceId
                                                 ? "Click again to delete"
-                                                : "Delete resource" })] }) }))] })] })) : (_jsxs("div", { className: "absolute top-1 right-1 z-10 flex items-center gap-1", children: [activeCreateMenuMode !== "hidden" &&
+                                                : "Delete resource" })] }) }))] })] })) : (_jsxs("div", { className: "absolute end-3 top-3 z-10 flex items-center gap-1", children: [activeCreateMenuMode !== "hidden" &&
                         (!resourceFilter || resourceFilter === "files") && (_jsx(CreateMenu, { scope: activeScope, resourceFilter: resourceFilter, personalMcpOnly: activeCreateMenuMode === "personal-mcp", onCreateFile: (name) => handleCreateFromToolbar(activeScope, name), onCreateResource: (path, content, mimeType, opts) => handleCreateResourceFromToolbar(activeScope, path, content, mimeType, opts), onCreateMcpServer: handleCreateMcpServer, canCreateOrgMcp: canCreateOrgMcp, hasOrg: hasOrgForMcp, showToast: showToast, mcpIntegrations: mcpIntegrations })), (!resourceFilter || resourceFilter === "files") && (_jsxs(_Fragment, { children: [activeCreateMenuMode === "full" && (_jsx(TooltipProvider, { delayDuration: 200, children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { onClick: () => fileInputRef.current?.click(), "aria-label": "Upload file", className: "flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground hover:text-foreground hover:bg-accent/50", children: _jsx(IconUpload, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: "Upload file" })] }) })), _jsx(TooltipProvider, { delayDuration: 200, children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", onClick: () => setShowAgentScratch((value) => !value), "aria-label": showAgentScratch
                                                     ? "Hide agent scratch files"
                                                     : "Show agent scratch files", className: cn("flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground hover:text-foreground hover:bg-accent/50", showAgentScratch && "bg-accent/50 text-foreground"), children: _jsx(IconEye, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { children: showAgentScratch
@@ -910,13 +910,17 @@ export function ResourcesPanel({ showMcpServers = true, scope: requestedScope, s
                                     ? deleteResource.variables
                                     : deleteMcpServer.isPending
                                         ? `mcp:${deleteMcpServer.variables.scope}:${deleteMcpServer.variables.id}`
-                                        : null, selectedId: selectedResourceId, onSelect: handleSelect, onCreateFile: (parentPath, name) => handleCreateFile(parentPath, name, "personal"), onCreateFolder: (parentPath, name) => handleCreateFolder(parentPath, name, "personal"), onDelete: handleDelete, onRename: handleRename, onDrop: (files) => handleUploadFiles(files, "personal"), title: "Personal", titleTooltip: "Files visible only to you", sectionAction: renderScopeCreateMenu("personal"), emptyStateAction: renderEmptyStateAction("personal") }) })), showSharedTree && (_jsx("div", { className: "pt-3", children: _jsx(ResourceTree, { tree: displayedSharedTree, variant: resourceTreeVariant, isLoading: sharedTreeQuery.isLoading, deletingId: deleteResource.isPending
+                                        : null, selectedId: selectedResourceId, onSelect: handleSelect, onCreateFile: (parentPath, name) => handleCreateFile(parentPath, name, "personal"), onCreateFolder: (parentPath, name) => handleCreateFolder(parentPath, name, "personal"), onDelete: handleDelete, onRename: handleRename, onDrop: (files) => handleUploadFiles(files, "personal"), title: "Personal", titleTooltip: "Files visible only to you", sectionAction: renderScopeCreateMenu("personal"), emptyStateAction: renderEmptyStateAction("personal"), emptyStateTitle: resourceFilter === "files" ? "No files yet" : undefined, emptyStateDescription: resourceFilter === "files"
+                                    ? "Add a file to give your agent more context."
+                                    : undefined }) })), showSharedTree && (_jsx("div", { className: "pt-3", children: _jsx(ResourceTree, { tree: displayedSharedTree, variant: resourceTreeVariant, isLoading: sharedTreeQuery.isLoading, deletingId: deleteResource.isPending
                                     ? deleteResource.variables
                                     : deleteMcpServer.isPending
                                         ? `mcp:${deleteMcpServer.variables.scope}:${deleteMcpServer.variables.id}`
                                         : null, selectedId: selectedResourceId, onSelect: handleSelect, onCreateFile: (parentPath, name) => handleCreateFile(parentPath, name, "shared"), onCreateFolder: (parentPath, name) => handleCreateFolder(parentPath, name, "shared"), onDelete: handleDelete, onRename: handleRename, onDrop: (files) => handleUploadFiles(files, "shared"), title: "Organization", titleTooltip: canEditOrg
                                     ? "Files visible to everyone in your organization"
-                                    : "Files visible to everyone in your organization. Read-only — only admins can edit.", readOnly: !canEditOrg, headingHint: !canEditOrg ? "Read only" : undefined, sectionAction: renderScopeCreateMenu("shared"), emptyStateAction: renderEmptyStateAction("shared") }) }))] })) }), toast && (_jsx("div", { className: "pointer-events-none absolute bottom-3 left-1/2 z-[300] -translate-x-1/2", children: _jsxs("div", { role: "status", className: cn("pointer-events-auto flex max-w-[320px] items-center gap-3 rounded-md border px-3 py-2 text-[12px] shadow-md", toast.kind === "ok"
+                                    : "Files visible to everyone in your organization. Read-only — only admins can edit.", readOnly: !canEditOrg, headingHint: !canEditOrg ? "Read only" : undefined, sectionAction: renderScopeCreateMenu("shared"), emptyStateAction: renderEmptyStateAction("shared"), emptyStateTitle: resourceFilter === "files" ? "No files yet" : undefined, emptyStateDescription: resourceFilter === "files"
+                                    ? "Add a file to give your agent more context."
+                                    : undefined }) }))] })) }), toast && (_jsx("div", { className: "pointer-events-none absolute bottom-3 left-1/2 z-[300] -translate-x-1/2", children: _jsxs("div", { role: "status", className: cn("pointer-events-auto flex max-w-[320px] items-center gap-3 rounded-md border px-3 py-2 text-[12px] shadow-md", toast.kind === "ok"
                         ? "border-emerald-500/40 bg-emerald-500/10 text-emerald-600 dark:text-emerald-300"
                         : "border-red-500/40 bg-red-500/10 text-red-600 dark:text-red-300"), children: [_jsx("span", { className: "min-w-0 flex-1 truncate", children: toast.message }), toast.kind === "ok" && toast.resourceId && (_jsx("button", { type: "button", onClick: () => {
                                 setSelectedResourceId(toast.resourceId);

package/dist/client/resources/mcp-integration-catalog.js

@@ -189,7 +189,7 @@ export const DEFAULT_MCP_INTEGRATIONS = [
         id: "cloudflare",
         name: "Cloudflare",
         provider: "cloudflare",
-        description: "Search and operate Cloudflare services through MCP.",
+        description: "Search and operate Cloudflare services.",
         descriptionKey: "mcpIntegrations.catalog.cloudflare.description",
         useCase: "DNS, Workers, domains, security, observability, platform APIs",
         useCaseKey: "mcpIntegrations.catalog.cloudflare.useCase",
@@ -302,7 +302,7 @@ export const DEFAULT_MCP_INTEGRATIONS = [
         id: "slack",
         name: "Slack",
         provider: "slack",
-        description: "Search Slack conversations and take workspace actions through MCP.",
+        description: "Search Slack conversations and take workspace actions.",
         descriptionKey: "mcpIntegrations.catalog.slack.description",
         useCase: "messages, channels, people, company memory, workflows",
         useCaseKey: "mcpIntegrations.catalog.slack.useCase",
@@ -338,7 +338,7 @@ export const DEFAULT_MCP_INTEGRATIONS = [
         id: "hubspot",
         name: "HubSpot",
         provider: "hubspot",
-        description: "Search and update HubSpot CRM records through MCP.",
+        description: "Search and update HubSpot CRM records.",
         descriptionKey: "mcpIntegrations.catalog.hubspot.description",
         useCase: "CRM, contacts, companies, deals, tickets, customer analytics",
         useCaseKey: "mcpIntegrations.catalog.hubspot.useCase",
@@ -464,7 +464,7 @@ export const DEFAULT_MCP_INTEGRATIONS = [
         id: "zapier",
         name: "Zapier",
         provider: "zapier",
-        description: "Connect MCP tools to thousands of app actions.",
+        description: "Connect tools to thousands of app actions.",
         descriptionKey: "mcpIntegrations.catalog.zapier.description",
         useCase: "automation, workflows, app actions, cross-service operations",
         useCaseKey: "mcpIntegrations.catalog.zapier.useCase",

package/dist/client/resources/use-mcp-servers.js

@@ -62,7 +62,7 @@ export function useDeleteMcpServer() {
 export function getMcpUrlValidationError(rawUrl) {
     const trimmed = rawUrl.trim();
     if (!trimmed)
-        return "Enter the Streamable HTTP MCP server URL.";
+        return "Enter the Streamable HTTP agent integration URL.";
     let url;
     try {
         url = new URL(trimmed);
@@ -71,11 +71,11 @@ export function getMcpUrlValidationError(rawUrl) {
         return "Enter a full URL, including https://.";
     }
     if (url.protocol !== "https:" && url.protocol !== "http:") {
-        return "MCP server URLs must start with https://.";
+        return "Agent integration URLs must start with https://.";
     }
     if (url.protocol === "http:" &&
         !["localhost", "127.0.0.1"].includes(url.hostname)) {
-        return "Use https:// for remote MCP servers. Plain http:// is only allowed for localhost.";
+        return "Use https:// for remote agent integrations. Plain http:// is only allowed for localhost.";
     }
     return null;
 }
@@ -87,7 +87,7 @@ export function formatMcpServerError(error) {
             : String(error ?? "");
     const text = raw.trim();
     if (!text)
-        return "Could not connect to that MCP server.";
+        return "Could not connect to that agent integration.";
     if (/<!doctype|<html[\s>]|<\/html>|unexpected token '<'|is not valid json/i.test(text)) {
         return "That URL returned a web page instead of an MCP response. Check that you pasted the Streamable HTTP endpoint, often ending in /mcp.";
     }
@@ -96,10 +96,10 @@ export function formatMcpServerError(error) {
         return "The server did not complete the Streamable HTTP MCP handshake. Check the URL and any required authorization headers.";
     }
     if (/failed to fetch|fetch failed|networkerror|econnrefused|enotfound|timed out/i.test(text)) {
-        return "Could not reach that MCP server. Check the URL and make sure it is publicly reachable from this app.";
+        return "Could not reach that agent integration. Check the URL and make sure it is publicly reachable from this app.";
     }
     if (/401|403|unauthorized|forbidden/i.test(text)) {
-        return "The MCP server rejected the request. Add or update the required Authorization header.";
+        return "The agent integration rejected the request. Add or update the required Authorization header.";
     }
     if (/404|not found|405|method not allowed/i.test(text)) {
         return "That URL is reachable, but it does not look like the MCP endpoint. Check the server's Streamable HTTP path.";

package/dist/client/settings/AgentsSection.js

@@ -1,6 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ButtonBase as ToolkitButtonBase } from "@agent-native/toolkit/ui/button";
-import { IconPlus, IconPencil, IconTrash, IconX, IconCheck, IconLoader2, IconAlertTriangle, IconExternalLink, IconRefresh, } from "@tabler/icons-react";
+import { IconPlus, IconTrash, IconX, IconCheck, IconLoader2, IconAlertTriangle, IconExternalLink, IconRefresh, IconTopologyRing2, } from "@tabler/icons-react";
 import { useState, useEffect, useRef, useCallback } from "react";
 import { buildOpenRoutePath, buildSettingsRoute, STANDARD_SETTINGS_TABS, } from "../../navigation/index.js";
 import { getRemoteAgentIdFromPath, isRemoteAgentPath, REMOTE_AGENT_RESOURCE_PREFIX, remoteAgentResourcePath, } from "../../resources/metadata.js";
@@ -397,26 +397,25 @@ export function AgentsSection() {
         }
         catch { }
     };
-    return (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("div", { className: "text-[10px] text-muted-foreground", children: "@-mention agents in chat to delegate tasks via A2A." }), _jsxs("div", { className: "relative", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { onClick: () => {
-                                                setShowAdd(!showAdd);
-                                                setEditingAgent(null);
-                                            }, className: "flex h-5 w-5 items-center justify-center rounded text-muted-foreground hover:text-foreground hover:bg-accent/50", children: showAdd ? _jsx(IconX, { size: 12 }) : _jsx(IconPlus, { size: 12 }) }) }), _jsx(TooltipContent, { children: "Add agent" })] }), showAdd && (_jsx(AgentAddPopover, { initialName: prefill?.name, initialUrl: prefill?.url, initialDescription: prefill?.description, secretSet: org?.a2aSecretSet, syncSecret: syncSecret, onAdd: handleAdd, onClose: () => {
-                                    setShowAdd(false);
-                                    setPrefill(null);
-                                } }))] })] }), _jsx(A2ASecretStatusRow, { org: org, syncSecret: syncSecret }), loading ? (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "h-6 w-full rounded bg-muted/50 animate-pulse" }), _jsx("div", { className: "h-6 w-3/4 rounded bg-muted/50 animate-pulse" })] })) : agents.length === 0 ? (_jsxs("button", { onClick: () => setShowAdd(true), className: "flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/30", children: [_jsx(IconPlus, { size: 12, className: "shrink-0" }), "Add agent"] })) : (_jsxs("div", { className: "flex flex-col gap-0.5", children: [agents.map((agent) => {
+    return (_jsxs("div", { children: [_jsx("div", { className: "mb-3 flex flex-wrap items-center justify-end gap-3", children: _jsxs("div", { className: "relative", children: [_jsxs("button", { onClick: () => {
+                                setShowAdd(!showAdd);
+                                setEditingAgent(null);
+                            }, className: "inline-flex items-center gap-1.5 rounded-md border border-border px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent", children: [showAdd ? _jsx(IconX, { size: 13 }) : _jsx(IconPlus, { size: 13 }), showAdd ? "Cancel" : "Connect agent"] }), showAdd && (_jsx(AgentAddPopover, { initialName: prefill?.name, initialUrl: prefill?.url, initialDescription: prefill?.description, secretSet: org?.a2aSecretSet, syncSecret: syncSecret, onAdd: handleAdd, onClose: () => {
+                                setShowAdd(false);
+                                setPrefill(null);
+                            } }))] }) }), _jsx(A2ASecretStatusRow, { org: org, syncSecret: syncSecret }), loading ? (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "h-6 w-full rounded bg-muted/50 animate-pulse" }), _jsx("div", { className: "h-6 w-3/4 rounded bg-muted/50 animate-pulse" })] })) : agents.length === 0 ? (_jsxs("div", { className: "flex flex-col items-center rounded-xl border border-border/70 bg-card px-5 py-8 text-center", children: [_jsx("span", { className: "mb-2 flex size-9 items-center justify-center rounded-full bg-muted text-muted-foreground", children: _jsx(IconTopologyRing2, { size: 17 }) }), _jsx("p", { className: "text-sm font-medium text-foreground", children: "No connected agents yet" }), _jsx("p", { className: "mt-1 max-w-sm text-xs leading-5 text-muted-foreground", children: "Connect an A2A agent to delegate work from chat." }), _jsxs("button", { onClick: () => setShowAdd(true), className: "mt-4 inline-flex items-center gap-1.5 rounded-md border border-border px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent", children: [_jsx(IconPlus, { size: 13 }), "Connect agent"] })] })) : (_jsx("div", { className: "overflow-hidden rounded-xl border border-border/70 bg-card text-card-foreground", children: _jsx("div", { className: "divide-y divide-border/60 px-4", children: agents.map((agent) => {
                         const probe = probeById?.get(getRemoteAgentIdFromPath(agent.path).toLowerCase());
                         const dotState = !probe
                             ? null
                             : probe.reachable && probe.authorized !== false
                                 ? "ok"
                                 : "warn";
-                        return (_jsxs("div", { className: "group relative", children: [_jsxs("div", { className: "flex w-full items-center gap-2 rounded-md px-2 py-1.5 hover:bg-accent/30", children: [dotState ? (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: `h-1.5 w-1.5 shrink-0 rounded-full ${dotState === "ok" ? "bg-green-500" : "bg-amber-500"}` }) }), _jsx(TooltipContent, { children: probe && describeProbeTooltip(probe) })] })) : (_jsx("span", { className: "h-1.5 w-1.5 shrink-0 rounded-full bg-transparent" })), _jsx("span", { className: "text-[11px] font-medium text-foreground truncate shrink-0", children: agent.name }), _jsx("span", { className: "flex-1 text-[10px] text-muted-foreground/60 truncate text-end", children: agent.url }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { onClick: () => {
-                                                            setEditingAgent(editingAgent === agent.id ? null : agent.id);
-                                                            setShowAdd(false);
-                                                        }, className: "shrink-0 rounded p-0.5 text-muted-foreground opacity-0 group-hover:opacity-100 hover:text-foreground hover:bg-accent/50", children: _jsx(IconPencil, { size: 11 }) }) }), _jsx(TooltipContent, { children: "Edit agent" })] })] }), editingAgent === agent.id && (_jsx(AgentEditPopover, { agent: agent, onSave: handleSave, onDelete: handleDelete, onClose: () => setEditingAgent(null) }))] }, agent.id));
-                    }), _jsxs("button", { onClick: () => {
-                            setShowAdd(true);
-                            setEditingAgent(null);
-                        }, className: "flex w-full items-center gap-1.5 rounded-md px-2 py-1.5 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/30", children: [_jsx(IconPlus, { size: 12, className: "shrink-0" }), "Add agent"] })] }))] }));
+                        return (_jsxs("div", { className: "group relative", children: [_jsxs("div", { className: "flex w-full items-center gap-3 py-4", children: [_jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg border border-border bg-background text-muted-foreground", children: _jsx(IconTopologyRing2, { size: 15 }) }), dotState ? (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: `h-1.5 w-1.5 shrink-0 rounded-full ${dotState === "ok"
+                                                            ? "bg-primary"
+                                                            : "bg-destructive"}` }) }), _jsx(TooltipContent, { children: probe && describeProbeTooltip(probe) })] })) : (_jsx("span", { className: "h-1.5 w-1.5 shrink-0 rounded-full bg-transparent" })), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "block truncate text-sm font-medium text-foreground", children: agent.name }), _jsx("span", { className: "mt-0.5 block truncate text-xs text-muted-foreground", children: agent.url })] }), _jsx("button", { onClick: () => {
+                                                setEditingAgent(editingAgent === agent.id ? null : agent.id);
+                                                setShowAdd(false);
+                                            }, className: "shrink-0 rounded-md border border-border px-2.5 py-1.5 text-xs font-medium text-foreground hover:bg-accent", children: "Manage" })] }), editingAgent === agent.id && (_jsx(AgentEditPopover, { agent: agent, onSave: handleSave, onDelete: handleDelete, onClose: () => setEditingAgent(null) }))] }, agent.id));
+                    }) }) }))] }));
 }
 //# sourceMappingURL=AgentsSection.js.map

package/dist/client/settings/AutomationsSection.js

@@ -11,7 +11,7 @@ export function AutomationsSection() {
     const t = useT();
     return (_jsxs("div", { className: "space-y-3", children: [_jsx("p", { className: "text-xs leading-5 text-muted-foreground", children: t("jobs.settingsSummary", {
                     defaultValue: "Manage scheduled and event-triggered agent tasks together from the Automations page.",
-                }) }), _jsxs("div", { className: "flex flex-wrap gap-2 text-[11px] text-muted-foreground", children: [_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1", children: [_jsx(IconClock, { className: "size-3" }), t("jobs.scheduledTrigger", { defaultValue: "Scheduled" })] }), _jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1", children: [_jsx(IconBolt, { className: "size-3" }), t("jobs.eventTrigger", { defaultValue: "Event-triggered" })] })] }), _jsx(Button, { asChild: true, variant: "outline", size: "sm", children: _jsxs(Link, { to: "/agent#jobs", children: [t("jobs.openAutomations", {
+                }) }), _jsxs("div", { className: "flex flex-wrap gap-2 text-[11px] text-muted-foreground", children: [_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1", children: [_jsx(IconClock, { className: "size-3" }), t("jobs.scheduledTrigger", { defaultValue: "Scheduled" })] }), _jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-muted px-2 py-1", children: [_jsx(IconBolt, { className: "size-3" }), t("jobs.eventTrigger", { defaultValue: "Event-triggered" })] })] }), _jsx(Button, { asChild: true, variant: "outline", size: "sm", children: _jsxs(Link, { to: "/settings#agent:automations", children: [t("jobs.openAutomations", {
                             defaultValue: "Open Automations",
                         }), _jsx(IconArrowRight, { className: "size-3.5" })] }) })] }));
 }

package/dist/client/settings/DemoModeSection.js

@@ -5,6 +5,6 @@ import { setBrowserDemoModeEnabled } from "../../demo/browser-state.js";
 import { useDemoModeStatus } from "../use-demo-mode-status.js";
 export function DemoModeSection() {
     const { enabled } = useDemoModeStatus();
-    return (_jsxs("div", { className: "flex items-start justify-between gap-3 rounded-md border border-border bg-accent/30 px-2.5 py-2", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-[11px] font-medium text-foreground", children: "Enable demo mode" }), _jsx("p", { className: "text-[10px] text-muted-foreground mt-0.5", children: "Anonymize displayed emails in this browser and reshape supported dashboard charts for presentations. Backend, MCP, and agent results stay real and access-scoped." })] }), _jsx(Switch, { checked: enabled, onChange: (checked) => setBrowserDemoModeEnabled(checked), "aria-label": "Enable demo mode", className: "shrink-0" })] }));
+    return (_jsxs("div", { className: "flex items-start justify-between gap-3 rounded-md border border-border bg-accent/30 px-2.5 py-2", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-[11px] font-medium text-foreground", children: "Enable demo mode" }), _jsx("p", { className: "text-[10px] text-muted-foreground mt-0.5", children: "Anonymize displayed emails in this browser and reshape supported dashboard charts for presentations. Backend, agent integrations, and agent results stay real and access-scoped." })] }), _jsx(Switch, { checked: enabled, onChange: (checked) => setBrowserDemoModeEnabled(checked), "aria-label": "Enable demo mode", className: "shrink-0" })] }));
 }
 //# sourceMappingURL=DemoModeSection.js.map

package/dist/client/settings/SettingsPanel.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { type SettingsSectionId } from "./agent-settings-search.js";
 import type { SettingsTabItem } from "./SettingsTabsPage.js";
 export declare function AppDefaultModelField({ engine, models, value, defaultModel, disabled, onValueChange, onEnter, }: {
     engine: string;
@@ -29,8 +30,9 @@ export declare function SettingsPanel(props: SettingsPanelProps): React.JSX.Elem
 export declare function ConnectionsSettingsContent({ settingsPanelProps, }: {
     settingsPanelProps: SettingsPanelProps;
 }): React.JSX.Element;
-export declare function AgentSettingsContent({ className, }?: {
+export declare function AgentSettingsContent({ className, sections, }?: {
     className?: string;
+    sections?: readonly SettingsSectionId[];
 }): React.JSX.Element;
 export declare function useAgentSettingsTabs(options?: AgentSettingsTabsOptions): SettingsTabItem[];
 //# sourceMappingURL=SettingsPanel.d.ts.map