@mastra/playground-ui 65.0.0-alpha.1 → 65.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/dist/components/ChatShell.cjs.js +2 -2
  2. package/dist/components/ChatShell.cjs.js.map +1 -1
  3. package/dist/components/ChatShell.es.js +2 -2
  4. package/dist/components/ChatShell.es.js.map +1 -1
  5. package/dist/components/Composer.cjs.js +1 -1
  6. package/dist/components/Composer.cjs.js.map +1 -1
  7. package/dist/components/Composer.es.js +1 -1
  8. package/dist/components/Composer.es.js.map +1 -1
  9. package/dist/components/DataList.cjs.js +17 -15
  10. package/dist/components/DataList.cjs.js.map +1 -1
  11. package/dist/components/DataList.es.js +5 -4
  12. package/dist/components/DataList.es.js.map +1 -1
  13. package/dist/components/EnvironmentVariablesEditor.cjs.js +1 -1
  14. package/dist/components/EnvironmentVariablesEditor.es.js +1 -1
  15. package/dist/components/LogsDataList.cjs.js +2 -5
  16. package/dist/components/LogsDataList.cjs.js.map +1 -1
  17. package/dist/components/LogsDataList.es.js +2 -5
  18. package/dist/components/LogsDataList.es.js.map +1 -1
  19. package/dist/components/MessageScroller.cjs.js +1 -1
  20. package/dist/components/MessageScroller.es.js +1 -1
  21. package/dist/components/SavedViews.cjs.js +0 -1
  22. package/dist/components/SavedViews.cjs.js.map +1 -1
  23. package/dist/components/SavedViews.es.js +0 -1
  24. package/dist/components/SavedViews.es.js.map +1 -1
  25. package/dist/components/fluid-hover-highlight.cjs.js +7 -1
  26. package/dist/components/fluid-hover-highlight.cjs.js.map +1 -1
  27. package/dist/components/fluid-hover-highlight.es.js +7 -1
  28. package/dist/components/fluid-hover-highlight.es.js.map +1 -1
  29. package/dist/data-list-CmjTe8xE.cjs +142 -0
  30. package/dist/data-list-CmjTe8xE.cjs.map +1 -0
  31. package/dist/data-list-DT1LVR29.js +138 -0
  32. package/dist/data-list-DT1LVR29.js.map +1 -0
  33. package/dist/{data-list-skeleton-CGKlcoiI.js → data-list-skeleton-bNfITSHs.js} +2 -2
  34. package/dist/{data-list-skeleton-CGKlcoiI.js.map → data-list-skeleton-bNfITSHs.js.map} +1 -1
  35. package/dist/{data-list-skeleton-DGMTqeNP.cjs → data-list-skeleton-sdcaabdX.cjs} +6 -6
  36. package/dist/{data-list-skeleton-DGMTqeNP.cjs.map → data-list-skeleton-sdcaabdX.cjs.map} +1 -1
  37. package/dist/data-list-spacer-CdlT6bDd.cjs +218 -0
  38. package/dist/data-list-spacer-CdlT6bDd.cjs.map +1 -0
  39. package/dist/data-list-spacer-D--gDmOm.js +209 -0
  40. package/dist/data-list-spacer-D--gDmOm.js.map +1 -0
  41. package/dist/{data-list-ecHsw-zr.cjs → data-list-top-DJh08vFA.cjs} +14 -347
  42. package/dist/data-list-top-DJh08vFA.cjs.map +1 -0
  43. package/dist/{data-list-DdCZZctL.js → data-list-top-T-mtdIUp.js} +6 -340
  44. package/dist/data-list-top-T-mtdIUp.js.map +1 -0
  45. package/dist/domains/chat/tools/badges/workflow-badge.cjs.js +0 -4
  46. package/dist/domains/chat/tools/badges/workflow-badge.cjs.js.map +1 -1
  47. package/dist/domains/chat/tools/badges/workflow-badge.es.js +0 -4
  48. package/dist/domains/chat/tools/badges/workflow-badge.es.js.map +1 -1
  49. package/dist/domains/logs/components/logs-list-view.cjs.js +2 -3
  50. package/dist/domains/logs/components/logs-list-view.cjs.js.map +1 -1
  51. package/dist/domains/logs/components/logs-list-view.es.js +2 -3
  52. package/dist/domains/logs/components/logs-list-view.es.js.map +1 -1
  53. package/dist/domains/scores/components/trace-scores-tab.cjs.js +1 -2
  54. package/dist/domains/scores/components/trace-scores-tab.cjs.js.map +1 -1
  55. package/dist/domains/scores/components/trace-scores-tab.es.js +1 -2
  56. package/dist/domains/scores/components/trace-scores-tab.es.js.map +1 -1
  57. package/dist/domains/traces/components/format-hierarchical-spans.cjs.js +12 -13
  58. package/dist/domains/traces/components/format-hierarchical-spans.cjs.js.map +1 -1
  59. package/dist/domains/traces/components/format-hierarchical-spans.es.js +12 -13
  60. package/dist/domains/traces/components/format-hierarchical-spans.es.js.map +1 -1
  61. package/dist/domains/traces/components/span-rows.cjs.js +2 -1
  62. package/dist/domains/traces/components/span-rows.cjs.js.map +1 -1
  63. package/dist/domains/traces/components/span-rows.es.js +2 -1
  64. package/dist/domains/traces/components/span-rows.es.js.map +1 -1
  65. package/dist/domains/traces/components/thread-trace/thread-trace-list.cjs.js +1 -1
  66. package/dist/domains/traces/components/thread-trace/thread-trace-list.es.js +1 -1
  67. package/dist/domains/traces/components/thread-trace/thread-trace-root.cjs.js +1 -1
  68. package/dist/domains/traces/components/thread-trace/thread-trace-root.es.js +1 -1
  69. package/dist/domains/traces/components/thread-trace/thread-trace-row.cjs.js +1 -1
  70. package/dist/domains/traces/components/thread-trace/thread-trace-row.es.js +1 -1
  71. package/dist/domains/traces/components/thread-view-by-trace.cjs.js +0 -1
  72. package/dist/domains/traces/components/thread-view-by-trace.cjs.js.map +1 -1
  73. package/dist/domains/traces/components/thread-view-by-trace.es.js +0 -1
  74. package/dist/domains/traces/components/thread-view-by-trace.es.js.map +1 -1
  75. package/dist/domains/traces/components/trace-data-panel.cjs.js +0 -3
  76. package/dist/domains/traces/components/trace-data-panel.cjs.js.map +1 -1
  77. package/dist/domains/traces/components/trace-data-panel.es.js +0 -3
  78. package/dist/domains/traces/components/trace-data-panel.es.js.map +1 -1
  79. package/dist/domains/traces/components/trace-span-timeline.cjs.js +2 -1
  80. package/dist/domains/traces/components/trace-span-timeline.cjs.js.map +1 -1
  81. package/dist/domains/traces/components/trace-span-timeline.es.js +2 -1
  82. package/dist/domains/traces/components/trace-span-timeline.es.js.map +1 -1
  83. package/dist/domains/traces/components/traces-list-view.cjs.js +5 -4
  84. package/dist/domains/traces/components/traces-list-view.cjs.js.map +1 -1
  85. package/dist/domains/traces/components/traces-list-view.es.js +4 -3
  86. package/dist/domains/traces/components/traces-list-view.es.js.map +1 -1
  87. package/dist/domains/traces/components/traces-page-skeleton.cjs.js +1 -4
  88. package/dist/domains/traces/components/traces-page-skeleton.cjs.js.map +1 -1
  89. package/dist/domains/traces/components/traces-page-skeleton.es.js +1 -4
  90. package/dist/domains/traces/components/traces-page-skeleton.es.js.map +1 -1
  91. package/dist/domains/traces/utils/span-timing.cjs.js +10 -0
  92. package/dist/domains/traces/utils/span-timing.cjs.js.map +1 -1
  93. package/dist/domains/traces/utils/span-timing.es.js +10 -1
  94. package/dist/domains/traces/utils/span-timing.es.js.map +1 -1
  95. package/dist/domains/workflows/components/workflows-list/workflows-list.cjs.js +2 -2
  96. package/dist/domains/workflows/components/workflows-list/workflows-list.es.js +2 -2
  97. package/dist/domains/workflows/workflow/workflow-input-data.cjs.js +0 -1
  98. package/dist/domains/workflows/workflow/workflow-input-data.cjs.js.map +1 -1
  99. package/dist/domains/workflows/workflow/workflow-input-data.es.js +0 -1
  100. package/dist/domains/workflows/workflow/workflow-input-data.es.js.map +1 -1
  101. package/dist/ee/signals/components/entity-index-list.cjs.js +1 -3
  102. package/dist/ee/signals/components/entity-index-list.cjs.js.map +1 -1
  103. package/dist/ee/signals/components/entity-index-list.es.js +1 -3
  104. package/dist/ee/signals/components/entity-index-list.es.js.map +1 -1
  105. package/dist/ee/signals/components/trace-intelligence-entity-index.cjs.js +1 -3
  106. package/dist/ee/signals/components/trace-intelligence-entity-index.cjs.js.map +1 -1
  107. package/dist/ee/signals/components/trace-intelligence-entity-index.es.js +1 -3
  108. package/dist/ee/signals/components/trace-intelligence-entity-index.es.js.map +1 -1
  109. package/dist/ee/topics/components/topic-trace-summary-list.cjs.js +1 -1
  110. package/dist/ee/topics/components/topic-trace-summary-list.es.js +1 -1
  111. package/dist/hooks/use-fluid-hover.cjs.js +3 -2
  112. package/dist/hooks/use-fluid-hover.cjs.js.map +1 -1
  113. package/dist/hooks/use-fluid-hover.es.js +3 -2
  114. package/dist/hooks/use-fluid-hover.es.js.map +1 -1
  115. package/dist/layout/tabbed-container.cjs.js +1 -1
  116. package/dist/layout/tabbed-container.es.js +1 -1
  117. package/dist/{logs-data-list-DBJINzIL.js → logs-data-list-Cb85LPcT.js} +3 -2
  118. package/dist/{logs-data-list-DBJINzIL.js.map → logs-data-list-Cb85LPcT.js.map} +1 -1
  119. package/dist/{logs-data-list-IWZgMCKG.cjs → logs-data-list-DlQxxrNw.cjs} +22 -21
  120. package/dist/{logs-data-list-IWZgMCKG.cjs.map → logs-data-list-DlQxxrNw.cjs.map} +1 -1
  121. package/dist/{message-scroller-CS1KxKn6.js → message-scroller-C6gXU5d5.js} +2 -2
  122. package/dist/{message-scroller-CS1KxKn6.js.map → message-scroller-C6gXU5d5.js.map} +1 -1
  123. package/dist/{message-scroller-C4fH6uJg.cjs → message-scroller-fjucuCuw.cjs} +2 -2
  124. package/dist/{message-scroller-C4fH6uJg.cjs.map → message-scroller-fjucuCuw.cjs.map} +1 -1
  125. package/dist/scroll-area-CAY0DNQj.cjs.map +1 -1
  126. package/dist/scroll-area-MaMqo4l8.js.map +1 -1
  127. package/dist/src/domains/traces/utils/span-timing.d.ts +2 -0
  128. package/dist/src/ds/components/ChatShell/chat-shell.d.ts +3 -2
  129. package/dist/src/ds/components/ScrollArea/scroll-area.d.ts +4 -0
  130. package/dist/src/hooks/use-fluid-hover.d.ts +1 -0
  131. package/dist/style.css +10 -12
  132. package/dist/{traces-data-list-BH24OVKh.cjs → traces-data-list-Bhhg9drs.cjs} +20 -18
  133. package/dist/{traces-data-list-BH24OVKh.cjs.map → traces-data-list-Bhhg9drs.cjs.map} +1 -1
  134. package/dist/{traces-data-list-BOJB37dV.js → traces-data-list-DMWPJFBc.js} +4 -2
  135. package/dist/{traces-data-list-BOJB37dV.js.map → traces-data-list-DMWPJFBc.js.map} +1 -1
  136. package/package.json +9 -9
  137. package/dist/data-list-DdCZZctL.js.map +0 -1
  138. package/dist/data-list-ecHsw-zr.cjs.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"workflow-badge.es.js","sources":["../../../../../src/domains/chat/tools/badges/workflow-badge.tsx"],"sourcesContent":["import type { GetWorkflowResponse } from '@mastra/client-js';\nimport { useWorkflow } from '@mastra/react/hooks/workflows';\nimport { Eye } from 'lucide-react';\nimport { useContext, useEffect } from 'react';\nimport { BackgroundTaskMetadataDialogTrigger } from './background-task-metadata-dialog';\nimport type { MessageMetadata } from '@/domains/chat';\n\nimport { LoadingBadge } from '@/domains/chat/components/loading-badge';\nimport { NetworkChoiceMetadataDialogTrigger } from '@/domains/chat/components/network-choice-metadata-dialog';\nimport { SectionLabel } from '@/domains/chat/components/section-label';\nimport { awaitsToolApproval } from '@/domains/chat/tools/badges/awaits-tool-approval';\nimport type { ToolApprovalRequest } from '@/domains/chat/tools/badges/tool-approval-badge';\nimport { ToolApprovalBadge } from '@/domains/chat/tools/badges/tool-approval-badge';\nimport { useEntityRequestContext } from '@/domains/request-context/hooks/use-entity-request-context';\nimport {\n WorkflowGraph,\n WorkflowRunContext,\n WorkflowSelectedStepProvider,\n WorkflowStepDetailProvider,\n useWorkflowStepDetail,\n} from '@/domains/workflows';\nimport { WorkflowStepDetailContent } from '@/domains/workflows/components/workflow-step-detail';\nimport { PlaygroundWorkflowRunProvider } from '@/domains/workflows/context/playground-workflow-run-provider';\nimport type { WorkflowRunStreamResult } from '@/domains/workflows/context/workflow-run-context';\nimport { ToolCallMono } from '@/ds/components/ai/tool-call';\nimport { Button } from '@/ds/components/Button';\nimport { CodeEditor } from '@/ds/components/CodeEditor';\nimport { WorkflowIcon } from '@/ds/icons/WorkflowIcon';\nimport { useLinkComponent } from '@/lib/framework';\n\nexport interface WorkflowBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {\n workflowId: string;\n result?: any;\n isStreaming?: boolean;\n metadata?: MessageMetadata;\n suspendPayload?: any;\n toolCalled?: boolean;\n}\n\nexport const WorkflowBadge = ({\n result,\n workflowId,\n isStreaming,\n metadata,\n toolCallId,\n toolApprovalMetadata,\n suspendPayload,\n toolName,\n isNetwork,\n toolCalled,\n}: WorkflowBadgeProps) => {\n const { runId, status } = result || {};\n const { data: workflow, isLoading: isWorkflowLoading } = useWorkflow({\n workflowId,\n requestContext: useEntityRequestContext('workflow', workflowId)[0],\n queryOptions: { enabled: Boolean(workflowId) },\n });\n const routingDecision = metadata?.mode === 'network' ? metadata.routingDecision : undefined;\n const selectionReason =\n metadata?.mode === 'network' ? (routingDecision?.selectionReason ?? metadata.selectionReason) : undefined;\n const agentNetworkInput = metadata?.mode === 'network' ? (routingDecision ?? metadata.agentInput) : undefined;\n\n const bgEntry =\n (metadata?.mode === 'stream' || metadata?.mode === 'generate') && metadata?.backgroundTasks\n ? metadata.backgroundTasks[toolCallId]\n : undefined;\n\n let suspendPayloadSlot =\n typeof suspendPayload === 'string' ? (\n <ToolCallMono copyText={suspendPayload} className=\"text-muted-foreground\">\n {suspendPayload}\n </ToolCallMono>\n ) : (\n <CodeEditor data={suspendPayload} data-testid=\"tool-suspend-payload\" />\n );\n\n if (isWorkflowLoading || !workflow) return <LoadingBadge />;\n\n const toolCalledOrFinished = toolCalled ?? !!status;\n const showsRun = isStreaming || Boolean(runId);\n const hasBody =\n showsRun ||\n Boolean(suspendPayload) ||\n awaitsToolApproval({ toolApprovalMetadata, toolCalled: toolCalledOrFinished });\n\n return (\n <ToolApprovalBadge\n approval={{\n toolCalled: toolCalledOrFinished,\n toolCallId,\n toolApprovalMetadata,\n toolName,\n isNetwork,\n isGenerateMode: metadata?.mode === 'generate',\n }}\n data-testid=\"workflow-badge\"\n icon={<WorkflowIcon className=\"text-span-workflow\" />}\n title={workflow.name}\n initialCollapsed={false}\n extraInfo={\n metadata?.mode === 'network' ? (\n <NetworkChoiceMetadataDialogTrigger\n selectionReason={selectionReason ?? ''}\n input={agentNetworkInput as string | Record<string, unknown> | undefined}\n />\n ) : bgEntry?.taskId && bgEntry?.startedAt ? (\n <BackgroundTaskMetadataDialogTrigger backgroundTask={bgEntry} />\n ) : null\n }\n >\n {hasBody && (\n <>\n {!isStreaming && runId && (\n <PlaygroundWorkflowRunProvider workflowId={workflowId} initialRunId={runId} withoutTimeTravel>\n <WorkflowBadgeExtended workflowId={workflowId} workflow={workflow} runId={runId} />\n </PlaygroundWorkflowRunProvider>\n )}\n\n {isStreaming && <WorkflowBadgeExtended workflowId={workflowId} workflow={workflow} runId={runId} />}\n\n {suspendPayloadSlot !== undefined && suspendPayload && (\n <div>\n <SectionLabel>Workflow suspend payload</SectionLabel>\n {suspendPayloadSlot}\n </div>\n )}\n </>\n )}\n </ToolApprovalBadge>\n );\n};\n\ninterface WorkflowBadgeExtendedProps {\n workflowId: string;\n runId?: string;\n workflow: GetWorkflowResponse;\n}\n\nconst WorkflowBadgeExtended = ({ workflowId, workflow, runId }: WorkflowBadgeExtendedProps) => {\n const requestContext = useEntityRequestContext('workflow', workflowId)[0];\n const { Link } = useLinkComponent();\n const { isLoadingRunExecutionResult } = useContext(WorkflowRunContext);\n\n return (\n <>\n <div className=\"flex items-center gap-2 pb-2\">\n <Button icon={<WorkflowIcon />} render={<Link href={`/workflows/${workflowId}/graph`} />}>\n Go to workflow\n </Button>\n {runId && (\n <Button icon={<Eye />} render={<Link href={`/workflows/${workflowId}/graph/${runId}`} />}>\n See run\n </Button>\n )}\n </div>\n\n <WorkflowSelectedStepProvider>\n <WorkflowStepDetailProvider>\n <div className=\"h-[60vh] w-full overflow-hidden rounded-md\">\n <WorkflowGraph\n workflowId={workflowId}\n workflow={workflow}\n isLoading={isLoadingRunExecutionResult}\n requestContext={requestContext}\n />\n </div>\n <WorkflowBadgeStepDetail requestContext={requestContext} />\n </WorkflowStepDetailProvider>\n </WorkflowSelectedStepProvider>\n </>\n );\n};\n\nconst WorkflowBadgeStepDetail = ({ requestContext }: { requestContext: Record<string, any> }) => {\n const { stepDetail } = useWorkflowStepDetail();\n if (!stepDetail) return null;\n return (\n <div className=\"mt-2 flex max-h-[60vh] flex-col overflow-hidden rounded-md border border-border bg-background\">\n <WorkflowStepDetailContent requestContext={requestContext} />\n </div>\n );\n};\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport const useWorkflowStream = (workflowFullState?: WorkflowRunStreamResult) => {\n const { setResult } = useContext(WorkflowRunContext);\n\n useEffect(() => {\n if (!workflowFullState) return;\n setResult(workflowFullState);\n }, [workflowFullState, setResult]);\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"workflow-badge.es.js","sources":["../../../../../src/domains/chat/tools/badges/workflow-badge.tsx"],"sourcesContent":["import type { GetWorkflowResponse } from '@mastra/client-js';\nimport { useWorkflow } from '@mastra/react/hooks/workflows';\nimport { Eye } from 'lucide-react';\nimport { useContext, useEffect } from 'react';\nimport { BackgroundTaskMetadataDialogTrigger } from './background-task-metadata-dialog';\nimport type { MessageMetadata } from '@/domains/chat';\n\nimport { LoadingBadge } from '@/domains/chat/components/loading-badge';\nimport { NetworkChoiceMetadataDialogTrigger } from '@/domains/chat/components/network-choice-metadata-dialog';\nimport { SectionLabel } from '@/domains/chat/components/section-label';\nimport { awaitsToolApproval } from '@/domains/chat/tools/badges/awaits-tool-approval';\nimport type { ToolApprovalRequest } from '@/domains/chat/tools/badges/tool-approval-badge';\nimport { ToolApprovalBadge } from '@/domains/chat/tools/badges/tool-approval-badge';\nimport { useEntityRequestContext } from '@/domains/request-context/hooks/use-entity-request-context';\nimport {\n WorkflowGraph,\n WorkflowRunContext,\n WorkflowSelectedStepProvider,\n WorkflowStepDetailProvider,\n useWorkflowStepDetail,\n} from '@/domains/workflows';\nimport { WorkflowStepDetailContent } from '@/domains/workflows/components/workflow-step-detail';\nimport { PlaygroundWorkflowRunProvider } from '@/domains/workflows/context/playground-workflow-run-provider';\nimport type { WorkflowRunStreamResult } from '@/domains/workflows/context/workflow-run-context';\nimport { ToolCallMono } from '@/ds/components/ai/tool-call';\nimport { Button } from '@/ds/components/Button';\nimport { CodeEditor } from '@/ds/components/CodeEditor';\nimport { WorkflowIcon } from '@/ds/icons/WorkflowIcon';\nimport { useLinkComponent } from '@/lib/framework';\n\nexport interface WorkflowBadgeProps extends Omit<ToolApprovalRequest, 'toolCalled'> {\n workflowId: string;\n result?: any;\n isStreaming?: boolean;\n metadata?: MessageMetadata;\n suspendPayload?: any;\n toolCalled?: boolean;\n}\n\nexport const WorkflowBadge = ({\n result,\n workflowId,\n isStreaming,\n metadata,\n toolCallId,\n toolApprovalMetadata,\n suspendPayload,\n toolName,\n isNetwork,\n toolCalled,\n}: WorkflowBadgeProps) => {\n const { runId, status } = result || {};\n const { data: workflow, isLoading: isWorkflowLoading } = useWorkflow({\n workflowId,\n requestContext: useEntityRequestContext('workflow', workflowId)[0],\n queryOptions: { enabled: Boolean(workflowId) },\n });\n const routingDecision = metadata?.mode === 'network' ? metadata.routingDecision : undefined;\n const selectionReason =\n metadata?.mode === 'network' ? (routingDecision?.selectionReason ?? metadata.selectionReason) : undefined;\n const agentNetworkInput = metadata?.mode === 'network' ? (routingDecision ?? metadata.agentInput) : undefined;\n\n const bgEntry =\n (metadata?.mode === 'stream' || metadata?.mode === 'generate') && metadata?.backgroundTasks\n ? metadata.backgroundTasks[toolCallId]\n : undefined;\n\n let suspendPayloadSlot =\n typeof suspendPayload === 'string' ? (\n <ToolCallMono copyText={suspendPayload} className=\"text-muted-foreground\">\n {suspendPayload}\n </ToolCallMono>\n ) : (\n <CodeEditor data={suspendPayload} data-testid=\"tool-suspend-payload\" />\n );\n\n if (isWorkflowLoading || !workflow) return <LoadingBadge />;\n\n const toolCalledOrFinished = toolCalled ?? !!status;\n const showsRun = isStreaming || Boolean(runId);\n const hasBody =\n showsRun ||\n Boolean(suspendPayload) ||\n awaitsToolApproval({ toolApprovalMetadata, toolCalled: toolCalledOrFinished });\n\n return (\n <ToolApprovalBadge\n approval={{\n toolCalled: toolCalledOrFinished,\n toolCallId,\n toolApprovalMetadata,\n toolName,\n isNetwork,\n isGenerateMode: metadata?.mode === 'generate',\n }}\n data-testid=\"workflow-badge\"\n icon={<WorkflowIcon className=\"text-span-workflow\" />}\n title={workflow.name}\n initialCollapsed={false}\n extraInfo={\n metadata?.mode === 'network' ? (\n <NetworkChoiceMetadataDialogTrigger\n selectionReason={selectionReason ?? ''}\n input={agentNetworkInput as string | Record<string, unknown> | undefined}\n />\n ) : bgEntry?.taskId && bgEntry?.startedAt ? (\n <BackgroundTaskMetadataDialogTrigger backgroundTask={bgEntry} />\n ) : null\n }\n >\n {hasBody && (\n <>\n {!isStreaming && runId && (\n <PlaygroundWorkflowRunProvider workflowId={workflowId} initialRunId={runId} withoutTimeTravel>\n <WorkflowBadgeExtended workflowId={workflowId} workflow={workflow} runId={runId} />\n </PlaygroundWorkflowRunProvider>\n )}\n\n {isStreaming && <WorkflowBadgeExtended workflowId={workflowId} workflow={workflow} runId={runId} />}\n\n {suspendPayloadSlot !== undefined && suspendPayload && (\n <div>\n <SectionLabel>Workflow suspend payload</SectionLabel>\n {suspendPayloadSlot}\n </div>\n )}\n </>\n )}\n </ToolApprovalBadge>\n );\n};\n\ninterface WorkflowBadgeExtendedProps {\n workflowId: string;\n runId?: string;\n workflow: GetWorkflowResponse;\n}\n\nconst WorkflowBadgeExtended = ({ workflowId, workflow, runId }: WorkflowBadgeExtendedProps) => {\n const requestContext = useEntityRequestContext('workflow', workflowId)[0];\n const { Link } = useLinkComponent();\n const { isLoadingRunExecutionResult } = useContext(WorkflowRunContext);\n\n return (\n <>\n <div className=\"flex items-center gap-2 pb-2\">\n <Button icon={<WorkflowIcon />} render={<Link href={`/workflows/${workflowId}/graph`} />}>\n Go to workflow\n </Button>\n {runId && (\n <Button icon={<Eye />} render={<Link href={`/workflows/${workflowId}/graph/${runId}`} />}>\n See run\n </Button>\n )}\n </div>\n\n <WorkflowSelectedStepProvider>\n <WorkflowStepDetailProvider>\n <div className=\"h-[60vh] w-full overflow-hidden rounded-md\">\n <WorkflowGraph\n workflowId={workflowId}\n workflow={workflow}\n isLoading={isLoadingRunExecutionResult}\n requestContext={requestContext}\n />\n </div>\n <WorkflowBadgeStepDetail requestContext={requestContext} />\n </WorkflowStepDetailProvider>\n </WorkflowSelectedStepProvider>\n </>\n );\n};\n\nconst WorkflowBadgeStepDetail = ({ requestContext }: { requestContext: Record<string, any> }) => {\n const { stepDetail } = useWorkflowStepDetail();\n if (!stepDetail) return null;\n return (\n <div className=\"mt-2 flex max-h-[60vh] flex-col overflow-hidden rounded-md border border-border bg-background\">\n <WorkflowStepDetailContent requestContext={requestContext} />\n </div>\n );\n};\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport const useWorkflowStream = (workflowFullState?: WorkflowRunStreamResult) => {\n const { setResult } = useContext(WorkflowRunContext);\n\n useEffect(() => {\n if (!workflowFullState) return;\n setResult(workflowFullState);\n }, [workflowFullState, setResult]);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,MAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,oBAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,KAA0B;AACxB,EAAA,MAAM,EAAE,KAAA,EAAO,MAAA,EAAO,GAAI,UAAU,EAAC;AACrC,EAAA,MAAM,EAAE,IAAA,EAAM,QAAA,EAAU,SAAA,EAAW,iBAAA,KAAsB,WAAA,CAAY;AAAA,IACnE,UAAA;AAAA,IACA,cAAA,EAAgB,uBAAA,CAAwB,UAAA,EAAY,UAAU,EAAE,CAAC,CAAA;AAAA,IACjE,YAAA,EAAc,EAAE,OAAA,EAAS,OAAA,CAAQ,UAAU,CAAA;AAAE,GAC9C,CAAA;AACD,EAAA,MAAM,eAAA,GAAkB,QAAA,EAAU,IAAA,KAAS,SAAA,GAAY,SAAS,eAAA,GAAkB,MAAA;AAClF,EAAA,MAAM,kBACJ,QAAA,EAAU,IAAA,KAAS,YAAa,eAAA,EAAiB,eAAA,IAAmB,SAAS,eAAA,GAAmB,MAAA;AAClG,EAAA,MAAM,oBAAoB,QAAA,EAAU,IAAA,KAAS,SAAA,GAAa,eAAA,IAAmB,SAAS,UAAA,GAAc,MAAA;AAEpG,EAAA,MAAM,OAAA,GAAA,CACH,QAAA,EAAU,IAAA,KAAS,QAAA,IAAY,QAAA,EAAU,IAAA,KAAS,UAAA,KAAe,QAAA,EAAU,eAAA,GACxE,QAAA,CAAS,eAAA,CAAgB,UAAU,CAAA,GACnC,MAAA;AAEN,EAAA,IAAI,qBACF,OAAO,cAAA,KAAmB,QAAA,mBACxB,GAAA,CAAC,gBAAa,QAAA,EAAU,cAAA,EAAgB,SAAA,EAAU,uBAAA,EAC/C,0BACH,CAAA,mBAEA,GAAA,CAAC,cAAW,IAAA,EAAM,cAAA,EAAgB,eAAY,sBAAA,EAAuB,CAAA;AAGzE,EAAA,IAAI,iBAAA,IAAqB,CAAC,QAAA,EAAU,2BAAQ,YAAA,EAAA,EAAa,CAAA;AAEzD,EAAA,MAAM,oBAAA,GAAuB,UAAA,IAAc,CAAC,CAAC,MAAA;AAC7C,EAAA,MAAM,QAAA,GAAW,WAAA,IAAe,OAAA,CAAQ,KAAK,CAAA;AAC7C,EAAA,MAAM,OAAA,GACJ,QAAA,IACA,OAAA,CAAQ,cAAc,CAAA,IACtB,mBAAmB,EAAE,oBAAA,EAAsB,UAAA,EAAY,oBAAA,EAAsB,CAAA;AAE/E,EAAA,uBACE,GAAA;AAAA,IAAC,iBAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAU;AAAA,QACR,UAAA,EAAY,oBAAA;AAAA,QACZ,UAAA;AAAA,QACA,oBAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAA;AAAA,QACA,cAAA,EAAgB,UAAU,IAAA,KAAS;AAAA,OACrC;AAAA,MACA,aAAA,EAAY,gBAAA;AAAA,MACZ,IAAA,kBAAM,GAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAU,oBAAA,EAAqB,CAAA;AAAA,MACnD,OAAO,QAAA,CAAS,IAAA;AAAA,MAChB,gBAAA,EAAkB,KAAA;AAAA,MAClB,SAAA,EACE,QAAA,EAAU,IAAA,KAAS,SAAA,mBACjB,GAAA;AAAA,QAAC,kCAAA;AAAA,QAAA;AAAA,UACC,iBAAiB,eAAA,IAAmB,EAAA;AAAA,UACpC,KAAA,EAAO;AAAA;AAAA,OACT,GACE,SAAS,MAAA,IAAU,OAAA,EAAS,4BAC9B,GAAA,CAAC,mCAAA,EAAA,EAAoC,cAAA,EAAgB,OAAA,EAAS,CAAA,GAC5D,IAAA;AAAA,MAGL,qCACC,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,CAAC,WAAA,IAAe,KAAA,oBACf,GAAA,CAAC,6BAAA,EAAA,EAA8B,YAAwB,YAAA,EAAc,KAAA,EAAO,iBAAA,EAAiB,IAAA,EAC3F,QAAA,kBAAA,GAAA,CAAC,qBAAA,EAAA,EAAsB,UAAA,EAAwB,QAAA,EAAoB,OAAc,CAAA,EACnF,CAAA;AAAA,QAGD,WAAA,oBAAe,GAAA,CAAC,qBAAA,EAAA,EAAsB,UAAA,EAAwB,UAAoB,KAAA,EAAc,CAAA;AAAA,QAEhG,kBAAA,KAAuB,MAAA,IAAa,cAAA,oBACnC,IAAA,CAAC,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,gBAAa,QAAA,EAAA,0BAAA,EAAwB,CAAA;AAAA,UACrC;AAAA,SAAA,EACH;AAAA,OAAA,EAEJ;AAAA;AAAA,GAEJ;AAEJ;AAQA,MAAM,wBAAwB,CAAC,EAAE,UAAA,EAAY,QAAA,EAAU,OAAM,KAAkC;AAC7F,EAAA,MAAM,cAAA,GAAiB,uBAAA,CAAwB,UAAA,EAAY,UAAU,EAAE,CAAC,CAAA;AACxE,EAAA,MAAM,EAAE,IAAA,EAAK,GAAI,gBAAA,EAAiB;AAClC,EAAA,MAAM,EAAE,2BAAA,EAA4B,GAAI,UAAA,CAAW,kBAAkB,CAAA;AAErE,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,8BAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,kBAAM,GAAA,CAAC,YAAA,EAAA,EAAa,CAAA,EAAI,MAAA,kBAAQ,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAM,CAAA,WAAA,EAAc,UAAU,CAAA,MAAA,CAAA,EAAU,GAAI,QAAA,EAAA,gBAAA,EAE1F,CAAA;AAAA,MACC,yBACC,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,kBAAM,GAAA,CAAC,OAAI,CAAA,EAAI,MAAA,kBAAQ,GAAA,CAAC,IAAA,EAAA,EAAK,MAAM,CAAA,WAAA,EAAc,UAAU,UAAU,KAAK,CAAA,CAAA,EAAI,GAAI,QAAA,EAAA,SAAA,EAE1F;AAAA,KAAA,EAEJ,CAAA;AAAA,oBAEA,GAAA,CAAC,4BAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,0BAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,4CAAA,EACb,QAAA,kBAAA,GAAA;AAAA,QAAC,aAAA;AAAA,QAAA;AAAA,UACC,UAAA;AAAA,UACA,QAAA;AAAA,UACA,SAAA,EAAW,2BAAA;AAAA,UACX;AAAA;AAAA,OACF,EACF,CAAA;AAAA,sBACA,GAAA,CAAC,2BAAwB,cAAA,EAAgC;AAAA,KAAA,EAC3D,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ,CAAA;AAEA,MAAM,uBAAA,GAA0B,CAAC,EAAE,cAAA,EAAe,KAA+C;AAC/F,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,qBAAA,EAAsB;AAC7C,EAAA,IAAI,CAAC,YAAY,OAAO,IAAA;AACxB,EAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAU,iGACb,QAAA,kBAAA,GAAA,CAAC,yBAAA,EAAA,EAA0B,gBAAgC,CAAA,EAC7D,CAAA;AAEJ,CAAA;AAGO,MAAM,iBAAA,GAAoB,CAAC,iBAAA,KAAgD;AAChF,EAAA,MAAM,EAAE,SAAA,EAAU,GAAI,UAAA,CAAW,kBAAkB,CAAA;AAEnD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,iBAAA,EAAmB;AACxB,IAAA,SAAA,CAAU,iBAAiB,CAAA;AAAA,EAC7B,CAAA,EAAG,CAAC,iBAAA,EAAmB,SAAS,CAAC,CAAA;AACnC;;;;"}
@@ -5,10 +5,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
  const jsxRuntime = require('react/jsx-runtime');
6
6
  const reactVirtual = require('@tanstack/react-virtual');
7
7
  const React = require('react');
8
- require('../../../data-list-ecHsw-zr.cjs');
9
- const dataListSkeleton = require('../../../data-list-skeleton-DGMTqeNP.cjs');
8
+ const dataListSkeleton = require('../../../data-list-skeleton-sdcaabdX.cjs');
10
9
  const useDataListKeyboard = require('../../../use-data-list-keyboard-DF3tLe10.cjs');
11
- const logsDataList = require('../../../logs-data-list-IWZgMCKG.cjs');
10
+ const logsDataList = require('../../../logs-data-list-DlQxxrNw.cjs');
12
11
 
13
12
  const COLUMNS = "6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)";
14
13
  const ROW_HEIGHT = 36;
@@ -1 +1 @@
1
- {"version":3,"file":"logs-list-view.cjs.js","sources":["../../../../src/domains/logs/components/logs-list-view.tsx"],"sourcesContent":["import { useVirtualizer } from '@tanstack/react-virtual';\nimport { useEffect, useRef } from 'react';\nimport type { LogRecord } from '../types';\nimport { useDataListKeyboard } from '@/ds/components/DataList';\nimport type { DataListSort } from '@/ds/components/DataList';\nimport { LogsDataList, LogsDataListSkeleton } from '@/ds/components/LogsDataList';\n\n// Fixed widths on non-flex columns prevent track shifts as the virtualizer swaps rows in/out.\nconst COLUMNS = '6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)';\n\nconst ROW_HEIGHT = 36;\nconst OVERSCAN = 8;\n\nexport interface LogsListViewProps {\n logs: LogRecord[];\n isLoading?: boolean;\n isFetchingNextPage?: boolean;\n hasNextPage?: boolean;\n setEndOfListElement?: (element: HTMLDivElement | null) => void;\n /** Stable per-render id for each log — used for React keys and for matching against `featuredLogId`.\n * Build with `useLogsListNavigation`. */\n logIdMap: Map<LogRecord, string>;\n /** Currently featured/selected log — its row gets the highlighted background. */\n featuredLogId?: string | null;\n /** Called when a row is clicked. The current toggle + trace-sync logic is the consumer's call. */\n onLogClick: (log: LogRecord) => void;\n /** Current timestamp sort direction. When `onSortChange` is provided the Date/Time headers become sortable. */\n timestampSort?: DataListSort;\n onSortChange?: (direction: DataListSort, key: 'timestamp') => void;\n}\n\n/**\n * Virtualized presentational list. Renders only the visible window of logs via\n * TanStack Virtual, sandwiched between top/bottom Spacers that preserve total\n * scroll height. Owns no state and fetches no data.\n */\nexport function LogsListView({\n logs,\n isLoading,\n isFetchingNextPage,\n hasNextPage,\n setEndOfListElement,\n logIdMap,\n featuredLogId,\n onLogClick,\n timestampSort,\n onSortChange,\n}: LogsListViewProps) {\n const scrollRef = useRef<HTMLDivElement | null>(null);\n\n const virtualizer = useVirtualizer({\n count: logs.length,\n getScrollElement: () => scrollRef.current,\n estimateSize: () => ROW_HEIGHT,\n overscan: OVERSCAN,\n });\n\n const { getRowProps } = useDataListKeyboard({\n count: logs.length,\n containerRef: scrollRef,\n onNavigate: index => virtualizer.scrollToIndex(index),\n global: true,\n });\n\n // Reset scroll to top whenever a fresh query resolves (filter / date range change).\n // `isLoading` only flips on initial fetches — `fetchNextPage` keeps it `false`, so this\n // effect doesn't fire during pagination.\n //\n // Why the manual scroll event: when the skeleton-vs-list branch swaps in the new scroll\n // container, it mounts at `scrollTop = 0`. The virtualizer rebinds its listener but\n // doesn't re-read `scrollTop`, so it keeps the stale `scrollOffset` from the previous\n // element. `scrollToOffset(0)` no-ops because the new element is already at 0 (no scroll\n // event fires). Dispatching a synthetic `scroll` forces the virtualizer's handler to\n // read the fresh `scrollTop` and recompute `virtualItems` with `paddingTop = 0`.\n const wasLoadingRef = useRef(isLoading);\n useEffect(() => {\n if (wasLoadingRef.current && !isLoading) {\n scrollRef.current?.dispatchEvent(new Event('scroll'));\n }\n wasLoadingRef.current = isLoading;\n }, [isLoading]);\n\n if (isLoading) {\n return <LogsDataListSkeleton columns={COLUMNS} fit=\"container\" />;\n }\n\n const virtualItems = virtualizer.getVirtualItems();\n const totalSize = virtualizer.getTotalSize();\n const paddingTop = virtualItems[0]?.start ?? 0;\n const paddingBottom =\n virtualItems.length > 0 ? Math.max(0, totalSize - (virtualItems[virtualItems.length - 1]?.end ?? 0)) : 0;\n\n return (\n <LogsDataList columns={COLUMNS} scrollRef={scrollRef} className=\"min-w-0\" fit=\"container\">\n <LogsDataList.Top>\n {onSortChange ? (\n <LogsDataList.SortableTopCell sortKey=\"timestamp\" sort={timestampSort} onSortChange={onSortChange}>\n Date\n </LogsDataList.SortableTopCell>\n ) : (\n <LogsDataList.TopCell>Date</LogsDataList.TopCell>\n )}\n <LogsDataList.TopCell>Time</LogsDataList.TopCell>\n <LogsDataList.TopCell>Level</LogsDataList.TopCell>\n <LogsDataList.TopCell>Entity</LogsDataList.TopCell>\n <LogsDataList.TopCell>Message</LogsDataList.TopCell>\n <LogsDataList.TopCell>Data</LogsDataList.TopCell>\n </LogsDataList.Top>\n\n {logs.length === 0 ? (\n <LogsDataList.NoMatch message=\"No logs match your search\" />\n ) : (\n <>\n <LogsDataList.Spacer height={paddingTop} />\n {virtualItems.map(vi => {\n const log = logs[vi.index];\n if (!log) return null;\n const id = logIdMap.get(log);\n // Defensive: consumer is expected to build `logIdMap` from the same `logs` list\n // (via `useLogsListNavigation`), but if they drift we'd rather drop the row than\n // ship a missing-key warning and broken selection highlighting.\n if (!id) return null;\n const isFeatured = id === featuredLogId;\n\n return (\n <LogsDataList.RowButton\n key={id}\n ref={virtualizer.measureElement}\n data-index={vi.index}\n {...getRowProps(vi.index)}\n onClick={() => onLogClick(log)}\n featured={isFeatured}\n variant={log.level === 'error' || log.level === 'fatal' ? 'error' : 'default'}\n >\n <LogsDataList.DateCell timestamp={log.timestamp} />\n <LogsDataList.TimeCell timestamp={log.timestamp} />\n <LogsDataList.LevelCell level={log.level} />\n <LogsDataList.EntityCell entityType={log.entityType} entityName={log.entityName} />\n <LogsDataList.MessageCell message={log.message} />\n <LogsDataList.DataCell data={log.data} />\n </LogsDataList.RowButton>\n );\n })}\n <LogsDataList.Spacer height={paddingBottom} />\n </>\n )}\n <LogsDataList.NextPageLoading\n isLoading={isFetchingNextPage}\n hasMore={hasNextPage}\n setEndOfListElement={setEndOfListElement}\n />\n </LogsDataList>\n );\n}\n"],"names":["useRef","useVirtualizer","useDataListKeyboard","useEffect","jsx","LogsDataListSkeleton","jsxs","LogsDataList","Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"logs-list-view.cjs.js","sources":["../../../../src/domains/logs/components/logs-list-view.tsx"],"sourcesContent":["import { useVirtualizer } from '@tanstack/react-virtual';\nimport { useEffect, useRef } from 'react';\nimport type { LogRecord } from '../types';\nimport { useDataListKeyboard } from '@/ds/components/DataList';\nimport type { DataListSort } from '@/ds/components/DataList';\nimport { LogsDataList, LogsDataListSkeleton } from '@/ds/components/LogsDataList';\n\n// Fixed widths on non-flex columns prevent track shifts as the virtualizer swaps rows in/out.\nconst COLUMNS = '6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)';\n\nconst ROW_HEIGHT = 36;\nconst OVERSCAN = 8;\n\nexport interface LogsListViewProps {\n logs: LogRecord[];\n isLoading?: boolean;\n isFetchingNextPage?: boolean;\n hasNextPage?: boolean;\n setEndOfListElement?: (element: HTMLDivElement | null) => void;\n /** Stable per-render id for each log — used for React keys and for matching against `featuredLogId`.\n * Build with `useLogsListNavigation`. */\n logIdMap: Map<LogRecord, string>;\n /** Currently featured/selected log — its row gets the highlighted background. */\n featuredLogId?: string | null;\n /** Called when a row is clicked. The current toggle + trace-sync logic is the consumer's call. */\n onLogClick: (log: LogRecord) => void;\n /** Current timestamp sort direction. When `onSortChange` is provided the Date/Time headers become sortable. */\n timestampSort?: DataListSort;\n onSortChange?: (direction: DataListSort, key: 'timestamp') => void;\n}\n\n/**\n * Virtualized presentational list. Renders only the visible window of logs via\n * TanStack Virtual, sandwiched between top/bottom Spacers that preserve total\n * scroll height. Owns no state and fetches no data.\n */\nexport function LogsListView({\n logs,\n isLoading,\n isFetchingNextPage,\n hasNextPage,\n setEndOfListElement,\n logIdMap,\n featuredLogId,\n onLogClick,\n timestampSort,\n onSortChange,\n}: LogsListViewProps) {\n const scrollRef = useRef<HTMLDivElement | null>(null);\n\n const virtualizer = useVirtualizer({\n count: logs.length,\n getScrollElement: () => scrollRef.current,\n estimateSize: () => ROW_HEIGHT,\n overscan: OVERSCAN,\n });\n\n const { getRowProps } = useDataListKeyboard({\n count: logs.length,\n containerRef: scrollRef,\n onNavigate: index => virtualizer.scrollToIndex(index),\n global: true,\n });\n\n // Reset scroll to top whenever a fresh query resolves (filter / date range change).\n // `isLoading` only flips on initial fetches — `fetchNextPage` keeps it `false`, so this\n // effect doesn't fire during pagination.\n //\n // Why the manual scroll event: when the skeleton-vs-list branch swaps in the new scroll\n // container, it mounts at `scrollTop = 0`. The virtualizer rebinds its listener but\n // doesn't re-read `scrollTop`, so it keeps the stale `scrollOffset` from the previous\n // element. `scrollToOffset(0)` no-ops because the new element is already at 0 (no scroll\n // event fires). Dispatching a synthetic `scroll` forces the virtualizer's handler to\n // read the fresh `scrollTop` and recompute `virtualItems` with `paddingTop = 0`.\n const wasLoadingRef = useRef(isLoading);\n useEffect(() => {\n if (wasLoadingRef.current && !isLoading) {\n scrollRef.current?.dispatchEvent(new Event('scroll'));\n }\n wasLoadingRef.current = isLoading;\n }, [isLoading]);\n\n if (isLoading) {\n return <LogsDataListSkeleton columns={COLUMNS} fit=\"container\" />;\n }\n\n const virtualItems = virtualizer.getVirtualItems();\n const totalSize = virtualizer.getTotalSize();\n const paddingTop = virtualItems[0]?.start ?? 0;\n const paddingBottom =\n virtualItems.length > 0 ? Math.max(0, totalSize - (virtualItems[virtualItems.length - 1]?.end ?? 0)) : 0;\n\n return (\n <LogsDataList columns={COLUMNS} scrollRef={scrollRef} className=\"min-w-0\" fit=\"container\">\n <LogsDataList.Top>\n {onSortChange ? (\n <LogsDataList.SortableTopCell sortKey=\"timestamp\" sort={timestampSort} onSortChange={onSortChange}>\n Date\n </LogsDataList.SortableTopCell>\n ) : (\n <LogsDataList.TopCell>Date</LogsDataList.TopCell>\n )}\n <LogsDataList.TopCell>Time</LogsDataList.TopCell>\n <LogsDataList.TopCell>Level</LogsDataList.TopCell>\n <LogsDataList.TopCell>Entity</LogsDataList.TopCell>\n <LogsDataList.TopCell>Message</LogsDataList.TopCell>\n <LogsDataList.TopCell>Data</LogsDataList.TopCell>\n </LogsDataList.Top>\n\n {logs.length === 0 ? (\n <LogsDataList.NoMatch message=\"No logs match your search\" />\n ) : (\n <>\n <LogsDataList.Spacer height={paddingTop} />\n {virtualItems.map(vi => {\n const log = logs[vi.index];\n if (!log) return null;\n const id = logIdMap.get(log);\n // Defensive: consumer is expected to build `logIdMap` from the same `logs` list\n // (via `useLogsListNavigation`), but if they drift we'd rather drop the row than\n // ship a missing-key warning and broken selection highlighting.\n if (!id) return null;\n const isFeatured = id === featuredLogId;\n\n return (\n <LogsDataList.RowButton\n key={id}\n ref={virtualizer.measureElement}\n data-index={vi.index}\n {...getRowProps(vi.index)}\n onClick={() => onLogClick(log)}\n featured={isFeatured}\n variant={log.level === 'error' || log.level === 'fatal' ? 'error' : 'default'}\n >\n <LogsDataList.DateCell timestamp={log.timestamp} />\n <LogsDataList.TimeCell timestamp={log.timestamp} />\n <LogsDataList.LevelCell level={log.level} />\n <LogsDataList.EntityCell entityType={log.entityType} entityName={log.entityName} />\n <LogsDataList.MessageCell message={log.message} />\n <LogsDataList.DataCell data={log.data} />\n </LogsDataList.RowButton>\n );\n })}\n <LogsDataList.Spacer height={paddingBottom} />\n </>\n )}\n <LogsDataList.NextPageLoading\n isLoading={isFetchingNextPage}\n hasMore={hasNextPage}\n setEndOfListElement={setEndOfListElement}\n />\n </LogsDataList>\n );\n}\n"],"names":["useRef","useVirtualizer","useDataListKeyboard","useEffect","jsx","LogsDataListSkeleton","jsxs","LogsDataList","Fragment"],"mappings":"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"}
@@ -1,10 +1,9 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
2
  import { useVirtualizer } from '@tanstack/react-virtual';
3
3
  import { useRef, useEffect } from 'react';
4
- import '../../../data-list-DdCZZctL.js';
5
- import { D as DataListSkeleton } from '../../../data-list-skeleton-CGKlcoiI.js';
4
+ import { D as DataListSkeleton } from '../../../data-list-skeleton-bNfITSHs.js';
6
5
  import { u as useDataListKeyboard } from '../../../use-data-list-keyboard-DFQr4t38.js';
7
- import { L as LogsDataList } from '../../../logs-data-list-DBJINzIL.js';
6
+ import { L as LogsDataList } from '../../../logs-data-list-Cb85LPcT.js';
8
7
 
9
8
  const COLUMNS = "6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)";
10
9
  const ROW_HEIGHT = 36;
@@ -1 +1 @@
1
- {"version":3,"file":"logs-list-view.es.js","sources":["../../../../src/domains/logs/components/logs-list-view.tsx"],"sourcesContent":["import { useVirtualizer } from '@tanstack/react-virtual';\nimport { useEffect, useRef } from 'react';\nimport type { LogRecord } from '../types';\nimport { useDataListKeyboard } from '@/ds/components/DataList';\nimport type { DataListSort } from '@/ds/components/DataList';\nimport { LogsDataList, LogsDataListSkeleton } from '@/ds/components/LogsDataList';\n\n// Fixed widths on non-flex columns prevent track shifts as the virtualizer swaps rows in/out.\nconst COLUMNS = '6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)';\n\nconst ROW_HEIGHT = 36;\nconst OVERSCAN = 8;\n\nexport interface LogsListViewProps {\n logs: LogRecord[];\n isLoading?: boolean;\n isFetchingNextPage?: boolean;\n hasNextPage?: boolean;\n setEndOfListElement?: (element: HTMLDivElement | null) => void;\n /** Stable per-render id for each log — used for React keys and for matching against `featuredLogId`.\n * Build with `useLogsListNavigation`. */\n logIdMap: Map<LogRecord, string>;\n /** Currently featured/selected log — its row gets the highlighted background. */\n featuredLogId?: string | null;\n /** Called when a row is clicked. The current toggle + trace-sync logic is the consumer's call. */\n onLogClick: (log: LogRecord) => void;\n /** Current timestamp sort direction. When `onSortChange` is provided the Date/Time headers become sortable. */\n timestampSort?: DataListSort;\n onSortChange?: (direction: DataListSort, key: 'timestamp') => void;\n}\n\n/**\n * Virtualized presentational list. Renders only the visible window of logs via\n * TanStack Virtual, sandwiched between top/bottom Spacers that preserve total\n * scroll height. Owns no state and fetches no data.\n */\nexport function LogsListView({\n logs,\n isLoading,\n isFetchingNextPage,\n hasNextPage,\n setEndOfListElement,\n logIdMap,\n featuredLogId,\n onLogClick,\n timestampSort,\n onSortChange,\n}: LogsListViewProps) {\n const scrollRef = useRef<HTMLDivElement | null>(null);\n\n const virtualizer = useVirtualizer({\n count: logs.length,\n getScrollElement: () => scrollRef.current,\n estimateSize: () => ROW_HEIGHT,\n overscan: OVERSCAN,\n });\n\n const { getRowProps } = useDataListKeyboard({\n count: logs.length,\n containerRef: scrollRef,\n onNavigate: index => virtualizer.scrollToIndex(index),\n global: true,\n });\n\n // Reset scroll to top whenever a fresh query resolves (filter / date range change).\n // `isLoading` only flips on initial fetches — `fetchNextPage` keeps it `false`, so this\n // effect doesn't fire during pagination.\n //\n // Why the manual scroll event: when the skeleton-vs-list branch swaps in the new scroll\n // container, it mounts at `scrollTop = 0`. The virtualizer rebinds its listener but\n // doesn't re-read `scrollTop`, so it keeps the stale `scrollOffset` from the previous\n // element. `scrollToOffset(0)` no-ops because the new element is already at 0 (no scroll\n // event fires). Dispatching a synthetic `scroll` forces the virtualizer's handler to\n // read the fresh `scrollTop` and recompute `virtualItems` with `paddingTop = 0`.\n const wasLoadingRef = useRef(isLoading);\n useEffect(() => {\n if (wasLoadingRef.current && !isLoading) {\n scrollRef.current?.dispatchEvent(new Event('scroll'));\n }\n wasLoadingRef.current = isLoading;\n }, [isLoading]);\n\n if (isLoading) {\n return <LogsDataListSkeleton columns={COLUMNS} fit=\"container\" />;\n }\n\n const virtualItems = virtualizer.getVirtualItems();\n const totalSize = virtualizer.getTotalSize();\n const paddingTop = virtualItems[0]?.start ?? 0;\n const paddingBottom =\n virtualItems.length > 0 ? Math.max(0, totalSize - (virtualItems[virtualItems.length - 1]?.end ?? 0)) : 0;\n\n return (\n <LogsDataList columns={COLUMNS} scrollRef={scrollRef} className=\"min-w-0\" fit=\"container\">\n <LogsDataList.Top>\n {onSortChange ? (\n <LogsDataList.SortableTopCell sortKey=\"timestamp\" sort={timestampSort} onSortChange={onSortChange}>\n Date\n </LogsDataList.SortableTopCell>\n ) : (\n <LogsDataList.TopCell>Date</LogsDataList.TopCell>\n )}\n <LogsDataList.TopCell>Time</LogsDataList.TopCell>\n <LogsDataList.TopCell>Level</LogsDataList.TopCell>\n <LogsDataList.TopCell>Entity</LogsDataList.TopCell>\n <LogsDataList.TopCell>Message</LogsDataList.TopCell>\n <LogsDataList.TopCell>Data</LogsDataList.TopCell>\n </LogsDataList.Top>\n\n {logs.length === 0 ? (\n <LogsDataList.NoMatch message=\"No logs match your search\" />\n ) : (\n <>\n <LogsDataList.Spacer height={paddingTop} />\n {virtualItems.map(vi => {\n const log = logs[vi.index];\n if (!log) return null;\n const id = logIdMap.get(log);\n // Defensive: consumer is expected to build `logIdMap` from the same `logs` list\n // (via `useLogsListNavigation`), but if they drift we'd rather drop the row than\n // ship a missing-key warning and broken selection highlighting.\n if (!id) return null;\n const isFeatured = id === featuredLogId;\n\n return (\n <LogsDataList.RowButton\n key={id}\n ref={virtualizer.measureElement}\n data-index={vi.index}\n {...getRowProps(vi.index)}\n onClick={() => onLogClick(log)}\n featured={isFeatured}\n variant={log.level === 'error' || log.level === 'fatal' ? 'error' : 'default'}\n >\n <LogsDataList.DateCell timestamp={log.timestamp} />\n <LogsDataList.TimeCell timestamp={log.timestamp} />\n <LogsDataList.LevelCell level={log.level} />\n <LogsDataList.EntityCell entityType={log.entityType} entityName={log.entityName} />\n <LogsDataList.MessageCell message={log.message} />\n <LogsDataList.DataCell data={log.data} />\n </LogsDataList.RowButton>\n );\n })}\n <LogsDataList.Spacer height={paddingBottom} />\n </>\n )}\n <LogsDataList.NextPageLoading\n isLoading={isFetchingNextPage}\n hasMore={hasNextPage}\n setEndOfListElement={setEndOfListElement}\n />\n </LogsDataList>\n );\n}\n"],"names":["LogsDataListSkeleton"],"mappings":"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"}
1
+ {"version":3,"file":"logs-list-view.es.js","sources":["../../../../src/domains/logs/components/logs-list-view.tsx"],"sourcesContent":["import { useVirtualizer } from '@tanstack/react-virtual';\nimport { useEffect, useRef } from 'react';\nimport type { LogRecord } from '../types';\nimport { useDataListKeyboard } from '@/ds/components/DataList';\nimport type { DataListSort } from '@/ds/components/DataList';\nimport { LogsDataList, LogsDataListSkeleton } from '@/ds/components/LogsDataList';\n\n// Fixed widths on non-flex columns prevent track shifts as the virtualizer swaps rows in/out.\nconst COLUMNS = '6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)';\n\nconst ROW_HEIGHT = 36;\nconst OVERSCAN = 8;\n\nexport interface LogsListViewProps {\n logs: LogRecord[];\n isLoading?: boolean;\n isFetchingNextPage?: boolean;\n hasNextPage?: boolean;\n setEndOfListElement?: (element: HTMLDivElement | null) => void;\n /** Stable per-render id for each log — used for React keys and for matching against `featuredLogId`.\n * Build with `useLogsListNavigation`. */\n logIdMap: Map<LogRecord, string>;\n /** Currently featured/selected log — its row gets the highlighted background. */\n featuredLogId?: string | null;\n /** Called when a row is clicked. The current toggle + trace-sync logic is the consumer's call. */\n onLogClick: (log: LogRecord) => void;\n /** Current timestamp sort direction. When `onSortChange` is provided the Date/Time headers become sortable. */\n timestampSort?: DataListSort;\n onSortChange?: (direction: DataListSort, key: 'timestamp') => void;\n}\n\n/**\n * Virtualized presentational list. Renders only the visible window of logs via\n * TanStack Virtual, sandwiched between top/bottom Spacers that preserve total\n * scroll height. Owns no state and fetches no data.\n */\nexport function LogsListView({\n logs,\n isLoading,\n isFetchingNextPage,\n hasNextPage,\n setEndOfListElement,\n logIdMap,\n featuredLogId,\n onLogClick,\n timestampSort,\n onSortChange,\n}: LogsListViewProps) {\n const scrollRef = useRef<HTMLDivElement | null>(null);\n\n const virtualizer = useVirtualizer({\n count: logs.length,\n getScrollElement: () => scrollRef.current,\n estimateSize: () => ROW_HEIGHT,\n overscan: OVERSCAN,\n });\n\n const { getRowProps } = useDataListKeyboard({\n count: logs.length,\n containerRef: scrollRef,\n onNavigate: index => virtualizer.scrollToIndex(index),\n global: true,\n });\n\n // Reset scroll to top whenever a fresh query resolves (filter / date range change).\n // `isLoading` only flips on initial fetches — `fetchNextPage` keeps it `false`, so this\n // effect doesn't fire during pagination.\n //\n // Why the manual scroll event: when the skeleton-vs-list branch swaps in the new scroll\n // container, it mounts at `scrollTop = 0`. The virtualizer rebinds its listener but\n // doesn't re-read `scrollTop`, so it keeps the stale `scrollOffset` from the previous\n // element. `scrollToOffset(0)` no-ops because the new element is already at 0 (no scroll\n // event fires). Dispatching a synthetic `scroll` forces the virtualizer's handler to\n // read the fresh `scrollTop` and recompute `virtualItems` with `paddingTop = 0`.\n const wasLoadingRef = useRef(isLoading);\n useEffect(() => {\n if (wasLoadingRef.current && !isLoading) {\n scrollRef.current?.dispatchEvent(new Event('scroll'));\n }\n wasLoadingRef.current = isLoading;\n }, [isLoading]);\n\n if (isLoading) {\n return <LogsDataListSkeleton columns={COLUMNS} fit=\"container\" />;\n }\n\n const virtualItems = virtualizer.getVirtualItems();\n const totalSize = virtualizer.getTotalSize();\n const paddingTop = virtualItems[0]?.start ?? 0;\n const paddingBottom =\n virtualItems.length > 0 ? Math.max(0, totalSize - (virtualItems[virtualItems.length - 1]?.end ?? 0)) : 0;\n\n return (\n <LogsDataList columns={COLUMNS} scrollRef={scrollRef} className=\"min-w-0\" fit=\"container\">\n <LogsDataList.Top>\n {onSortChange ? (\n <LogsDataList.SortableTopCell sortKey=\"timestamp\" sort={timestampSort} onSortChange={onSortChange}>\n Date\n </LogsDataList.SortableTopCell>\n ) : (\n <LogsDataList.TopCell>Date</LogsDataList.TopCell>\n )}\n <LogsDataList.TopCell>Time</LogsDataList.TopCell>\n <LogsDataList.TopCell>Level</LogsDataList.TopCell>\n <LogsDataList.TopCell>Entity</LogsDataList.TopCell>\n <LogsDataList.TopCell>Message</LogsDataList.TopCell>\n <LogsDataList.TopCell>Data</LogsDataList.TopCell>\n </LogsDataList.Top>\n\n {logs.length === 0 ? (\n <LogsDataList.NoMatch message=\"No logs match your search\" />\n ) : (\n <>\n <LogsDataList.Spacer height={paddingTop} />\n {virtualItems.map(vi => {\n const log = logs[vi.index];\n if (!log) return null;\n const id = logIdMap.get(log);\n // Defensive: consumer is expected to build `logIdMap` from the same `logs` list\n // (via `useLogsListNavigation`), but if they drift we'd rather drop the row than\n // ship a missing-key warning and broken selection highlighting.\n if (!id) return null;\n const isFeatured = id === featuredLogId;\n\n return (\n <LogsDataList.RowButton\n key={id}\n ref={virtualizer.measureElement}\n data-index={vi.index}\n {...getRowProps(vi.index)}\n onClick={() => onLogClick(log)}\n featured={isFeatured}\n variant={log.level === 'error' || log.level === 'fatal' ? 'error' : 'default'}\n >\n <LogsDataList.DateCell timestamp={log.timestamp} />\n <LogsDataList.TimeCell timestamp={log.timestamp} />\n <LogsDataList.LevelCell level={log.level} />\n <LogsDataList.EntityCell entityType={log.entityType} entityName={log.entityName} />\n <LogsDataList.MessageCell message={log.message} />\n <LogsDataList.DataCell data={log.data} />\n </LogsDataList.RowButton>\n );\n })}\n <LogsDataList.Spacer height={paddingBottom} />\n </>\n )}\n <LogsDataList.NextPageLoading\n isLoading={isFetchingNextPage}\n hasMore={hasNextPage}\n setEndOfListElement={setEndOfListElement}\n />\n </LogsDataList>\n );\n}\n"],"names":["LogsDataListSkeleton"],"mappings":"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"}
@@ -5,8 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
  const jsxRuntime = require('react/jsx-runtime');
6
6
  const scores = require('@mastra/react/hooks/scores');
7
7
  const React = require('react');
8
- const dataList = require('../../../data-list-ecHsw-zr.cjs');
9
- require('../../../keyboard/keyboard-shortcuts-context.cjs.js');
8
+ const dataList = require('../../../data-list-CmjTe8xE.cjs');
10
9
  const EmptyState = require('../../../EmptyState-FNJu74e8.cjs');
11
10
  const metricsKpiCard = require('../../../metrics-kpi-card-LOGZrRxg.cjs');
12
11
  const spinner = require('../../../spinner-Q8y5rnSa.cjs');
@@ -1 +1 @@
1
- {"version":3,"file":"trace-scores-tab.cjs.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { useTraceSpanScores } from '@mastra/react/hooks/scores';\nimport { useState } from 'react';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({\n traceId,\n spanId,\n page,\n queryOptions: { enabled: !!traceId && !!spanId },\n });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n\n return (\n <MetricsKpiCard className=\"relative min-w-0 cursor-pointer\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid cursor-pointer gap-1 text-left after:absolute after:inset-0 after:content-['']\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'relative z-10 underline underline-offset-2')}\n >\n <Txt as=\"span\" variant=\"caption\">\n {expanded ? 'Read less' : 'Read more'}\n </Txt>\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":["useState","useTraceSpanScores","jsx","Spinner","scores","EmptyState","jsxs","MetricsKpiCard","getShortId","Txt","formatDate","Fragment","cn","quietTextHover","controlStateColorTransition","DataList"],"mappings":"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"}
1
+ {"version":3,"file":"trace-scores-tab.cjs.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { useTraceSpanScores } from '@mastra/react/hooks/scores';\nimport { useState } from 'react';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({\n traceId,\n spanId,\n page,\n queryOptions: { enabled: !!traceId && !!spanId },\n });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n\n return (\n <MetricsKpiCard className=\"relative min-w-0 cursor-pointer\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid cursor-pointer gap-1 text-left after:absolute after:inset-0 after:content-['']\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'relative z-10 underline underline-offset-2')}\n >\n <Txt as=\"span\" variant=\"caption\">\n {expanded ? 'Read less' : 'Read more'}\n </Txt>\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":["useState","useTraceSpanScores","jsx","Spinner","scores","EmptyState","jsxs","MetricsKpiCard","getShortId","Txt","formatDate","Fragment","cn","quietTextHover","controlStateColorTransition","DataList"],"mappings":"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"}
@@ -1,8 +1,7 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
2
  import { useTraceSpanScores } from '@mastra/react/hooks/scores';
3
3
  import { useState } from 'react';
4
- import { e as DataList } from '../../../data-list-DdCZZctL.js';
5
- import '../../../keyboard/keyboard-shortcuts-context.es.js';
4
+ import { D as DataList } from '../../../data-list-DT1LVR29.js';
6
5
  import { E as EmptyState } from '../../../EmptyState-qVoRkUMf.js';
7
6
  import { M as MetricsKpiCard } from '../../../metrics-kpi-card-Br-DJ-As.js';
8
7
  import { S as Spinner } from '../../../spinner-CsLM6TfA.js';
@@ -1 +1 @@
1
- {"version":3,"file":"trace-scores-tab.es.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { useTraceSpanScores } from '@mastra/react/hooks/scores';\nimport { useState } from 'react';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({\n traceId,\n spanId,\n page,\n queryOptions: { enabled: !!traceId && !!spanId },\n });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n\n return (\n <MetricsKpiCard className=\"relative min-w-0 cursor-pointer\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid cursor-pointer gap-1 text-left after:absolute after:inset-0 after:content-['']\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'relative z-10 underline underline-offset-2')}\n >\n <Txt as=\"span\" variant=\"caption\">\n {expanded ? 'Read less' : 'Read more'}\n </Txt>\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"trace-scores-tab.es.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { useTraceSpanScores } from '@mastra/react/hooks/scores';\nimport { useState } from 'react';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({\n traceId,\n spanId,\n page,\n queryOptions: { enabled: !!traceId && !!spanId },\n });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n\n return (\n <MetricsKpiCard className=\"relative min-w-0 cursor-pointer\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid cursor-pointer gap-1 text-left after:absolute after:inset-0 after:content-['']\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'relative z-10 underline underline-offset-2')}\n >\n <Txt as=\"span\" variant=\"caption\">\n {expanded ? 'Read less' : 'Read more'}\n </Txt>\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":[],"mappings":"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"}
@@ -6,13 +6,6 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
6
6
  if (!spans || spans.length === 0) {
7
7
  return [];
8
8
  }
9
- const overallEndDate = spans.reduce(
10
- (latest, span) => {
11
- const endDate = span?.endedAt ? new Date(span.endedAt) : void 0;
12
- return endDate && (!latest || endDate > latest) ? endDate : latest;
13
- },
14
- null
15
- );
16
9
  const spanMap = /* @__PURE__ */ new Map();
17
10
  const rootSpans = [];
18
11
  spans.forEach((spanRecord) => {
@@ -36,12 +29,6 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
36
29
  const uiSpan = spanMap.get(spanRecord.spanId);
37
30
  if (!uiSpan) return;
38
31
  if (isAnchor(spanRecord)) {
39
- if (overallEndDate && uiSpan.endTime && overallEndDate > new Date(uiSpan.endTime)) {
40
- uiSpan.endTime = overallEndDate.toISOString();
41
- const overallEndTime = new Date(overallEndDate).getTime();
42
- const spanStartTime = new Date(uiSpan.startTime).getTime();
43
- uiSpan.latency = overallEndTime - spanStartTime;
44
- }
45
32
  rootSpans.push(uiSpan);
46
33
  } else {
47
34
  const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : void 0;
@@ -66,6 +53,18 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
66
53
  });
67
54
  };
68
55
  sortNestedSpans(sortedRootSpans);
56
+ const getLatestEndTime = (span) => (span.spans ?? []).reduce(
57
+ (latest, child) => Math.max(latest, getLatestEndTime(child)),
58
+ span.endTime ? new Date(span.endTime).getTime() : 0
59
+ );
60
+ sortedRootSpans.forEach((rootSpan) => {
61
+ if (!rootSpan.endTime) return;
62
+ const latestEndTime = getLatestEndTime(rootSpan);
63
+ if (latestEndTime > new Date(rootSpan.endTime).getTime()) {
64
+ rootSpan.endTime = new Date(latestEndTime).toISOString();
65
+ rootSpan.latency = latestEndTime - new Date(rootSpan.startTime).getTime();
66
+ }
67
+ });
69
68
  return sortedRootSpans;
70
69
  };
71
70
 
@@ -1 +1 @@
1
- {"version":3,"file":"format-hierarchical-spans.cjs.js","sources":["../../../../src/domains/traces/components/format-hierarchical-spans.ts"],"sourcesContent":["import type { UISpan } from '../types';\n\n/** Minimal span fields required for building the hierarchical timeline tree. */\ntype TimelineSpan = {\n spanId: string;\n name: string;\n spanType: string;\n startedAt: Date | string;\n endedAt?: Date | string | null;\n parentSpanId?: string | null;\n matchedInPayloadOnly?: boolean;\n};\n\n/**\n * When `anchorSpanId` is provided, that span is treated as the displayed root\n * regardless of its `parentSpanId` -- the branch-subtree case from `getBranch`,\n * where the anchor has a real parent that's outside the returned set. Without\n * it, the displayed roots are the spans with no parent (the trace case).\n */\nexport const formatHierarchicalSpans = (spans: TimelineSpan[], anchorSpanId?: string): UISpan[] => {\n if (!spans || spans.length === 0) {\n return [];\n }\n\n const overallEndDate = spans.reduce(\n (latest, span) => {\n const endDate = span?.endedAt ? new Date(span.endedAt) : undefined;\n return endDate && (!latest || endDate > latest) ? endDate : latest;\n },\n null as Date | null,\n );\n\n const spanMap = new Map<string, UISpan>();\n const rootSpans: UISpan[] = [];\n\n spans.forEach(spanRecord => {\n const startDate = new Date(spanRecord.startedAt);\n const endDate = spanRecord.endedAt ? new Date(spanRecord.endedAt) : undefined;\n\n const uiSpan: UISpan = {\n id: spanRecord.spanId,\n name: spanRecord.name,\n type: spanRecord.spanType,\n latency: endDate ? endDate.getTime() - startDate.getTime() : 0,\n startTime: startDate.toISOString(),\n endTime: endDate ? endDate.toISOString() : undefined,\n spans: [],\n parentSpanId: spanRecord.parentSpanId,\n matchedInPayloadOnly: spanRecord.matchedInPayloadOnly,\n };\n\n spanMap.set(spanRecord.spanId, uiSpan);\n });\n\n const isAnchor = (spanRecord: TimelineSpan) =>\n anchorSpanId ? spanRecord.spanId === anchorSpanId : spanRecord?.parentSpanId == null;\n\n spans.forEach(spanRecord => {\n const uiSpan = spanMap.get(spanRecord.spanId);\n if (!uiSpan) return;\n\n if (isAnchor(spanRecord)) {\n if (overallEndDate && uiSpan.endTime && overallEndDate > new Date(uiSpan.endTime)) {\n uiSpan.endTime = overallEndDate.toISOString();\n const overallEndTime = new Date(overallEndDate).getTime();\n const spanStartTime = new Date(uiSpan.startTime).getTime();\n uiSpan.latency = overallEndTime - spanStartTime;\n }\n rootSpans.push(uiSpan);\n } else {\n const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : undefined;\n if (parent) {\n parent.spans ??= [];\n parent.spans.push(uiSpan);\n } else {\n // Orphan: either the parent isn't in the supplied set (branch subtree boundary), or\n // the span has no parent yet wasn't picked as the anchor (rare when `anchorSpanId`\n // is specified). Surface it at the displayed root rather than dropping it.\n rootSpans.push(uiSpan);\n }\n }\n });\n\n const sortSpansByStartTime = (spans: UISpan[]): UISpan[] => {\n return spans.sort((a, b) => new Date(a.startTime).getTime() - new Date(b.startTime).getTime());\n };\n\n const sortedRootSpans = sortSpansByStartTime(rootSpans);\n\n const sortNestedSpans = (spans: UISpan[]): void => {\n spans.forEach(span => {\n if (span.spans && span.spans.length > 0) {\n span.spans = sortSpansByStartTime(span.spans);\n sortNestedSpans(span.spans);\n }\n });\n };\n\n sortNestedSpans(sortedRootSpans);\n\n return sortedRootSpans;\n};\n"],"names":["spans"],"mappings":"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"}
1
+ {"version":3,"file":"format-hierarchical-spans.cjs.js","sources":["../../../../src/domains/traces/components/format-hierarchical-spans.ts"],"sourcesContent":["import type { UISpan } from '../types';\n\n/** Minimal span fields required for building the hierarchical timeline tree. */\ntype TimelineSpan = {\n spanId: string;\n name: string;\n spanType: string;\n startedAt: Date | string;\n endedAt?: Date | string | null;\n parentSpanId?: string | null;\n matchedInPayloadOnly?: boolean;\n};\n\n/**\n * When `anchorSpanId` is provided, that span is treated as the displayed root\n * regardless of its `parentSpanId` -- the branch-subtree case from `getBranch`,\n * where the anchor has a real parent that's outside the returned set. Without\n * it, the displayed roots are the spans with no parent (the trace case).\n */\nexport const formatHierarchicalSpans = (spans: TimelineSpan[], anchorSpanId?: string): UISpan[] => {\n if (!spans || spans.length === 0) {\n return [];\n }\n\n const spanMap = new Map<string, UISpan>();\n const rootSpans: UISpan[] = [];\n\n spans.forEach(spanRecord => {\n const startDate = new Date(spanRecord.startedAt);\n const endDate = spanRecord.endedAt ? new Date(spanRecord.endedAt) : undefined;\n\n const uiSpan: UISpan = {\n id: spanRecord.spanId,\n name: spanRecord.name,\n type: spanRecord.spanType,\n latency: endDate ? endDate.getTime() - startDate.getTime() : 0,\n startTime: startDate.toISOString(),\n endTime: endDate ? endDate.toISOString() : undefined,\n spans: [],\n parentSpanId: spanRecord.parentSpanId,\n matchedInPayloadOnly: spanRecord.matchedInPayloadOnly,\n };\n\n spanMap.set(spanRecord.spanId, uiSpan);\n });\n\n const isAnchor = (spanRecord: TimelineSpan) =>\n anchorSpanId ? spanRecord.spanId === anchorSpanId : spanRecord?.parentSpanId == null;\n\n spans.forEach(spanRecord => {\n const uiSpan = spanMap.get(spanRecord.spanId);\n if (!uiSpan) return;\n\n if (isAnchor(spanRecord)) {\n rootSpans.push(uiSpan);\n } else {\n const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : undefined;\n if (parent) {\n parent.spans ??= [];\n parent.spans.push(uiSpan);\n } else {\n // Orphan: either the parent isn't in the supplied set (branch subtree boundary), or\n // the span has no parent yet wasn't picked as the anchor (rare when `anchorSpanId`\n // is specified). Surface it at the displayed root rather than dropping it.\n rootSpans.push(uiSpan);\n }\n }\n });\n\n const sortSpansByStartTime = (spans: UISpan[]): UISpan[] => {\n return spans.sort((a, b) => new Date(a.startTime).getTime() - new Date(b.startTime).getTime());\n };\n\n const sortedRootSpans = sortSpansByStartTime(rootSpans);\n\n const sortNestedSpans = (spans: UISpan[]): void => {\n spans.forEach(span => {\n if (span.spans && span.spans.length > 0) {\n span.spans = sortSpansByStartTime(span.spans);\n sortNestedSpans(span.spans);\n }\n });\n };\n\n sortNestedSpans(sortedRootSpans);\n\n const getLatestEndTime = (span: UISpan): number =>\n (span.spans ?? []).reduce(\n (latest, child) => Math.max(latest, getLatestEndTime(child)),\n span.endTime ? new Date(span.endTime).getTime() : 0,\n );\n\n // A root recorded as ending before one of its descendants is widened to cover its own subtree only.\n sortedRootSpans.forEach(rootSpan => {\n if (!rootSpan.endTime) return;\n const latestEndTime = getLatestEndTime(rootSpan);\n if (latestEndTime > new Date(rootSpan.endTime).getTime()) {\n rootSpan.endTime = new Date(latestEndTime).toISOString();\n rootSpan.latency = latestEndTime - new Date(rootSpan.startTime).getTime();\n }\n });\n\n return sortedRootSpans;\n};\n"],"names":["spans"],"mappings":"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"}
@@ -2,13 +2,6 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
2
2
  if (!spans || spans.length === 0) {
3
3
  return [];
4
4
  }
5
- const overallEndDate = spans.reduce(
6
- (latest, span) => {
7
- const endDate = span?.endedAt ? new Date(span.endedAt) : void 0;
8
- return endDate && (!latest || endDate > latest) ? endDate : latest;
9
- },
10
- null
11
- );
12
5
  const spanMap = /* @__PURE__ */ new Map();
13
6
  const rootSpans = [];
14
7
  spans.forEach((spanRecord) => {
@@ -32,12 +25,6 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
32
25
  const uiSpan = spanMap.get(spanRecord.spanId);
33
26
  if (!uiSpan) return;
34
27
  if (isAnchor(spanRecord)) {
35
- if (overallEndDate && uiSpan.endTime && overallEndDate > new Date(uiSpan.endTime)) {
36
- uiSpan.endTime = overallEndDate.toISOString();
37
- const overallEndTime = new Date(overallEndDate).getTime();
38
- const spanStartTime = new Date(uiSpan.startTime).getTime();
39
- uiSpan.latency = overallEndTime - spanStartTime;
40
- }
41
28
  rootSpans.push(uiSpan);
42
29
  } else {
43
30
  const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : void 0;
@@ -62,6 +49,18 @@ const formatHierarchicalSpans = (spans, anchorSpanId) => {
62
49
  });
63
50
  };
64
51
  sortNestedSpans(sortedRootSpans);
52
+ const getLatestEndTime = (span) => (span.spans ?? []).reduce(
53
+ (latest, child) => Math.max(latest, getLatestEndTime(child)),
54
+ span.endTime ? new Date(span.endTime).getTime() : 0
55
+ );
56
+ sortedRootSpans.forEach((rootSpan) => {
57
+ if (!rootSpan.endTime) return;
58
+ const latestEndTime = getLatestEndTime(rootSpan);
59
+ if (latestEndTime > new Date(rootSpan.endTime).getTime()) {
60
+ rootSpan.endTime = new Date(latestEndTime).toISOString();
61
+ rootSpan.latency = latestEndTime - new Date(rootSpan.startTime).getTime();
62
+ }
63
+ });
65
64
  return sortedRootSpans;
66
65
  };
67
66
 
@@ -1 +1 @@
1
- {"version":3,"file":"format-hierarchical-spans.es.js","sources":["../../../../src/domains/traces/components/format-hierarchical-spans.ts"],"sourcesContent":["import type { UISpan } from '../types';\n\n/** Minimal span fields required for building the hierarchical timeline tree. */\ntype TimelineSpan = {\n spanId: string;\n name: string;\n spanType: string;\n startedAt: Date | string;\n endedAt?: Date | string | null;\n parentSpanId?: string | null;\n matchedInPayloadOnly?: boolean;\n};\n\n/**\n * When `anchorSpanId` is provided, that span is treated as the displayed root\n * regardless of its `parentSpanId` -- the branch-subtree case from `getBranch`,\n * where the anchor has a real parent that's outside the returned set. Without\n * it, the displayed roots are the spans with no parent (the trace case).\n */\nexport const formatHierarchicalSpans = (spans: TimelineSpan[], anchorSpanId?: string): UISpan[] => {\n if (!spans || spans.length === 0) {\n return [];\n }\n\n const overallEndDate = spans.reduce(\n (latest, span) => {\n const endDate = span?.endedAt ? new Date(span.endedAt) : undefined;\n return endDate && (!latest || endDate > latest) ? endDate : latest;\n },\n null as Date | null,\n );\n\n const spanMap = new Map<string, UISpan>();\n const rootSpans: UISpan[] = [];\n\n spans.forEach(spanRecord => {\n const startDate = new Date(spanRecord.startedAt);\n const endDate = spanRecord.endedAt ? new Date(spanRecord.endedAt) : undefined;\n\n const uiSpan: UISpan = {\n id: spanRecord.spanId,\n name: spanRecord.name,\n type: spanRecord.spanType,\n latency: endDate ? endDate.getTime() - startDate.getTime() : 0,\n startTime: startDate.toISOString(),\n endTime: endDate ? endDate.toISOString() : undefined,\n spans: [],\n parentSpanId: spanRecord.parentSpanId,\n matchedInPayloadOnly: spanRecord.matchedInPayloadOnly,\n };\n\n spanMap.set(spanRecord.spanId, uiSpan);\n });\n\n const isAnchor = (spanRecord: TimelineSpan) =>\n anchorSpanId ? spanRecord.spanId === anchorSpanId : spanRecord?.parentSpanId == null;\n\n spans.forEach(spanRecord => {\n const uiSpan = spanMap.get(spanRecord.spanId);\n if (!uiSpan) return;\n\n if (isAnchor(spanRecord)) {\n if (overallEndDate && uiSpan.endTime && overallEndDate > new Date(uiSpan.endTime)) {\n uiSpan.endTime = overallEndDate.toISOString();\n const overallEndTime = new Date(overallEndDate).getTime();\n const spanStartTime = new Date(uiSpan.startTime).getTime();\n uiSpan.latency = overallEndTime - spanStartTime;\n }\n rootSpans.push(uiSpan);\n } else {\n const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : undefined;\n if (parent) {\n parent.spans ??= [];\n parent.spans.push(uiSpan);\n } else {\n // Orphan: either the parent isn't in the supplied set (branch subtree boundary), or\n // the span has no parent yet wasn't picked as the anchor (rare when `anchorSpanId`\n // is specified). Surface it at the displayed root rather than dropping it.\n rootSpans.push(uiSpan);\n }\n }\n });\n\n const sortSpansByStartTime = (spans: UISpan[]): UISpan[] => {\n return spans.sort((a, b) => new Date(a.startTime).getTime() - new Date(b.startTime).getTime());\n };\n\n const sortedRootSpans = sortSpansByStartTime(rootSpans);\n\n const sortNestedSpans = (spans: UISpan[]): void => {\n spans.forEach(span => {\n if (span.spans && span.spans.length > 0) {\n span.spans = sortSpansByStartTime(span.spans);\n sortNestedSpans(span.spans);\n }\n });\n };\n\n sortNestedSpans(sortedRootSpans);\n\n return sortedRootSpans;\n};\n"],"names":["spans"],"mappings":"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"}
1
+ {"version":3,"file":"format-hierarchical-spans.es.js","sources":["../../../../src/domains/traces/components/format-hierarchical-spans.ts"],"sourcesContent":["import type { UISpan } from '../types';\n\n/** Minimal span fields required for building the hierarchical timeline tree. */\ntype TimelineSpan = {\n spanId: string;\n name: string;\n spanType: string;\n startedAt: Date | string;\n endedAt?: Date | string | null;\n parentSpanId?: string | null;\n matchedInPayloadOnly?: boolean;\n};\n\n/**\n * When `anchorSpanId` is provided, that span is treated as the displayed root\n * regardless of its `parentSpanId` -- the branch-subtree case from `getBranch`,\n * where the anchor has a real parent that's outside the returned set. Without\n * it, the displayed roots are the spans with no parent (the trace case).\n */\nexport const formatHierarchicalSpans = (spans: TimelineSpan[], anchorSpanId?: string): UISpan[] => {\n if (!spans || spans.length === 0) {\n return [];\n }\n\n const spanMap = new Map<string, UISpan>();\n const rootSpans: UISpan[] = [];\n\n spans.forEach(spanRecord => {\n const startDate = new Date(spanRecord.startedAt);\n const endDate = spanRecord.endedAt ? new Date(spanRecord.endedAt) : undefined;\n\n const uiSpan: UISpan = {\n id: spanRecord.spanId,\n name: spanRecord.name,\n type: spanRecord.spanType,\n latency: endDate ? endDate.getTime() - startDate.getTime() : 0,\n startTime: startDate.toISOString(),\n endTime: endDate ? endDate.toISOString() : undefined,\n spans: [],\n parentSpanId: spanRecord.parentSpanId,\n matchedInPayloadOnly: spanRecord.matchedInPayloadOnly,\n };\n\n spanMap.set(spanRecord.spanId, uiSpan);\n });\n\n const isAnchor = (spanRecord: TimelineSpan) =>\n anchorSpanId ? spanRecord.spanId === anchorSpanId : spanRecord?.parentSpanId == null;\n\n spans.forEach(spanRecord => {\n const uiSpan = spanMap.get(spanRecord.spanId);\n if (!uiSpan) return;\n\n if (isAnchor(spanRecord)) {\n rootSpans.push(uiSpan);\n } else {\n const parent = spanRecord.parentSpanId ? spanMap.get(spanRecord.parentSpanId) : undefined;\n if (parent) {\n parent.spans ??= [];\n parent.spans.push(uiSpan);\n } else {\n // Orphan: either the parent isn't in the supplied set (branch subtree boundary), or\n // the span has no parent yet wasn't picked as the anchor (rare when `anchorSpanId`\n // is specified). Surface it at the displayed root rather than dropping it.\n rootSpans.push(uiSpan);\n }\n }\n });\n\n const sortSpansByStartTime = (spans: UISpan[]): UISpan[] => {\n return spans.sort((a, b) => new Date(a.startTime).getTime() - new Date(b.startTime).getTime());\n };\n\n const sortedRootSpans = sortSpansByStartTime(rootSpans);\n\n const sortNestedSpans = (spans: UISpan[]): void => {\n spans.forEach(span => {\n if (span.spans && span.spans.length > 0) {\n span.spans = sortSpansByStartTime(span.spans);\n sortNestedSpans(span.spans);\n }\n });\n };\n\n sortNestedSpans(sortedRootSpans);\n\n const getLatestEndTime = (span: UISpan): number =>\n (span.spans ?? []).reduce(\n (latest, child) => Math.max(latest, getLatestEndTime(child)),\n span.endTime ? new Date(span.endTime).getTime() : 0,\n );\n\n // A root recorded as ending before one of its descendants is widened to cover its own subtree only.\n sortedRootSpans.forEach(rootSpan => {\n if (!rootSpan.endTime) return;\n const latestEndTime = getLatestEndTime(rootSpan);\n if (latestEndTime > new Date(rootSpan.endTime).getTime()) {\n rootSpan.endTime = new Date(latestEndTime).toISOString();\n rootSpan.latency = latestEndTime - new Date(rootSpan.startTime).getTime();\n }\n });\n\n return sortedRootSpans;\n};\n"],"names":["spans"],"mappings":"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"}
@@ -5,10 +5,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
  const jsxRuntime = require('react/jsx-runtime');
6
6
  const React = require('react');
7
7
  const domains_traces_hooks_getAllSpanIds = require('../hooks/get-all-span-ids.cjs.js');
8
+ const domains_traces_utils_spanTiming = require('../utils/span-timing.cjs.js');
8
9
  const domains_traces_components_shared = require('./shared.cjs.js');
9
10
 
10
11
  function SpanRows({ spans, ...rowProps }) {
11
- const overallLatency = spans[0]?.latency || 0;
12
+ const overallLatency = domains_traces_utils_spanTiming.getOverallLatency(spans);
12
13
  const overallStartTime = spans[0]?.startTime || "";
13
14
  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: spans.map((span, idx) => /* @__PURE__ */ jsxRuntime.jsx(
14
15
  SpanRow,
@@ -1 +1 @@
1
- {"version":3,"file":"span-rows.cjs.js","sources":["../../../../src/domains/traces/components/span-rows.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport { Fragment, useEffect } from 'react';\nimport { getSpanDescendantIds } from '../hooks/get-all-span-ids';\nimport type { UISpan, UISpanStyle } from '../types';\nimport { getSpanTypeUi } from './shared';\n\nexport type SpanRowExpansion = {\n hasChildren: boolean;\n numOfChildren: number;\n toggleChildren: () => void;\n};\n\nexport type SpanRowContext = {\n span: UISpan;\n spanUI: UISpanStyle | null | undefined;\n depth: number;\n isRootSpan: boolean;\n isLastChild: boolean;\n isExpanded: boolean;\n isSelected: boolean;\n isFaded: boolean;\n isRevealed: boolean;\n overallLatency: number;\n overallStartTime: string;\n onSpanClick?: (id: string) => void;\n expansion: SpanRowExpansion;\n};\n\ntype SharedRowProps = {\n renderRow: (ctx: SpanRowContext) => ReactNode;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n /** Row flagged as revealed once mounted (ancestors auto-expand when the span is featured). */\n revealSpanId?: string;\n fadedTypes?: string[];\n featuredSpanIds?: string[];\n expandedSpanIds?: string[];\n setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport type SpanRowsProps = SharedRowProps & {\n spans: UISpan[];\n};\n\n/**\n * Headless depth-first walker over a span hierarchy. Owns the expansion / fade /\n * reveal state of each row and delegates all markup to `renderRow`. Children are\n * only mounted while their parent is expanded.\n */\nexport function SpanRows({ spans, ...rowProps }: SpanRowsProps) {\n const overallLatency = spans[0]?.latency || 0;\n const overallStartTime = spans[0]?.startTime || '';\n\n return (\n <>\n {spans.map((span, idx) => (\n <SpanRow\n key={span.id}\n span={span}\n depth={0}\n isLastChild={idx === spans.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n {...rowProps}\n />\n ))}\n </>\n );\n}\n\ntype SpanRowProps = SharedRowProps & {\n span: UISpan;\n depth: number;\n isLastChild: boolean;\n overallLatency: number;\n overallStartTime: string;\n};\n\nfunction SpanRow({\n span,\n depth,\n isLastChild,\n overallLatency,\n overallStartTime,\n renderRow,\n onSpanClick,\n selectedSpanId,\n revealSpanId,\n fadedTypes,\n featuredSpanIds,\n expandedSpanIds,\n setExpandedSpanIds,\n}: SpanRowProps) {\n const hasChildren = Boolean(span.spans && span.spans.length > 0);\n const numOfChildren = span.spans ? span.spans.length : 0;\n const allDescendantIds = getSpanDescendantIds(span);\n const isRootSpan = depth === 0;\n const spanUI = getSpanTypeUi(span?.type);\n const isExpanded = expandedSpanIds ? expandedSpanIds.includes(span.id) : false;\n const isFadedBySearch = featuredSpanIds && featuredSpanIds.length > 0 ? !featuredSpanIds.includes(span.id) : false;\n const isFadedByType = fadedTypes && fadedTypes.length > 0 ? fadedTypes.includes(spanUI?.typePrefix || '') : false;\n const isFaded = isFadedByType || isFadedBySearch;\n\n useEffect(() => {\n if (!featuredSpanIds || allDescendantIds.length === 0) return;\n if (isExpanded) return;\n const hasFeaturedDescendant = allDescendantIds.some(id => featuredSpanIds.includes(id));\n if (hasFeaturedDescendant && setExpandedSpanIds) {\n setExpandedSpanIds(prev => (!prev || prev.includes(span.id) ? (prev ?? [span.id]) : [...prev, span.id]));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [featuredSpanIds, allDescendantIds]);\n\n const toggleChildren = () => {\n if (!setExpandedSpanIds) return;\n setExpandedSpanIds(prev => {\n if (!prev) return prev;\n return isExpanded ? prev.filter(id => id !== span.id) : [...prev, span.id];\n });\n };\n\n const ctx: SpanRowContext = {\n span,\n spanUI,\n depth,\n isRootSpan,\n isLastChild,\n isExpanded,\n isSelected: selectedSpanId === span.id,\n isFaded,\n isRevealed: revealSpanId === span.id,\n overallLatency,\n overallStartTime,\n onSpanClick,\n expansion: {\n hasChildren,\n numOfChildren,\n toggleChildren,\n },\n };\n\n return (\n <Fragment>\n {renderRow(ctx)}\n {hasChildren &&\n isExpanded &&\n span.spans?.map((childSpan, idx, array) => (\n <SpanRow\n key={childSpan.id}\n span={childSpan}\n depth={depth + 1}\n isLastChild={idx === array.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n renderRow={renderRow}\n onSpanClick={onSpanClick}\n selectedSpanId={selectedSpanId}\n revealSpanId={revealSpanId}\n fadedTypes={fadedTypes}\n featuredSpanIds={featuredSpanIds}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n />\n ))}\n </Fragment>\n );\n}\n"],"names":["jsx","Fragment","getSpanDescendantIds","getSpanTypeUi","useEffect","jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"span-rows.cjs.js","sources":["../../../../src/domains/traces/components/span-rows.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport { Fragment, useEffect } from 'react';\nimport { getSpanDescendantIds } from '../hooks/get-all-span-ids';\nimport type { UISpan, UISpanStyle } from '../types';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { getSpanTypeUi } from './shared';\n\nexport type SpanRowExpansion = {\n hasChildren: boolean;\n numOfChildren: number;\n toggleChildren: () => void;\n};\n\nexport type SpanRowContext = {\n span: UISpan;\n spanUI: UISpanStyle | null | undefined;\n depth: number;\n isRootSpan: boolean;\n isLastChild: boolean;\n isExpanded: boolean;\n isSelected: boolean;\n isFaded: boolean;\n isRevealed: boolean;\n overallLatency: number;\n overallStartTime: string;\n onSpanClick?: (id: string) => void;\n expansion: SpanRowExpansion;\n};\n\ntype SharedRowProps = {\n renderRow: (ctx: SpanRowContext) => ReactNode;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n /** Row flagged as revealed once mounted (ancestors auto-expand when the span is featured). */\n revealSpanId?: string;\n fadedTypes?: string[];\n featuredSpanIds?: string[];\n expandedSpanIds?: string[];\n setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport type SpanRowsProps = SharedRowProps & {\n spans: UISpan[];\n};\n\n/**\n * Headless depth-first walker over a span hierarchy. Owns the expansion / fade /\n * reveal state of each row and delegates all markup to `renderRow`. Children are\n * only mounted while their parent is expanded.\n */\nexport function SpanRows({ spans, ...rowProps }: SpanRowsProps) {\n const overallLatency = getOverallLatency(spans);\n const overallStartTime = spans[0]?.startTime || '';\n\n return (\n <>\n {spans.map((span, idx) => (\n <SpanRow\n key={span.id}\n span={span}\n depth={0}\n isLastChild={idx === spans.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n {...rowProps}\n />\n ))}\n </>\n );\n}\n\ntype SpanRowProps = SharedRowProps & {\n span: UISpan;\n depth: number;\n isLastChild: boolean;\n overallLatency: number;\n overallStartTime: string;\n};\n\nfunction SpanRow({\n span,\n depth,\n isLastChild,\n overallLatency,\n overallStartTime,\n renderRow,\n onSpanClick,\n selectedSpanId,\n revealSpanId,\n fadedTypes,\n featuredSpanIds,\n expandedSpanIds,\n setExpandedSpanIds,\n}: SpanRowProps) {\n const hasChildren = Boolean(span.spans && span.spans.length > 0);\n const numOfChildren = span.spans ? span.spans.length : 0;\n const allDescendantIds = getSpanDescendantIds(span);\n const isRootSpan = depth === 0;\n const spanUI = getSpanTypeUi(span?.type);\n const isExpanded = expandedSpanIds ? expandedSpanIds.includes(span.id) : false;\n const isFadedBySearch = featuredSpanIds && featuredSpanIds.length > 0 ? !featuredSpanIds.includes(span.id) : false;\n const isFadedByType = fadedTypes && fadedTypes.length > 0 ? fadedTypes.includes(spanUI?.typePrefix || '') : false;\n const isFaded = isFadedByType || isFadedBySearch;\n\n useEffect(() => {\n if (!featuredSpanIds || allDescendantIds.length === 0) return;\n if (isExpanded) return;\n const hasFeaturedDescendant = allDescendantIds.some(id => featuredSpanIds.includes(id));\n if (hasFeaturedDescendant && setExpandedSpanIds) {\n setExpandedSpanIds(prev => (!prev || prev.includes(span.id) ? (prev ?? [span.id]) : [...prev, span.id]));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [featuredSpanIds, allDescendantIds]);\n\n const toggleChildren = () => {\n if (!setExpandedSpanIds) return;\n setExpandedSpanIds(prev => {\n if (!prev) return prev;\n return isExpanded ? prev.filter(id => id !== span.id) : [...prev, span.id];\n });\n };\n\n const ctx: SpanRowContext = {\n span,\n spanUI,\n depth,\n isRootSpan,\n isLastChild,\n isExpanded,\n isSelected: selectedSpanId === span.id,\n isFaded,\n isRevealed: revealSpanId === span.id,\n overallLatency,\n overallStartTime,\n onSpanClick,\n expansion: {\n hasChildren,\n numOfChildren,\n toggleChildren,\n },\n };\n\n return (\n <Fragment>\n {renderRow(ctx)}\n {hasChildren &&\n isExpanded &&\n span.spans?.map((childSpan, idx, array) => (\n <SpanRow\n key={childSpan.id}\n span={childSpan}\n depth={depth + 1}\n isLastChild={idx === array.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n renderRow={renderRow}\n onSpanClick={onSpanClick}\n selectedSpanId={selectedSpanId}\n revealSpanId={revealSpanId}\n fadedTypes={fadedTypes}\n featuredSpanIds={featuredSpanIds}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n />\n ))}\n </Fragment>\n );\n}\n"],"names":["getOverallLatency","jsx","Fragment","getSpanDescendantIds","getSpanTypeUi","useEffect","jsxs"],"mappings":"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"}
@@ -1,10 +1,11 @@
1
1
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
2
2
  import { useEffect, Fragment as Fragment$1 } from 'react';
3
3
  import { getSpanDescendantIds } from '../hooks/get-all-span-ids.es.js';
4
+ import { getOverallLatency } from '../utils/span-timing.es.js';
4
5
  import { getSpanTypeUi } from './shared.es.js';
5
6
 
6
7
  function SpanRows({ spans, ...rowProps }) {
7
- const overallLatency = spans[0]?.latency || 0;
8
+ const overallLatency = getOverallLatency(spans);
8
9
  const overallStartTime = spans[0]?.startTime || "";
9
10
  return /* @__PURE__ */ jsx(Fragment, { children: spans.map((span, idx) => /* @__PURE__ */ jsx(
10
11
  SpanRow,
@@ -1 +1 @@
1
- {"version":3,"file":"span-rows.es.js","sources":["../../../../src/domains/traces/components/span-rows.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport { Fragment, useEffect } from 'react';\nimport { getSpanDescendantIds } from '../hooks/get-all-span-ids';\nimport type { UISpan, UISpanStyle } from '../types';\nimport { getSpanTypeUi } from './shared';\n\nexport type SpanRowExpansion = {\n hasChildren: boolean;\n numOfChildren: number;\n toggleChildren: () => void;\n};\n\nexport type SpanRowContext = {\n span: UISpan;\n spanUI: UISpanStyle | null | undefined;\n depth: number;\n isRootSpan: boolean;\n isLastChild: boolean;\n isExpanded: boolean;\n isSelected: boolean;\n isFaded: boolean;\n isRevealed: boolean;\n overallLatency: number;\n overallStartTime: string;\n onSpanClick?: (id: string) => void;\n expansion: SpanRowExpansion;\n};\n\ntype SharedRowProps = {\n renderRow: (ctx: SpanRowContext) => ReactNode;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n /** Row flagged as revealed once mounted (ancestors auto-expand when the span is featured). */\n revealSpanId?: string;\n fadedTypes?: string[];\n featuredSpanIds?: string[];\n expandedSpanIds?: string[];\n setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport type SpanRowsProps = SharedRowProps & {\n spans: UISpan[];\n};\n\n/**\n * Headless depth-first walker over a span hierarchy. Owns the expansion / fade /\n * reveal state of each row and delegates all markup to `renderRow`. Children are\n * only mounted while their parent is expanded.\n */\nexport function SpanRows({ spans, ...rowProps }: SpanRowsProps) {\n const overallLatency = spans[0]?.latency || 0;\n const overallStartTime = spans[0]?.startTime || '';\n\n return (\n <>\n {spans.map((span, idx) => (\n <SpanRow\n key={span.id}\n span={span}\n depth={0}\n isLastChild={idx === spans.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n {...rowProps}\n />\n ))}\n </>\n );\n}\n\ntype SpanRowProps = SharedRowProps & {\n span: UISpan;\n depth: number;\n isLastChild: boolean;\n overallLatency: number;\n overallStartTime: string;\n};\n\nfunction SpanRow({\n span,\n depth,\n isLastChild,\n overallLatency,\n overallStartTime,\n renderRow,\n onSpanClick,\n selectedSpanId,\n revealSpanId,\n fadedTypes,\n featuredSpanIds,\n expandedSpanIds,\n setExpandedSpanIds,\n}: SpanRowProps) {\n const hasChildren = Boolean(span.spans && span.spans.length > 0);\n const numOfChildren = span.spans ? span.spans.length : 0;\n const allDescendantIds = getSpanDescendantIds(span);\n const isRootSpan = depth === 0;\n const spanUI = getSpanTypeUi(span?.type);\n const isExpanded = expandedSpanIds ? expandedSpanIds.includes(span.id) : false;\n const isFadedBySearch = featuredSpanIds && featuredSpanIds.length > 0 ? !featuredSpanIds.includes(span.id) : false;\n const isFadedByType = fadedTypes && fadedTypes.length > 0 ? fadedTypes.includes(spanUI?.typePrefix || '') : false;\n const isFaded = isFadedByType || isFadedBySearch;\n\n useEffect(() => {\n if (!featuredSpanIds || allDescendantIds.length === 0) return;\n if (isExpanded) return;\n const hasFeaturedDescendant = allDescendantIds.some(id => featuredSpanIds.includes(id));\n if (hasFeaturedDescendant && setExpandedSpanIds) {\n setExpandedSpanIds(prev => (!prev || prev.includes(span.id) ? (prev ?? [span.id]) : [...prev, span.id]));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [featuredSpanIds, allDescendantIds]);\n\n const toggleChildren = () => {\n if (!setExpandedSpanIds) return;\n setExpandedSpanIds(prev => {\n if (!prev) return prev;\n return isExpanded ? prev.filter(id => id !== span.id) : [...prev, span.id];\n });\n };\n\n const ctx: SpanRowContext = {\n span,\n spanUI,\n depth,\n isRootSpan,\n isLastChild,\n isExpanded,\n isSelected: selectedSpanId === span.id,\n isFaded,\n isRevealed: revealSpanId === span.id,\n overallLatency,\n overallStartTime,\n onSpanClick,\n expansion: {\n hasChildren,\n numOfChildren,\n toggleChildren,\n },\n };\n\n return (\n <Fragment>\n {renderRow(ctx)}\n {hasChildren &&\n isExpanded &&\n span.spans?.map((childSpan, idx, array) => (\n <SpanRow\n key={childSpan.id}\n span={childSpan}\n depth={depth + 1}\n isLastChild={idx === array.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n renderRow={renderRow}\n onSpanClick={onSpanClick}\n selectedSpanId={selectedSpanId}\n revealSpanId={revealSpanId}\n fadedTypes={fadedTypes}\n featuredSpanIds={featuredSpanIds}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n />\n ))}\n </Fragment>\n );\n}\n"],"names":["Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"span-rows.es.js","sources":["../../../../src/domains/traces/components/span-rows.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport { Fragment, useEffect } from 'react';\nimport { getSpanDescendantIds } from '../hooks/get-all-span-ids';\nimport type { UISpan, UISpanStyle } from '../types';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { getSpanTypeUi } from './shared';\n\nexport type SpanRowExpansion = {\n hasChildren: boolean;\n numOfChildren: number;\n toggleChildren: () => void;\n};\n\nexport type SpanRowContext = {\n span: UISpan;\n spanUI: UISpanStyle | null | undefined;\n depth: number;\n isRootSpan: boolean;\n isLastChild: boolean;\n isExpanded: boolean;\n isSelected: boolean;\n isFaded: boolean;\n isRevealed: boolean;\n overallLatency: number;\n overallStartTime: string;\n onSpanClick?: (id: string) => void;\n expansion: SpanRowExpansion;\n};\n\ntype SharedRowProps = {\n renderRow: (ctx: SpanRowContext) => ReactNode;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n /** Row flagged as revealed once mounted (ancestors auto-expand when the span is featured). */\n revealSpanId?: string;\n fadedTypes?: string[];\n featuredSpanIds?: string[];\n expandedSpanIds?: string[];\n setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n};\n\nexport type SpanRowsProps = SharedRowProps & {\n spans: UISpan[];\n};\n\n/**\n * Headless depth-first walker over a span hierarchy. Owns the expansion / fade /\n * reveal state of each row and delegates all markup to `renderRow`. Children are\n * only mounted while their parent is expanded.\n */\nexport function SpanRows({ spans, ...rowProps }: SpanRowsProps) {\n const overallLatency = getOverallLatency(spans);\n const overallStartTime = spans[0]?.startTime || '';\n\n return (\n <>\n {spans.map((span, idx) => (\n <SpanRow\n key={span.id}\n span={span}\n depth={0}\n isLastChild={idx === spans.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n {...rowProps}\n />\n ))}\n </>\n );\n}\n\ntype SpanRowProps = SharedRowProps & {\n span: UISpan;\n depth: number;\n isLastChild: boolean;\n overallLatency: number;\n overallStartTime: string;\n};\n\nfunction SpanRow({\n span,\n depth,\n isLastChild,\n overallLatency,\n overallStartTime,\n renderRow,\n onSpanClick,\n selectedSpanId,\n revealSpanId,\n fadedTypes,\n featuredSpanIds,\n expandedSpanIds,\n setExpandedSpanIds,\n}: SpanRowProps) {\n const hasChildren = Boolean(span.spans && span.spans.length > 0);\n const numOfChildren = span.spans ? span.spans.length : 0;\n const allDescendantIds = getSpanDescendantIds(span);\n const isRootSpan = depth === 0;\n const spanUI = getSpanTypeUi(span?.type);\n const isExpanded = expandedSpanIds ? expandedSpanIds.includes(span.id) : false;\n const isFadedBySearch = featuredSpanIds && featuredSpanIds.length > 0 ? !featuredSpanIds.includes(span.id) : false;\n const isFadedByType = fadedTypes && fadedTypes.length > 0 ? fadedTypes.includes(spanUI?.typePrefix || '') : false;\n const isFaded = isFadedByType || isFadedBySearch;\n\n useEffect(() => {\n if (!featuredSpanIds || allDescendantIds.length === 0) return;\n if (isExpanded) return;\n const hasFeaturedDescendant = allDescendantIds.some(id => featuredSpanIds.includes(id));\n if (hasFeaturedDescendant && setExpandedSpanIds) {\n setExpandedSpanIds(prev => (!prev || prev.includes(span.id) ? (prev ?? [span.id]) : [...prev, span.id]));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [featuredSpanIds, allDescendantIds]);\n\n const toggleChildren = () => {\n if (!setExpandedSpanIds) return;\n setExpandedSpanIds(prev => {\n if (!prev) return prev;\n return isExpanded ? prev.filter(id => id !== span.id) : [...prev, span.id];\n });\n };\n\n const ctx: SpanRowContext = {\n span,\n spanUI,\n depth,\n isRootSpan,\n isLastChild,\n isExpanded,\n isSelected: selectedSpanId === span.id,\n isFaded,\n isRevealed: revealSpanId === span.id,\n overallLatency,\n overallStartTime,\n onSpanClick,\n expansion: {\n hasChildren,\n numOfChildren,\n toggleChildren,\n },\n };\n\n return (\n <Fragment>\n {renderRow(ctx)}\n {hasChildren &&\n isExpanded &&\n span.spans?.map((childSpan, idx, array) => (\n <SpanRow\n key={childSpan.id}\n span={childSpan}\n depth={depth + 1}\n isLastChild={idx === array.length - 1}\n overallLatency={overallLatency}\n overallStartTime={overallStartTime}\n renderRow={renderRow}\n onSpanClick={onSpanClick}\n selectedSpanId={selectedSpanId}\n revealSpanId={revealSpanId}\n fadedTypes={fadedTypes}\n featuredSpanIds={featuredSpanIds}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n />\n ))}\n </Fragment>\n );\n}\n"],"names":["Fragment"],"mappings":"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"}