@inkeep/agents-manage-ui 0.18.0 → 0.19.0

package/src/components/{graph/error-display/graph-error-summary.tsx → agent/error-display/agent-error-summary.tsx}

@@ -6,10 +6,10 @@ import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
 import { useSidePane } from '@/hooks/use-side-pane';
-import type { GraphErrorSummary, ProcessedGraphError } from '@/lib/utils/graph-error-parser';
+import type { AgentErrorSummary, ProcessedAgentError } from '@/lib/utils/agent-error-parser';
 
-interface GraphErrorSummaryProps {
-  errorSummary: GraphErrorSummary;
+interface AgentErrorSummaryProps {
+  errorSummary: AgentErrorSummary;
   onClose: () => void;
   onNavigateToNode?: (nodeId: string) => void;
   onNavigateToEdge?: (edgeId: string) => void;
@@ -17,10 +17,10 @@ interface GraphErrorSummaryProps {
 
 interface ErrorGroupProps {
   title: string;
-  errors: ProcessedGraphError[];
+  errors: ProcessedAgentError[];
   icon: React.ReactNode;
   onNavigate?: (id: string) => void;
-  getItemLabel?: (error: ProcessedGraphError) => string;
+  getItemLabel?: (error: ProcessedAgentError) => string;
 }
 
 function ErrorGroup({ title, errors, icon, onNavigate, getItemLabel }: ErrorGroupProps) {
@@ -28,7 +28,7 @@ function ErrorGroup({ title, errors, icon, onNavigate, getItemLabel }: ErrorGrou
 
   if (errors.length === 0) return null;
 
-  const groupedErrors: Record<string, ProcessedGraphError[]> = {};
+  const groupedErrors: Record<string, ProcessedAgentError[]> = {};
   for (const error of errors) {
     const key = error.nodeId || error.edgeId || 'general';
     if (!groupedErrors[key]) groupedErrors[key] = [];
@@ -90,12 +90,12 @@ function ErrorGroup({ title, errors, icon, onNavigate, getItemLabel }: ErrorGrou
   );
 }
 
-export function GraphErrorSummaryComponent({
+export function AgentErrorSummaryComponent({
   errorSummary,
   onClose,
   onNavigateToNode,
   onNavigateToEdge,
-}: GraphErrorSummaryProps) {
+}: AgentErrorSummaryProps) {
   const { setQueryState } = useSidePane();
 
   const handleNavigateToNode = (nodeId: string) => {
@@ -116,22 +116,22 @@ export function GraphErrorSummaryComponent({
     onNavigateToEdge?.(edgeId);
   };
 
-  const agentErrors = Object.values(errorSummary.agentErrors).flat();
+  const subAgentErrors = Object.values(errorSummary.subAgentErrors).flat();
   const functionToolErrors = Object.values(errorSummary.functionToolErrors).flat();
   const edgeErrors = Object.values(errorSummary.edgeErrors).flat();
-  const graphErrors = errorSummary.graphErrors;
+  const agentErrors = errorSummary.agentErrors;
 
-  const getAgentLabel = (error: ProcessedGraphError) => {
-    // You might want to get the actual agent name from the graph data
+  const getAgentLabel = (error: ProcessedAgentError) => {
+    // You might want to get the actual agent name from the agent data
     return `Agent (${error.nodeId})`;
   };
 
-  const getFunctionToolLabel = (error: ProcessedGraphError) => {
-    // You might want to get the actual function tool name from the graph data
+  const getFunctionToolLabel = (error: ProcessedAgentError) => {
+    // You might want to get the actual function tool name from the agent data
     return `Function Tool (${error.nodeId})`;
   };
 
-  const getConnectionLabel = (error: ProcessedGraphError) => {
+  const getConnectionLabel = (error: ProcessedAgentError) => {
     return `Connection (${error.edgeId})`;
   };
 
@@ -150,12 +150,12 @@ export function GraphErrorSummaryComponent({
       </CardHeader>
       <CardContent className="space-y-2 px-3 overflow-y-auto max-h-[calc(80vh-80px)] scrollbar-thin scrollbar-thumb-red-200 dark:scrollbar-thumb-red-800 scrollbar-track-transparent hover:scrollbar-thumb-red-300 dark:hover:scrollbar-thumb-red-700">
         <div className="text-xs text-red-600 dark:text-red-400 mb-2">
-          Fix these issues to save your graph:
+          Fix these issues to save your agent:
         </div>
 
         <ErrorGroup
-          title="Agent Errors"
-          errors={agentErrors}
+          title="Sub Agent Errors"
+          errors={subAgentErrors}
           icon={<Zap className="w-3 h-3" />}
           onNavigate={handleNavigateToNode}
           getItemLabel={getAgentLabel}
@@ -178,8 +178,8 @@ export function GraphErrorSummaryComponent({
         />
 
         <ErrorGroup
-          title="Graph Configuration Errors"
-          errors={graphErrors}
+          title="Agent Configuration Errors"
+          errors={agentErrors}
           icon={<AlertCircle className="w-3 h-3" />}
         />
 
@@ -194,4 +194,4 @@ export function GraphErrorSummaryComponent({
 }
 
 // Export with the expected name for compatibility
-export { GraphErrorSummaryComponent as GraphErrorSummary };
+export { AgentErrorSummaryComponent as AgentErrorSummary };

package/src/components/{graph → agent}/error-display/error-indicator.tsx

@@ -2,10 +2,10 @@
 
 import { AlertCircle } from 'lucide-react';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
-import type { ProcessedGraphError } from '@/lib/utils/graph-error-parser';
+import type { ProcessedAgentError } from '@/lib/utils/agent-error-parser';
 
 interface ErrorIndicatorProps {
-  errors: ProcessedGraphError[];
+  errors: ProcessedAgentError[];
   className?: string;
 }
 

package/src/components/{graph → agent}/node-library/node-library.tsx

@@ -4,7 +4,7 @@ import { NodeType, nodeTypeMap } from '../configuration/node-types';
 import { NodeItem } from './node-item';
 
 const nodeTypes: NodeItem[] = [
-  nodeTypeMap[NodeType.Agent],
+  nodeTypeMap[NodeType.SubAgent],
   nodeTypeMap[NodeType.ExternalAgent],
   nodeTypeMap[NodeType.MCPPlaceholder],
   nodeTypeMap[NodeType.FunctionTool],

package/src/components/{graph → agent}/nodes/external-agent-node.tsx

@@ -1,8 +1,8 @@
 import { type NodeProps, Position } from '@xyflow/react';
 import { BotMessageSquare } from 'lucide-react';
 import { Badge } from '@/components/ui/badge';
-import { NODE_WIDTH } from '@/features/graph/domain/deserialize';
-import { useGraphErrors } from '@/hooks/use-graph-errors';
+import { NODE_WIDTH } from '@/features/agent/domain/deserialize';
+import { useAgentErrors } from '@/hooks/use-agent-errors';
 import type { AgentNodeData } from '../configuration/node-types';
 import { externalAgentNodeTargetHandleId } from '../configuration/node-types';
 import { ErrorIndicator } from '../error-display/error-indicator';
@@ -13,7 +13,7 @@ import { NodeTab } from './node-tab';
 export function ExternalAgentNode(props: NodeProps & { data: AgentNodeData }) {
   const { data, selected, id } = props;
   const { name, description } = data;
-  const { getNodeErrors, hasNodeErrors } = useGraphErrors();
+  const { getNodeErrors, hasNodeErrors } = useAgentErrors();
 
   // Use the agent ID from node data if available, otherwise fall back to React Flow node ID
   const subAgentId = data.id || id;

package/src/components/{graph → agent}/nodes/function-tool-node.tsx

@@ -1,6 +1,6 @@
 import { type NodeProps, Position } from '@xyflow/react';
 import { Code } from 'lucide-react';
-import { useGraphErrors } from '@/hooks/use-graph-errors';
+import { useAgentErrors } from '@/hooks/use-agent-errors';
 import { type FunctionToolNodeData, functionToolNodeHandleId } from '../configuration/node-types';
 import { ErrorIndicator } from '../error-display/error-indicator';
 import { BaseNode, BaseNodeHeader, BaseNodeHeaderTitle } from './base-node';
@@ -13,7 +13,7 @@ export function FunctionToolNode(props: NodeProps & { data: FunctionToolNodeData
   const name = String(data.name || 'Function Tool');
   const description = String(data.description || '');
 
-  const { getNodeErrors, hasNodeErrors } = useGraphErrors();
+  const { getNodeErrors, hasNodeErrors } = useAgentErrors();
 
   const functionToolId = data.toolId || data.functionToolId || id;
   const nodeErrors = getNodeErrors(functionToolId);

package/src/components/{graph → agent}/nodes/mcp-node.tsx

@@ -2,7 +2,7 @@ import { type NodeProps, Position } from '@xyflow/react';
 import { getActiveTools } from '@/app/utils/active-tools';
 import { MCPToolImage } from '@/components/mcp-servers/mcp-tool-image';
 import { Badge } from '@/components/ui/badge';
-import { useGraphStore } from '@/features/graph/state/use-graph-store';
+import { useAgentStore } from '@/features/agent/state/use-agent-store';
 import { getCurrentSelectedToolsForNode } from '@/lib/utils/orphaned-tools-detector';
 import { type MCPNodeData, mcpNodeHandleId } from '../configuration/node-types';
 import { BaseNode, BaseNodeHeader, BaseNodeHeaderTitle } from './base-node';
@@ -12,7 +12,7 @@ const TOOLS_SHOWN_LIMIT = 4;
 
 export function MCPNode(props: NodeProps & { data: MCPNodeData }) {
   const { data, selected } = props;
-  const { toolLookup, agentToolConfigLookup, edges } = useGraphStore((state) => ({
+  const { toolLookup, agentToolConfigLookup, edges } = useAgentStore((state) => ({
     toolLookup: state.toolLookup,
     agentToolConfigLookup: state.agentToolConfigLookup,
     edges: state.edges,

package/src/components/{graph/nodes/agent-node.tsx → agent/nodes/sub-agent-node.tsx}

@@ -5,9 +5,9 @@ import { AnthropicIcon } from '@/components/icons/anthropic';
 import { GoogleIcon } from '@/components/icons/google';
 import { OpenAIIcon } from '@/components/icons/openai';
 import { Badge } from '@/components/ui/badge';
-import { NODE_WIDTH } from '@/features/graph/domain/deserialize';
-import { useGraphStore } from '@/features/graph/state/use-graph-store';
-import { useGraphErrors } from '@/hooks/use-graph-errors';
+import { NODE_WIDTH } from '@/features/agent/domain/deserialize';
+import { useAgentStore } from '@/features/agent/state/use-agent-store';
+import { useAgentErrors } from '@/hooks/use-agent-errors';
 import type { AgentNodeData } from '../configuration/node-types';
 import { agentNodeSourceHandleId, agentNodeTargetHandleId } from '../configuration/node-types';
 import { ErrorIndicator } from '../error-display/error-indicator';
@@ -41,16 +41,16 @@ const ListSection = ({
   );
 };
 
-export function AgentNode(props: NodeProps & { data: AgentNodeData }) {
+export function SubAgentNode(props: NodeProps & { data: AgentNodeData }) {
   const { data, selected, id } = props;
   const { name, isDefault, description, models } = data;
   const modelName = models?.base?.model;
 
-  const { dataComponentLookup, artifactComponentLookup } = useGraphStore((state) => ({
+  const { dataComponentLookup, artifactComponentLookup } = useAgentStore((state) => ({
     dataComponentLookup: state.dataComponentLookup,
     artifactComponentLookup: state.artifactComponentLookup,
   }));
-  const { getNodeErrors, hasNodeErrors } = useGraphErrors();
+  const { getNodeErrors, hasNodeErrors } = useAgentErrors();
 
   // Use the agent ID from node data if available, otherwise fall back to React Flow node ID
   const subAgentId = data.id || id;
@@ -82,10 +82,10 @@ export function AgentNode(props: NodeProps & { data: AgentNodeData }) {
         <BaseNodeHeader className="flex items-center justify-between gap-2">
           <div className="flex items-center gap-2 min-w-0">
             <Bot className="size-4 text-muted-foreground" />
-            <BaseNodeHeaderTitle>{name || 'Agent'}</BaseNodeHeaderTitle>
+            <BaseNodeHeaderTitle>{name || 'SubAgent'}</BaseNodeHeaderTitle>
           </div>
           <Badge variant="primary" className="text-xs uppercase">
-            Agent
+            SubAgent
           </Badge>
           {hasErrors && (
             <ErrorIndicator errors={nodeErrors} className="absolute -top-2 -right-2 w-6 h-6" />

package/src/components/{graph → agent}/playground/chat-widget.tsx

@@ -8,7 +8,7 @@ import { useRuntimeConfig } from '@/contexts/runtime-config-context';
 import { IkpMessage as IkpMessageComponent } from './ikp-message';
 
 interface ChatWidgetProps {
-  graphId?: string;
+  agentId?: string;
   projectId: string;
   tenantId: string;
   conversationId: string;
@@ -121,7 +121,7 @@ const styleOverrides = `
 `;
 
 export function ChatWidget({
-  graphId,
+  agentId,
   projectId,
   tenantId,
   conversationId,
@@ -143,15 +143,16 @@ export function ChatWidget({
       clearTimeout(stopPollingTimeoutRef.current);
       stopPollingTimeoutRef.current = null;
     }
-    
+
     // Set a new timeout for 5 minutes
     stopPollingTimeoutRef.current = setTimeout(() => {
       stopPolling();
       stopPollingTimeoutRef.current = null;
     }, POLLING_TIMEOUT_MS);
-  }, [stopPolling, POLLING_TIMEOUT_MS]);
+  }, [stopPolling]);
 
   // Reset timeout when new activities come in AFTER assistant message received
+  // biome-ignore lint/correctness/useExhaustiveDependencies: activities length is intentionally tracked to reset timeout on new activities
   useEffect(() => {
     // Only reset timeout if we've already received the assistant message and new activities were added
     if (hasReceivedAssistantMessageRef.current) {
@@ -246,11 +247,14 @@ export function ChatWidget({
               dark: '/assets/inkeep-icons/icon-sky.svg',
             },
             conversationId,
-            graphUrl: graphId ? `${INKEEP_AGENTS_RUN_API_URL}/api/chat` : undefined,
+            graphUrl: (() => {
+              console.log('INKEEP_AGENTS_RUN_API_URL:', INKEEP_AGENTS_RUN_API_URL);
+              return agentId ? `${INKEEP_AGENTS_RUN_API_URL}/api/chat` : undefined;
+            })(),
             headers: {
               'x-inkeep-tenant-id': tenantId,
               'x-inkeep-project-id': projectId,
-              'x-inkeep-graph-id': graphId,
+              'x-inkeep-agent-id': agentId,
               Authorization: `Bearer ${INKEEP_AGENTS_RUN_API_BYPASS_SECRET}`,
               ...customHeaders,
             },

package/src/components/{graph → agent}/playground/playground.tsx

@@ -9,7 +9,7 @@ import { ChatWidget } from './chat-widget';
 import CustomHeadersDialog from './custom-headers-dialog';
 
 interface PlaygroundProps {
-  graphId: string;
+  agentId: string;
   projectId: string;
   tenantId: string;
   setShowPlayground: (show: boolean) => void;
@@ -17,7 +17,7 @@ interface PlaygroundProps {
 }
 
 export const Playground = ({
-  graphId,
+  agentId,
   projectId,
   tenantId,
   closeSidePane,
@@ -78,7 +78,7 @@ export const Playground = ({
               setConversationId={setConversationId}
               startPolling={startPolling}
               stopPolling={stopPolling}
-              graphId={graphId}
+              agentId={agentId}
               projectId={projectId}
               tenantId={tenantId}
               customHeaders={customHeaders}

package/src/components/{graph → agent}/sidepane/edges/edge-editor.tsx

@@ -4,7 +4,7 @@ import { DashedSplineIcon } from '@/components/icons/dashed-spline';
 import { Badge } from '@/components/ui/badge';
 import { Checkbox } from '@/components/ui/checkbox';
 import { Label } from '@/components/ui/label';
-import { useGraphActions } from '@/features/graph/state/use-graph-store';
+import { useAgentActions } from '@/features/agent/state/use-agent-store';
 import type { A2AEdgeData } from '../../configuration/edge-types';
 
 type RelationshipOptionProps = {
@@ -79,7 +79,7 @@ function EdgeEditor({ selectedEdge }: EdgeEditorProps) {
   const { updateEdgeData, setEdges } = useReactFlow();
   const sourceNode = useNodesData(selectedEdge.source);
   const targetNode = useNodesData(selectedEdge.target);
-  const { markUnsaved } = useGraphActions();
+  const { markUnsaved } = useAgentActions();
 
   // Check if this is a self-loop (source and target are the same)
   const isSelfLoop = selectedEdge.source === selectedEdge.target;

package/src/components/{graph → agent}/sidepane/metadata/context-config.tsx

@@ -1,5 +1,5 @@
 import { ExpandableJsonEditor } from '@/components/form/expandable-json-editor';
-import type { ContextConfig, GraphMetadata } from '../../configuration/graph-types';
+import type { ContextConfig, AgentMetadata } from '../../configuration/agent-types';
 import { SectionHeader } from '../section';
 
 export function ContextConfigForm({
@@ -7,7 +7,7 @@ export function ContextConfigForm({
   updateMetadata,
 }: {
   contextConfig: ContextConfig;
-  updateMetadata: (field: keyof GraphMetadata, value: GraphMetadata[keyof GraphMetadata]) => void;
+  updateMetadata: (field: keyof AgentMetadata, value: AgentMetadata[keyof AgentMetadata]) => void;
 }) {
   const { contextVariables, headersSchema } = contextConfig;
 
@@ -23,7 +23,7 @@ export function ContextConfigForm({
     <div className="space-y-8">
       <SectionHeader
         title="Context configuration"
-        description="Configure dynamic context for this graph."
+        description="Configure dynamic context for this agent."
       />
       <div className="flex flex-col space-y-8">
         <ExpandableJsonEditor

package/src/components/{graph → agent}/sidepane/metadata/metadata-editor.tsx

@@ -19,7 +19,7 @@ import { Separator } from '@/components/ui/separator';
 import { Textarea } from '@/components/ui/textarea';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
 import { useRuntimeConfig } from '@/contexts/runtime-config-context';
-import { useGraphActions, useGraphStore } from '@/features/graph/state/use-graph-store';
+import { useAgentActions, useAgentStore } from '@/features/agent/state/use-agent-store';
 import { useAutoPrefillIdZustand } from '@/hooks/use-auto-prefill-id-zustand';
 import { useProjectData } from '@/hooks/use-project-data';
 import { CollapsibleSettings } from '../collapsible-settings';
@@ -33,7 +33,7 @@ const ExecutionLimitInheritanceInfo = () => {
   return (
     <ul className="space-y-1.5 list-disc list-outside pl-4">
       <li>
-        <span className="font-medium">transferCountIs</span>: Project → Graph only (controls
+        <span className="font-medium">transferCountIs</span>: Project → Agent only (controls
         transfers between agents)
       </li>
       <li>
@@ -45,8 +45,8 @@ const ExecutionLimitInheritanceInfo = () => {
         set anywhere
       </li>
       <li>
-        <span className="font-medium">Graph scope</span>: This limit applies to all agents within
-        this graph
+        <span className="font-medium">Agent scope</span>: This limit applies to all agents within
+        this agent
       </li>
     </ul>
   );
@@ -54,17 +54,17 @@ const ExecutionLimitInheritanceInfo = () => {
 
 function MetadataEditor() {
   const params = useParams();
-  const metadata = useGraphStore((state) => state.metadata);
-  const { graphId, tenantId, projectId } = params;
-  const { id, name, description, contextConfig, models, stopWhen, graphPrompt, statusUpdates } =
+  const metadata = useAgentStore((state) => state.metadata);
+  const { agentId, tenantId, projectId } = params;
+  const { id, name, description, contextConfig, models, stopWhen, agentPrompt, statusUpdates } =
     metadata;
   const { INKEEP_AGENTS_RUN_API_URL } = useRuntimeConfig();
-  const graphUrl = `${INKEEP_AGENTS_RUN_API_URL}/api/chat`;
+  const agentUrl = `${INKEEP_AGENTS_RUN_API_URL}/api/chat`;
 
   // Fetch project data for inheritance indicators
   const { project } = useProjectData();
 
-  const { markUnsaved, setMetadata } = useGraphActions();
+  const { markUnsaved, setMetadata } = useAgentActions();
 
   const updateMetadata: typeof setMetadata = useCallback(
     (...attrs) => {
@@ -81,17 +81,17 @@ function MetadataEditor() {
     [updateMetadata]
   );
 
-  // Auto-prefill ID based on name field (only for new graphs)
+  // Auto-prefill ID based on name field (only for new agent)
   useAutoPrefillIdZustand({
     nameValue: name,
     idValue: id,
     onIdChange: handleIdChange,
-    isEditing: !!graphId,
+    isEditing: !!agentId,
   });
 
   return (
     <div className="space-y-8">
-      {graphId && (
+      {agentId && (
         <div className="space-y-2">
           <div className="text-sm leading-none font-medium flex items-center gap-1">
             Chat URL
@@ -100,13 +100,13 @@ function MetadataEditor() {
                 <Info className="w-3 h-3 text-muted-foreground" />
               </TooltipTrigger>
               <TooltipContent>
-                Use this endpoint to chat with your graph or connect it to the Inkeep widget via the
-                graphUrl prop. Supports streaming responses with the Vercel AI SDK data stream
+                Use this endpoint to chat with your agent or connect it to the Inkeep widget via the
+                agentUrl prop. Supports streaming responses with the Vercel AI SDK data stream
                 protocol.
               </TooltipContent>
             </Tooltip>
           </div>
-          <CopyableSingleLineCode code={graphUrl} />
+          <CopyableSingleLineCode code={agentUrl} />
           <ExternalLink href={`/${tenantId}/projects/${projectId}/api-keys`}>
             Create API key
           </ExternalLink>
@@ -118,7 +118,7 @@ function MetadataEditor() {
         label="Name"
         value={name}
         onChange={(e) => updateMetadata('name', e.target.value)}
-        placeholder="My graph"
+        placeholder="My agent"
         isRequired
       />
       <InputField
@@ -127,11 +127,11 @@ function MetadataEditor() {
         label="Id"
         value={id || ''}
         onChange={(e) => updateMetadata('id', e.target.value)}
-        disabled={!!graphId} // only editable if no graphId is set (i.e. new graph)
-        placeholder="my-graph"
+        disabled={!!agentId} // only editable if no agentId is set (i.e. new agent)
+        placeholder="my-agent"
         description={
-          !graphId
-            ? 'Choose a unique identifier for this graph. Using an existing id will replace that graph.'
+          !agentId
+            ? 'Choose a unique identifier for this agent. Using an existing id will replace that agent.'
             : undefined
         }
         isRequired
@@ -142,26 +142,26 @@ function MetadataEditor() {
         label="Description"
         value={description}
         onChange={(e) => updateMetadata('description', e.target.value)}
-        placeholder="This graph is used to..."
+        placeholder="This agent is used to..."
         className="max-h-96"
       />
       <div className="space-y-2">
         <ExpandableTextArea
-          id="graph-prompt"
-          label="Graph prompt"
-          value={graphPrompt || ''}
-          onChange={(value) => updateMetadata('graphPrompt', value)}
-          placeholder="System-level instructions for this graph..."
+          id="agent-prompt"
+          label="Agent prompt"
+          value={agentPrompt || ''}
+          onChange={(value) => updateMetadata('agentPrompt', value)}
+          placeholder="System-level instructions for this agent..."
           className="max-h-96"
         />
         <p className="text-xs text-muted-foreground">
-          System-level prompt that defines the intended audience and overall goal of this graph.
+          System-level prompt that defines the intended audience and overall goal of this agent.
           Applied to all agents.
         </p>
       </div>
       <Separator />
 
-      {/* Graph Model Settings */}
+      {/* Agent Model Settings */}
       <div className="space-y-8">
         <SectionHeader
           title="Default models"
@@ -194,7 +194,7 @@ function MetadataEditor() {
                 Base model
                 <InheritanceIndicator
                   {...getModelInheritanceStatus(
-                    'graph',
+                    'agent',
                     models?.base?.model,
                     project?.models?.base?.model
                   )}
@@ -257,7 +257,7 @@ function MetadataEditor() {
                   Structured output model
                   <InheritanceIndicator
                     {...getModelInheritanceStatus(
-                      'graph',
+                      'agent',
                       models?.structuredOutput?.model,
                       project?.models?.structuredOutput?.model
                     )}
@@ -316,7 +316,7 @@ function MetadataEditor() {
                   Summarizer model
                   <InheritanceIndicator
                     {...getModelInheritanceStatus(
-                      'graph',
+                      'agent',
                       models?.summarizer?.model,
                       project?.models?.summarizer?.model
                     )}
@@ -355,11 +355,11 @@ function MetadataEditor() {
 
       <Separator />
 
-      {/* Graph Execution Limits */}
+      {/* Agent Execution Limits */}
       <div className="space-y-8">
         <SectionHeader
           title="Execution limits"
-          description="Configure graph-level execution limits for transfers between agents."
+          description="Configure agent-level execution limits for transfers between agents."
           titleTooltip={
             <div>
               <p>How execution limit inheritance works:</p>
@@ -373,7 +373,7 @@ function MetadataEditor() {
             <Label htmlFor="transfer-count">Max transfers</Label>
             <InheritanceIndicator
               {...getExecutionLimitInheritanceStatus(
-                'graph',
+                'agent',
                 'transferCountIs',
                 stopWhen?.transferCountIs,
                 project?.stopWhen?.transferCountIs

package/src/components/{graph → agent}/sidepane/nodes/external-agent-node-editor.tsx

@@ -1,8 +1,8 @@
 import type { Node } from '@xyflow/react';
 import { useCallback } from 'react';
 import { ExpandableJsonEditor } from '@/components/form/expandable-json-editor';
+import type { ErrorHelpers } from '@/hooks/use-agent-errors';
 import { useAutoPrefillIdZustand } from '@/hooks/use-auto-prefill-id-zustand';
-import type { ErrorHelpers } from '@/hooks/use-graph-errors';
 import { useNodeEditor } from '@/hooks/use-node-editor';
 import type { Credential } from '@/lib/api/credentials';
 import type { ExternalAgentNodeData } from '../../configuration/node-types';
@@ -43,8 +43,8 @@ export function ExternalAgentNodeEditor({
   return (
     <div className="space-y-8 flex flex-col">
       <p className="text-sm text-muted-foreground">
-        External agents are agents external to a graph that can communicate using the A2A
-        (Agent-to-Agent) protocol. External agents enable you to delegate tasks between graphs
+        External agents are agents that live outside of your project that can communicate using the
+        A2A (Agent-to-Agent) protocol. External agents enable you to delegate tasks between agent
         within the agent framework or to third-party services.
       </p>
 
@@ -92,7 +92,7 @@ export function ExternalAgentNodeEditor({
         onChange={handleInputChange}
         placeholder="https://api.example.com/agent"
         error={getFieldError('baseUrl')}
-        tooltip="This URL is used to discover the agent's capabilities and communicate with it using the A2A protocol. For locally hosted graphs defined with the agent-framework this would be: http://localhost:3002/tenants/:tenantId/projects/:projectId/agents/:graphId"
+        tooltip="This URL is used to discover the agent's capabilities and communicate with it using the A2A protocol. For locally hosted agent defined with the agent-framework this would be: http://localhost:3002/tenants/:tenantId/projects/:projectId/agents/:agentId"
       />
       <ExpandableJsonEditor
         name="headers"

package/src/components/{graph → agent}/sidepane/nodes/mcp-node-editor.tsx

@@ -10,14 +10,14 @@ import { ExternalLink } from '@/components/ui/external-link';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
-import { useGraphActions, useGraphStore } from '@/features/graph/state/use-graph-store';
+import { useAgentActions, useAgentStore } from '@/features/agent/state/use-agent-store';
 import { getToolTypeAndName } from '@/lib/utils/mcp-utils';
 import {
   getCurrentHeadersForNode,
   getCurrentSelectedToolsForNode,
 } from '@/lib/utils/orphaned-tools-detector';
 import type { MCPNodeData } from '../../configuration/node-types';
-import type { AgentToolConfigLookup } from '../../graph';
+import type { AgentToolConfigLookup } from '../../agent';
 
 interface MCPServerNodeEditorProps {
   selectedNode: Node<MCPNodeData>;
@@ -33,10 +33,10 @@ export function MCPServerNodeEditor({
     tenantId: string;
     projectId: string;
   }>();
-  const { markUnsaved } = useGraphActions();
+  const { markUnsaved } = useAgentActions();
 
   // Only use toolLookup - single source of truth
-  const { toolLookup, edges } = useGraphStore((state) => ({
+  const { toolLookup, edges } = useAgentStore((state) => ({
     toolLookup: state.toolLookup,
     edges: state.edges,
   }));