ref(agents-insights): update trace colors (#94155)

Author: obostjancic

static/app/views/insights/agentMonitoring/components/aiSpanList.tsx

@@ -3,7 +3,7 @@ import {useTheme} from '@emotion/react';
 import styled from '@emotion/styled';
 
 import Placeholder from 'sentry/components/placeholder';
-import {IconCode, IconSort} from 'sentry/icons';
+import {IconChevron, IconCode} from 'sentry/icons';
 import {IconBot} from 'sentry/icons/iconBot';
 import {IconSpeechBubble} from 'sentry/icons/iconSpeechBubble';
 import {IconTool} from 'sentry/icons/iconTool';
@@ -14,6 +14,7 @@ import {
   AI_AGENT_NAME_ATTRIBUTE,
   AI_GENERATION_DESCRIPTIONS,
   AI_GENERATION_OPS,
+  AI_HANDOFF_OPS,
   AI_MODEL_ID_ATTRIBUTE,
   AI_RUN_DESCRIPTIONS,
   AI_RUN_OPS,
@@ -253,7 +254,7 @@ function getNodeInfo(
     icon: <IconCode size="md" />,
     title: 'Unknown',
     subtitle: '',
-    color: colors[0],
+    color: colors[1],
   };
 
   if (isTransactionNode(node)) {
@@ -288,7 +289,7 @@ function getNodeInfo(
     nodeInfo.icon = <IconBot size="md" />;
     nodeInfo.title = op;
     nodeInfo.subtitle = `${agentName}${model ? ` (${model})` : ''}`;
-    nodeInfo.color = colors[1];
+    nodeInfo.color = colors[0];
   } else if (
     AI_GENERATION_OPS.includes(op) ||
     AI_GENERATION_DESCRIPTIONS.includes(node.value.description ?? '')
@@ -305,10 +306,11 @@ function getNodeInfo(
     nodeInfo.icon = <IconTool size="md" />;
     nodeInfo.title = op || 'gen_ai.toolCall';
     nodeInfo.subtitle = getNodeAttribute(AI_TOOL_NAME_ATTRIBUTE) || '';
-    nodeInfo.color = colors[3];
-  } else if (op === 'http.client') {
-    nodeInfo.icon = <IconSort size="md" />;
-    nodeInfo.title = node.value.description || 'HTTP';
+    nodeInfo.color = colors[5];
+  } else if (AI_HANDOFF_OPS.includes(op)) {
+    nodeInfo.icon = <IconChevron size="md" isDouble direction="right" />;
+    nodeInfo.title = op;
+    nodeInfo.subtitle = node.value.description || '';
     nodeInfo.color = colors[4];
   } else {
     nodeInfo.title = op || 'Span';

static/app/views/insights/agentMonitoring/utils/query.tsx

@@ -49,6 +49,8 @@ export const AI_TOOL_NAME_ATTRIBUTE = 'gen_ai.tool.name' as EAPSpanProperty;
 export const AI_AGENT_NAME_ATTRIBUTE = 'gen_ai.agent.name' as EAPSpanProperty;
 export const AI_TOTAL_TOKENS_ATTRIBUTE = 'gen_ai.usage.total_tokens' as EAPSpanProperty;
 
+export const AI_HANDOFF_OPS = ['gen_ai.handoff'];
+
 export const AI_TOKEN_USAGE_ATTRIBUTE_SUM =
   `sum(tags[gen_ai.usage.total_tokens,number])` as EAPSpanProperty;
 export const AI_INPUT_TOKENS_ATTRIBUTE_SUM =