11'use client'
22
33import { useState } from 'react'
4- import {
5- ChevronDown ,
6- ChevronRight ,
7- Code ,
8- Cpu ,
9- ExternalLink ,
10- } from 'lucide-react'
4+ import { ChevronDown , ChevronRight , Code , Cpu , ExternalLink } from 'lucide-react'
115import {
126 AgentIcon ,
137 ApiIcon ,
@@ -201,17 +195,11 @@ export function TraceSpansDisplay({
201195 // Keep track of expanded spans
202196 const [ expandedSpans , setExpandedSpans ] = useState < Set < string > > ( new Set ( ) )
203197
204-
205-
206-
207-
208198 // Early return after all hooks
209199 if ( ! traceSpans || traceSpans . length === 0 ) {
210200 return < div className = 'text-muted-foreground text-sm' > No trace data available</ div >
211201 }
212202
213-
214-
215203 // Find the earliest start time among all spans to be the workflow start time
216204 const workflowStartTime = traceSpans . reduce ( ( earliest , span ) => {
217205 const startTime = new Date ( span . startTime ) . getTime ( )
@@ -244,8 +232,6 @@ export function TraceSpansDisplay({
244232 }
245233 }
246234
247-
248-
249235 return (
250236 < div className = 'w-full' >
251237 < div className = 'mb-2 flex items-center justify-between' >
@@ -329,8 +315,6 @@ function TraceSpanItem({
329315 const safeStartPercent = Math . min ( 100 , Math . max ( 0 , relativeStartPercent ) )
330316 const safeWidthPercent = Math . max ( 2 , Math . min ( 100 - safeStartPercent , actualDurationPercent ) )
331317
332-
333-
334318 // Handle click to expand/collapse this span
335319 const handleSpanClick = ( ) => {
336320 if ( hasNestedItems ) {
@@ -549,12 +533,12 @@ function TraceSpanItem({
549533 < div >
550534 { /* Block Input/Output Data */ }
551535 { ( span . input || span . output ) && (
552- < div className = 'mt-2 ml-8 mr-4 mb-4 space-y-3 overflow-hidden' >
536+ < div className = 'mt-2 mr-4 mb-4 ml-8 space-y-3 overflow-hidden' >
553537 { /* Input Data */ }
554538 { span . input && (
555539 < div >
556540 < h4 className = 'mb-2 font-medium text-muted-foreground text-xs' > Input</ h4 >
557- < div className = 'overflow-hidden rounded-md bg-secondary/30 p-3 mb-2 ' >
541+ < div className = 'mb-2 overflow-hidden rounded-md bg-secondary/30 p-3' >
558542 < BlockDataDisplay data = { span . input } blockType = { span . type } isInput = { true } />
559543 </ div >
560544 </ div >
@@ -566,7 +550,7 @@ function TraceSpanItem({
566550 < h4 className = 'mb-2 font-medium text-muted-foreground text-xs' >
567551 { span . status === 'error' ? 'Error Details' : 'Output' }
568552 </ h4 >
569- < div className = 'overflow-hidden rounded-md bg-secondary/30 p-3 mb-2 ' >
553+ < div className = 'mb-2 overflow-hidden rounded-md bg-secondary/30 p-3' >
570554 < BlockDataDisplay
571555 data = { span . output }
572556 blockType = { span . type }
0 commit comments