@inkeep/agents-manage-ui 0.22.2 → 0.22.4

package/src/components/agent/agent.tsx

@@ -98,6 +98,8 @@ function Flow({
     projectId: string;
   }>();
 
+  const { nodeId, edgeId, setQueryState, openAgentPane, isOpen } = useSidePane();
+
   const initialNodes = useMemo<Node[]>(
     () => [
       {
@@ -144,11 +146,21 @@ function Flow({
       : { nodes: initialNodes, edges: initialEdges };
     return {
       ...result,
-      nodes: enrichNodes(result.nodes),
+      nodes: nodeId
+        ? enrichNodes(result.nodes).map((node) => ({
+            ...node,
+            selected: node.id === nodeId,
+          }))
+        : enrichNodes(result.nodes),
+      edges: edgeId
+        ? result.edges.map((edge) => ({
+            ...edge,
+            selected: edge.id === edgeId,
+          }))
+        : result.edges,
     };
-  }, [agent, enrichNodes, initialNodes]);
+  }, [agent, enrichNodes, initialNodes, nodeId, edgeId]);
 
-  // Create agent tool configuration lookup from agent data
   const agentToolConfigLookup = useMemo((): AgentToolConfigLookup => {
     if (!agent?.subAgents) return {} as AgentToolConfigLookup;
 
@@ -204,11 +216,11 @@ function Flow({
     markSaved,
     clearSelection,
     markUnsaved,
+    reset,
   } = useAgentActions();
 
   // Always use enriched nodes for ReactFlow
   const nodes = useMemo(() => enrichNodes(storeNodes), [storeNodes, enrichNodes]);
-  const { nodeId, edgeId, setQueryState, openAgentPane, isOpen } = useSidePane();
   const { errors, showErrors, setErrors, clearErrors, setShowErrors } = useAgentErrors();
 
   /**
@@ -227,7 +239,6 @@ function Flow({
       // as `requestAnimationFrame` may run too early, causing `hasIntersections` to incorrectly return false.
       setTimeout(() => {
         const currentNodes = getNodes();
-        // Check if any of the replaced nodes are intersecting with others
         for (const change of replaceChanges) {
           const node = currentNodes.find((n) => n.id === change.id);
           if (!node) {
@@ -257,37 +268,15 @@ function Flow({
       toolLookup,
       agentToolConfigLookup
     );
+
+    return () => {
+      // we need to reset the agent store when the component unmounts otherwise the agent store will persist the changes from the previous agent
+      reset();
+    };
   }, []);
 
   // biome-ignore lint/correctness/useExhaustiveDependencies: we only want to run this effect on first render
   useEffect(() => {
-    if (!agent) {
-      openAgentPane();
-      return;
-    }
-
-    if (!nodeId && !edgeId) {
-      openAgentPane();
-    }
-
-    if (nodeId) {
-      setNodes((nodes) =>
-        nodes.map((node) => ({
-          ...node,
-          selected: node.id === nodeId,
-        }))
-      );
-    }
-
-    if (edgeId) {
-      setEdges((edges) =>
-        edges.map((edge) => ({
-          ...edge,
-          selected: edge.id === edgeId,
-        }))
-      );
-    }
-
     // If the nodeId or edgeId in URL doesn't exist in the agent, clear it
     if (nodeId && !agentNodes.some((node) => node.id === nodeId)) {
       setQueryState((prev) => ({
@@ -459,7 +448,6 @@ function Flow({
           ? edges[0]
           : null;
       const defaultPane = isOpen ? 'agent' : null;
-
       setQueryState(
         {
           pane: node ? 'node' : edge ? 'edge' : defaultPane,
@@ -517,7 +505,6 @@ function Flow({
           }))
         );
         setEdges((edges) => edges.map((edge) => ({ ...edge, selected: false })));
-
         // Open the sidepane for the selected node
         setQueryState({
           pane: 'node',
@@ -580,7 +567,6 @@ function Flow({
       agentToolConfigLookup
     );
 
-    // Build a map from toolId to React Flow node ID for function tools
     const functionToolNodeMap = new Map<string, string>();
     nodes.forEach((node) => {
       if (node.type === NodeType.FunctionTool) {
@@ -590,10 +576,8 @@ function Flow({
       }
     });
 
-    // Validate the serialized data before saving
     const validationErrors = validateSerializedData(serializedData, functionToolNodeMap);
     if (validationErrors.length > 0) {
-      // Convert validation errors to the format expected by parseAgentValidationErrors
       const errorObjects = validationErrors.map((error) => ({
         message: error.message,
         field: error.field,
@@ -625,10 +609,8 @@ function Flow({
 
       // Update MCP nodes with new relationshipIds from backend response
       if (res.data) {
-        // Create a map to track which relationships were processed
         const processedRelationships = new Set<string>();
 
-        // Update nodes with the new relationshipIds
         setNodes((currentNodes) =>
           currentNodes.map((node) => {
             if (node.type === NodeType.MCP) {

package/src/components/agent/configuration/model-options.tsx

@@ -4,14 +4,13 @@ import {
   OPENAI_MODELS,
 } from '@inkeep/agents-core/constants/models';
 
-export const DEFAULT_ANTHROPIC_BASE_MODEL = ANTHROPIC_MODELS.CLAUDE_SONNET_4_5_20250929;
-export const DEFAULT_ANTHROPIC_STRUCTURED_OUTPUT_MODEL =
-  ANTHROPIC_MODELS.CLAUDE_SONNET_4_5_20250929;
-export const DEFAULT_ANTHROPIC_SUMMARIZER_MODEL = ANTHROPIC_MODELS.CLAUDE_SONNET_4_5_20250929;
+export const DEFAULT_ANTHROPIC_BASE_MODEL = ANTHROPIC_MODELS.CLAUDE_SONNET_4_5;
+export const DEFAULT_ANTHROPIC_STRUCTURED_OUTPUT_MODEL = ANTHROPIC_MODELS.CLAUDE_SONNET_4_5;
+export const DEFAULT_ANTHROPIC_SUMMARIZER_MODEL = ANTHROPIC_MODELS.CLAUDE_SONNET_4_5;
 
-export const DEFAULT_OPENAI_BASE_MODEL = OPENAI_MODELS.GPT_4_1_20250414;
-export const DEFAULT_OPENAI_STRUCTURED_OUTPUT_MODEL = OPENAI_MODELS.GPT_4_1_MINI_20250414;
-export const DEFAULT_OPENAI_SUMMARIZER_MODEL = OPENAI_MODELS.GPT_4_1_NANO_20250414;
+export const DEFAULT_OPENAI_BASE_MODEL = OPENAI_MODELS.GPT_4_1;
+export const DEFAULT_OPENAI_STRUCTURED_OUTPUT_MODEL = OPENAI_MODELS.GPT_4_1;
+export const DEFAULT_OPENAI_SUMMARIZER_MODEL = OPENAI_MODELS.GPT_4_1_NANO;
 
 export const DEFAULT_GOOGLE_BASE_MODEL = GOOGLE_MODELS.GEMINI_2_5_FLASH;
 export const DEFAULT_GOOGLE_STRUCTURED_OUTPUT_MODEL = GOOGLE_MODELS.GEMINI_2_5_FLASH_LITE;
@@ -31,9 +30,13 @@ export const modelOptions = {
       value: ANTHROPIC_MODELS.CLAUDE_SONNET_4,
       label: 'Claude Sonnet 4',
     },
+    {
+      value: ANTHROPIC_MODELS.CLAUDE_HAIKU_4_5,
+      label: 'Claude Haiku 4.5',
+    },
     {
       value: ANTHROPIC_MODELS.CLAUDE_3_5_HAIKU,
-      label: 'Claude 3.5 Haiku',
+      label: 'Claude Haiku 3.5',
     },
   ],
   openai: [

package/src/components/agent/edges/self-loop-edge.tsx

@@ -44,7 +44,6 @@ export function SelfLoopEdge({ source, data, selected }: SelfLoopEdgeProps) {
   const endX = centerX + nodeWidth / 2;
   const endY = centerY + 10;
 
-  // Create a smooth self-loop path
   const transferPath = `
 		M ${startX} ${startY}
 		C ${startX + loopRadius * 2} ${startY - loopRadius},

package/src/components/agent/nodes/function-tool-node.tsx

@@ -9,7 +9,6 @@ import { Handle } from './handle';
 export function FunctionToolNode(props: NodeProps & { data: FunctionToolNodeData }) {
   const { data, selected, id } = props;
 
-  // Get data directly from node (like agents do)
   const name = String(data.name || 'Function Tool');
   const description = String(data.description || '');
 

package/src/components/agent/nodes/mcp-node.tsx

@@ -49,7 +49,6 @@ export function MCPNode(props: NodeProps & { data: MCPNodeData }) {
     const selectedCount = selectedTools.length;
     const totalCount = activeTools?.length ?? 0;
 
-    // If no tools selected, show 0
     if (selectedCount === 0) {
       return ['0'];
     }

package/src/components/agent/playground/chat-widget.tsx

@@ -272,7 +272,6 @@ export function ChatWidget({
 const _IkpMessage: ComponentsConfig<Record<string, unknown>>['IkpMessage'] = (props) => {
   const { message, renderMarkdown, renderComponent } = props;
 
-  // Check if we're still streaming - the last event should be a completion data-operation
   const lastPart = message.parts[message.parts.length - 1];
   const isStreaming = !(
     lastPart?.type === 'data-operation' && lastPart?.data?.type === 'completion'

package/src/components/agent/playground/ikp-message.tsx

@@ -114,7 +114,6 @@ const InlineEvent: FC<{ operation: any; isLast: boolean }> = ({ operation, isLas
   );
 };
 
-// Helper function for data-operation labels
 const getOperationLabel = (operation: any) => {
   // Use LLM-generated label if available for data-operations
   if (operation.label) {
@@ -211,7 +210,6 @@ function StreamMarkdown({ parts }: { parts: any[] }) {
               components={{
                 // Intercept superscript elements to render citations
                 sup: ({ children, ...props }) => {
-                  // Check if this is a citation (format: ^artifact identifier^)
                   if (children && typeof children === 'string') {
                     // Find the citation part
                     const citation = parts.find(
@@ -337,7 +335,6 @@ export const IkpMessage: FC<IkpMessageProps> = ({
     );
   }
 
-  // Check if we're still streaming text content or if there are incomplete operations
   const hasActiveOperations =
     isStreaming || message.parts.some((part) => part.type === 'text' && part.state === 'streaming');
   const isLoading = isStreaming || hasActiveOperations;

package/src/components/agent/sidepane/edges/edge-editor.tsx

@@ -81,7 +81,6 @@ function EdgeEditor({ selectedEdge }: EdgeEditorProps) {
   const targetNode = useNodesData(selectedEdge.target);
   const { markUnsaved } = useAgentActions();
 
-  // Check if this is a self-loop (source and target are the same)
   const isSelfLoop = selectedEdge.source === selectedEdge.target;
 
   const handleCheckboxChange = (id: string, checked: boolean) => {
@@ -110,7 +109,6 @@ function EdgeEditor({ selectedEdge }: EdgeEditorProps) {
       };
     }
 
-    // Check if all relationships are now unchecked
     const hasAnyRelationship =
       newRelationships.transferSourceToTarget ||
       newRelationships.transferTargetToSource ||
@@ -124,7 +122,6 @@ function EdgeEditor({ selectedEdge }: EdgeEditorProps) {
       // Remove the edge if no relationships remain
       setEdges((edges) => edges.filter((edge) => edge.id !== selectedEdge.id));
     } else {
-      // Update the edge data with the new relationships
       updateEdgeData(selectedEdge.id, {
         relationships: newRelationships,
       });

package/src/components/agent/sidepane/editor-loading-skeleton.tsx

@@ -0,0 +1,40 @@
+import { Skeleton } from '@/components/ui/skeleton';
+
+export function EditorLoadingSkeleton() {
+  return (
+    <div className="space-y-8 flex flex-col">
+      <div className="space-y-8">
+        <div className="space-y-2">
+          <Skeleton className="h-3.5 w-16" />
+          <Skeleton className="h-9 w-full rounded-md" />
+        </div>
+        <div className="space-y-2">
+          <Skeleton className="h-3.5 w-16" />
+          <Skeleton className="h-9 w-full rounded-md" />
+        </div>
+        <div className="space-y-2">
+          <Skeleton className="h-3.5 w-20" />
+          <Skeleton className="h-20 w-full rounded-md" />
+        </div>
+        <div className="space-y-2">
+          <Skeleton className="h-3.5 w-20" />
+          <Skeleton className="h-9 w-full rounded-md" />
+        </div>
+      </div>
+
+      <div className="h-px bg-border" />
+
+      <div className="space-y-8">
+        <Skeleton className="h-6 w-32" />
+        <div className="space-y-2">
+          <Skeleton className="h-4 w-16" />
+          <Skeleton className="h-9 w-full rounded-md" />
+        </div>
+        <div className="space-y-2">
+          <Skeleton className="h-4 w-28" />
+          <Skeleton className="h-9 w-full rounded-md" />
+        </div>
+      </div>
+    </div>
+  );
+}

package/src/components/agent/sidepane/nodes/function-tool-node-editor.tsx

@@ -15,7 +15,6 @@ export function FunctionToolNodeEditor({ selectedNode }: FunctionToolNodeEditorP
     selectedNodeId: selectedNode.id,
   });
 
-  // Get data directly from node (like agents do)
   const nodeData = selectedNode.data;
 
   // Local state for form fields - initialize from node data

package/src/components/agent/sidepane/nodes/mcp-node-editor.tsx

@@ -98,7 +98,6 @@ export function MCPServerNodeEditor({
       newSelections = [...currentSelections, toolName];
     }
 
-    // Check if all tools are now selected - if so, use null to represent "all selected"
     const allToolNames = activeTools?.map((tool) => tool.name) || [];
     let finalSelection: string[] | null = newSelections;
 

package/src/components/agent/sidepane/nodes/sub-agent-node-editor.tsx

@@ -65,7 +65,6 @@ export function SubAgentNodeEditor({
   const selectedDataComponents = selectedNode.data?.dataComponents || [];
   const selectedArtifactComponents = selectedNode.data?.artifactComponents || [];
 
-  // Get project and agent data for inheritance indicators
   const { project } = useProjectData();
   const metadata = useAgentStore((state) => state.metadata);
 
@@ -74,7 +73,6 @@ export function SubAgentNodeEditor({
     errorHelpers,
   });
 
-  // Create a wrapper function that provides the current node data for nested updates
   const updateModelPath = useCallback(
     (path: string, value: any) => {
       updateNestedPath(path, value, selectedNode.data);

package/src/components/agent/sidepane/sidepane.tsx

@@ -18,6 +18,7 @@ import {
   nodeTypeMap,
 } from '../configuration/node-types';
 import EdgeEditor from './edges/edge-editor';
+import { EditorLoadingSkeleton } from './editor-loading-skeleton';
 import { Heading } from './heading';
 import MetadataEditor from './metadata/metadata-editor';
 import { ExternalAgentNodeEditor } from './nodes/external-agent-node-editor';
@@ -62,12 +63,12 @@ export function SidePane({
     let heading = '';
     let HeadingIcon: LucideIcon | undefined;
 
-    if (selectedNode) {
-      const nodeType = selectedNode?.type as keyof typeof nodeTypeMap;
+    if (selectedNodeId) {
+      const nodeType = (selectedNode?.type as keyof typeof nodeTypeMap) || NodeType.SubAgent;
       const nodeConfig = nodeTypeMap[nodeType];
       heading = nodeConfig?.name || 'Node';
       HeadingIcon = nodeConfig?.Icon;
-    } else if (selectedEdge) {
+    } else if (selectedEdgeId) {
       const edgeType = (selectedEdge?.type as keyof typeof edgeTypeMap) || 'default';
       const edgeConfig = edgeTypeMap[edgeType];
       heading = edgeConfig?.name || 'Connection';
@@ -78,9 +79,16 @@ export function SidePane({
     }
 
     return { heading, HeadingIcon };
-  }, [selectedNode, selectedEdge]);
+  }, [selectedNode, selectedEdge, selectedNodeId, selectedEdgeId]);
 
   const editorContent = useMemo(() => {
+    if (selectedNodeId && !selectedNode) {
+      return <EditorLoadingSkeleton />;
+    }
+    if (selectedEdgeId && !selectedEdge) {
+      return <EditorLoadingSkeleton />;
+    }
+
     if (selectedNode) {
       const nodeType = selectedNode?.type as keyof typeof nodeTypeMap;
       // Use the agent ID from node data if available, otherwise fall back to React Flow node ID
@@ -135,6 +143,8 @@ export function SidePane({
     }
     return <MetadataEditor />;
   }, [
+    selectedNodeId,
+    selectedEdgeId,
     selectedNode,
     selectedEdge,
     dataComponentLookup,

package/src/components/artifact-components/form/validation.ts

@@ -6,7 +6,6 @@ const jsonSchemaValidation = () =>
   z
     .union([z.string(), z.null(), z.undefined()])
     .transform((value, ctx) => {
-      // If no value provided, empty string, or null, return undefined
       if (!value || value === '' || value === null) {
         return undefined;
       }
@@ -14,7 +13,6 @@ const jsonSchemaValidation = () =>
       try {
         const parsed = JSON.parse(value);
 
-        // Validate it's a proper LLM-compatible JSON schema
         const validationResult = validateJsonSchemaForLlm(value);
         if (!validationResult.isValid) {
           const errorMessage = validationResult.errors[0]?.message || 'Invalid JSON schema';

package/src/components/credentials/views/edit-credential-form.tsx

@@ -65,7 +65,6 @@ export function EditCredentialForm({
 
   const handleUpdateCredential = async (formData: EditCredentialFormData) => {
     try {
-      // Update credential metadata in our database
       await updateCredential(tenantId, projectId, credential.id, {
         retrievalParams: {
           ...credential.retrievalParams,
@@ -73,7 +72,6 @@ export function EditCredentialForm({
         },
       });
 
-      // Update connection metadata in Nango if we have connection info
       if (
         credential.retrievalParams?.providerConfigKey &&
         credential.retrievalParams?.connectionId &&

package/src/components/credentials/views/generic-auth-form.tsx

@@ -67,7 +67,6 @@ export function GenericAuthForm({
   // Move hooks before any early returns
   const allFields = formConfig?.sections.flatMap((section) => section.fields) || [];
 
-  // Create a minimal schema if no config is available
   const FormSchema = formConfig
     ? createFormSchema(formConfig)
     : z.object({ _placeholder: z.string().optional() });

package/src/components/data-components/form/validation.ts

@@ -13,7 +13,6 @@ export const dataComponentSchema = z.object({
       try {
         const parsed = JSON.parse(str);
 
-        // Validate it's a proper LLM-compatible JSON schema
         const validationResult = validateJsonSchemaForLlm(str);
         if (!validationResult.isValid) {
           const errorMessage = validationResult.errors[0]?.message || 'Invalid JSON schema';

package/src/components/form/prompt-editor.tsx

@@ -76,7 +76,6 @@ function isJMESPathExpressions(key: string): boolean {
   return key.includes('[?') || key.includes('[*]');
 }
 
-// Create linter for template variable validation
 function createTemplateVariableLinter(suggestions: string[]) {
   return linter((view) => {
     const diagnostics: Diagnostic[] = [];
@@ -92,7 +91,6 @@ function createTemplateVariableLinter(suggestions: string[]) {
         const to = line.from + match.index + match[0].length;
         const variableName = match[1];
 
-        // Check if variable is valid (in suggestions) or reserved
         const isValid =
           validVariables.has(variableName) ||
           RESERVED_KEYS.has(variableName) ||
@@ -116,14 +114,12 @@ function createTemplateVariableLinter(suggestions: string[]) {
   });
 }
 
-// Create autocomplete source for context variables
 function createContextAutocompleteSource(suggestions: string[]): CompletionSource {
   return (context) => {
     const { state, pos } = context;
     const line = state.doc.lineAt(pos);
     const to = pos - line.from;
     const textBefore = line.text.slice(0, to);
-    // Check if we're after a { character
     const match = textBefore.match(/\{([^}]*)$/);
     if (!match) return null;
 

package/src/components/mcp-servers/mcp-tool-image.tsx

@@ -24,7 +24,6 @@ export function MCPToolImage({
   const [imageError, setImageError] = useState(false);
   const [imageLoading, setImageLoading] = useState(true);
 
-  // If no imageUrl or image failed to load, show fallback
   if (!imageUrl || imageError) {
     if (provider) {
       return <ProviderIcon provider={provider} size={size} className={className} />;

package/src/components/projects/form/project-form.tsx

@@ -26,7 +26,6 @@ interface ProjectFormProps {
 
 const serializeData = (data: ProjectFormData) => {
   const cleanProviderOptions = (options: any) => {
-    // Convert null, empty object, or falsy values to undefined
     if (!options || (typeof options === 'object' && Object.keys(options).length === 0)) {
       return undefined;
     }
@@ -48,7 +47,6 @@ const serializeData = (data: ProjectFormData) => {
       cleaned.stepCountIs = stopWhen.stepCountIs;
     }
 
-    // If no valid properties, return empty object (undefined will not update the field)
     if (Object.keys(cleaned).length === 0) {
       return {};
     }
@@ -186,8 +184,6 @@ export function ProjectForm({
 
         <ProjectStopWhenSection control={form.control} />
 
-        <Separator />
-
         <div className={`flex gap-3 ${onCancel ? 'justify-end' : 'justify-start'}`}>
           {onCancel && (
             <Button type="button" variant="outline" onClick={onCancel} disabled={isSubmitting}>

package/src/components/projects/form/project-models-section.tsx

@@ -75,7 +75,6 @@ function StructuredOutputModelSection({ control }: { control: Control<ProjectFor
     name: 'models.structuredOutput.providerOptions',
   });
 
-  // Get the base model to show as inherited value
   const baseModel = useWatch({ control, name: 'models.base.model' });
 
   return (
@@ -130,7 +129,6 @@ function SummarizerModelSection({ control }: { control: Control<ProjectFormData>
     name: 'models.summarizer.providerOptions',
   });
 
-  // Get the base model to show as inherited value
   const baseModel = useWatch({ control, name: 'models.base.model' });
 
   return (

package/src/components/projects/form/project-stopwhen-section.tsx

@@ -16,7 +16,6 @@ interface ProjectStopWhenSectionProps {
 }
 
 export function ProjectStopWhenSection({ control }: ProjectStopWhenSectionProps) {
-  // Check if any stopWhen values are configured to determine default open state
   const stopWhen = useWatch({ control, name: 'stopWhen' });
   const hasConfiguredStopWhen = !!(stopWhen?.transferCountIs || stopWhen?.stepCountIs);
   const [isOpen, setIsOpen] = useState(hasConfiguredStopWhen);

package/src/components/traces/conversation-stats/conversation-list-item.tsx

@@ -40,7 +40,6 @@ export function ConversationListItem({ conversation, projectId }: ConversationLi
                 (() => {
                   try {
                     const date = new Date(startTime);
-                    // Check if the date is valid
                     if (Number.isNaN(date.getTime())) return null;
 
                     const isoString = date.toISOString();

package/src/components/traces/editors/json-editor-with-copy.tsx

@@ -85,7 +85,6 @@ export const JsonEditorWithCopy: FC<{ value: string; uri: `${string}.json`; titl
       if (model.isDisposed()) {
         return;
       }
-      // Update height based on content
       const contentHeight = editorInstance.getContentHeight();
       if (container) {
         container.style.height = `${contentHeight}px`;
@@ -134,9 +133,7 @@ export const JsonEditorWithCopy: FC<{ value: string; uri: `${string}.json`; titl
 
   const handleDownloadCode = useCallback(() => {
     const code = editorRef.current?.getValue() || '';
-    // Create a blob with the JSON content
     const blob = new Blob([code], { type: 'application/json' });
-    // Create a download link
     const url = URL.createObjectURL(blob);
     const link = document.createElement('a');
     link.href = url;

package/src/components/traces/timeline/span-attributes.tsx

@@ -77,7 +77,6 @@ function sortAttributes(attributes: AttributeMap): AttributeMap {
     }
   });
 
-  // Get remaining attributes sorted alphabetically
   const remainingKeys = Object.keys(attributes)
     .filter((key) => !PINNED_ATTRIBUTE_KEYS.includes(key as any))
     .sort();

package/src/components/traces/timeline/timeline-wrapper.tsx

@@ -270,7 +270,6 @@ export function TimelineWrapper({
         });
         return updated;
       });
-      // Update global state
       const allProcessed = idsToProcess.every((id) => processedIdsRef.current.has(id));
       if (enableAutoScroll) {
         setAiMessagesGloballyCollapsed(allProcessed && aiMessageIds.length > 0);
@@ -303,7 +302,6 @@ export function TimelineWrapper({
     }
     setCollapsedAiMessages(newCollapsed);
 
-    // Update global state based on current state
     const aiMessageIds = sortedActivities
       .filter(
         (activity) =>

package/src/components/traces/traces-overview.tsx

@@ -110,7 +110,6 @@ export function TracesOverview({ refreshKey }: TracesOverviewProps) {
     return () => clearTimeout(timer);
   }, [searchQuery]);
 
-  // Build span filters
   const spanFilters = useMemo<SpanFilterOptions | undefined>(() => {
     if (!spanName && attributes.length === 0) {
       return undefined;
@@ -122,7 +121,6 @@ export function TracesOverview({ refreshKey }: TracesOverviewProps) {
     return filters;
   }, [spanName, attributes]);
 
-  // Get aggregate stats efficiently (server-side aggregation)
   const {
     aggregateStats,
     loading: aggregateLoading,
@@ -136,7 +134,6 @@ export function TracesOverview({ refreshKey }: TracesOverviewProps) {
     agentId: selectedAgent,
   });
 
-  // Get paginated conversations for the list display
   const { stats, loading, error, refresh, pagination } = useConversationStats({
     startTime,
     endTime,

package/src/components/ui/card-grid.tsx

@@ -64,5 +64,4 @@ export interface CardItem {
   [key: string]: any;
 }
 
-// Helper function for items that have an id property
 export const getItemId = <T extends CardItem>(item: T): string | number => item.id;

package/src/components/ui/chart.tsx

@@ -286,7 +286,6 @@ function ChartLegendContent({
   );
 }
 
-// Helper to extract item config from a payload.
 function getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {
   if (typeof payload !== 'object' || payload === null) {
     return undefined;

package/src/components/ui/inheritance-indicator.tsx

@@ -102,7 +102,6 @@ export function InheritanceIndicator({
   );
 }
 
-// Helper function to determine inheritance status for models
 export function getModelInheritanceStatus(
   currentLevel: 'project' | 'agent' | 'subagent',
   currentValue: any,
@@ -195,7 +194,6 @@ export function getModelInheritanceStatus(
   };
 }
 
-// Helper function for execution limits inheritance
 export function getExecutionLimitInheritanceStatus(
   currentLevel: 'project' | 'agent' | 'agent',
   limitType: 'transferCountIs' | 'stepCountIs',
@@ -209,7 +207,6 @@ export function getExecutionLimitInheritanceStatus(
   const hasCurrentValue = currentValue !== undefined && currentValue !== null;
   const hasParentValue = parentValue !== undefined && parentValue !== null;
 
-  // Check if current value matches parent value (indicating inheritance after builder resolution)
   if (hasCurrentValue && hasParentValue && currentValue === parentValue) {
     // Inheritance rules for execution limits
     if (limitType === 'transferCountIs' && currentLevel === 'agent') {

package/src/components/ui/item-card-grid.tsx

@@ -113,5 +113,4 @@ export interface CardItem {
   [key: string]: any;
 }
 
-// Helper function for items that have an id property
 export const getItemId = <T extends CardItem>(item: T): string | number => item.id;