@@ -19,6 +19,14 @@ import { Header2, Header3 } from "~/components/primitives/Headers";
1919import { Paragraph } from "~/components/primitives/Paragraph" ;
2020import * as Property from "~/components/primitives/PropertyTable" ;
2121import { Spinner } from "~/components/primitives/Spinner" ;
22+ import {
23+ Table ,
24+ TableBody ,
25+ TableCell ,
26+ TableHeader ,
27+ TableHeaderCell ,
28+ TableRow ,
29+ } from "~/components/primitives/Table" ;
2230import { TabButton , TabContainer } from "~/components/primitives/Tabs" ;
2331import { TextLink } from "~/components/primitives/TextLink" ;
2432import { InfoIconTooltip , SimpleTooltip } from "~/components/primitives/Tooltip" ;
@@ -28,6 +36,7 @@ import { RunTag } from "~/components/runs/v3/RunTag";
2836import { SpanEvents } from "~/components/runs/v3/SpanEvents" ;
2937import { SpanTitle } from "~/components/runs/v3/SpanTitle" ;
3038import { TaskRunAttemptStatusCombo } from "~/components/runs/v3/TaskRunAttemptStatus" ;
39+ import { TaskRunsTable } from "~/components/runs/v3/TaskRunsTable" ;
3140import { TaskRunStatusCombo } from "~/components/runs/v3/TaskRunStatus" ;
3241import { useOrganization } from "~/hooks/useOrganizations" ;
3342import { useProject } from "~/hooks/useProject" ;
@@ -308,30 +317,45 @@ function SpanBody({
308317 </ Property . Item >
309318 { span . triggeredRuns . length > 0 && (
310319 < Property . Item >
311- < Property . Label > Triggered runs</ Property . Label >
312- < Property . Value >
313- { span . triggeredRuns . map ( ( run ) => (
314- < TextLink
315- to = { v3RunSpanPath (
316- organization ,
317- project ,
318- { friendlyId : run . friendlyId } ,
319- { spanId : run . spanId }
320- ) }
321- className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
322- >
323- { run . taskIdentifier }
324- < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
325- ({ run . friendlyId } )
326- </ span >
327- </ TextLink >
328- ) ) }
329- </ Property . Value >
320+ < div className = "flex flex-col gap-1.5" >
321+ < Header3 > Triggered runs</ Header3 >
322+ < Table >
323+ < TableHeader >
324+ < TableRow >
325+ < TableHeaderCell > Run #</ TableHeaderCell >
326+ < TableHeaderCell > Task</ TableHeaderCell >
327+ < TableHeaderCell > Version</ TableHeaderCell >
328+ < TableHeaderCell > Created at</ TableHeaderCell >
329+ </ TableRow >
330+ </ TableHeader >
331+ < TableBody >
332+ { span . triggeredRuns . map ( ( run ) => {
333+ const path = v3RunSpanPath (
334+ organization ,
335+ project ,
336+ { friendlyId : run . friendlyId } ,
337+ { spanId : run . spanId }
338+ ) ;
339+ return (
340+ < TableRow key = { run . friendlyId } >
341+ < TableCell to = { path } > { run . number } </ TableCell >
342+ < TableCell to = { path } > { run . taskIdentifier } </ TableCell >
343+ < TableCell to = { path } >
344+ { run . lockedToVersion ?. version ?? "–" }
345+ </ TableCell >
346+ < TableCell to = { path } >
347+ < DateTime date = { run . createdAt } />
348+ </ TableCell >
349+ </ TableRow >
350+ ) ;
351+ } ) }
352+ </ TableBody >
353+ </ Table >
354+ </ div >
330355 </ Property . Item >
331356 ) }
332357 </ Property . Table >
333-
334- { span . events !== undefined && < SpanEvents spanEvents = { span . events } /> }
358+ { span . events . length > 0 && < SpanEvents spanEvents = { span . events } /> }
335359 { span . properties !== undefined && (
336360 < CodeBlock
337361 rowTitle = "Properties"
@@ -448,6 +472,78 @@ function RunBody({
448472 />
449473 </ Property . Value >
450474 </ Property . Item >
475+ { run . relationships . root ? (
476+ run . relationships . root . isParent ? (
477+ < Property . Item >
478+ < Property . Label > Root & Parent </ Property . Label >
479+ < Property . Value >
480+ < TextLink
481+ to = { v3RunSpanPath (
482+ organization ,
483+ project ,
484+ {
485+ friendlyId : run . relationships . root . friendlyId ,
486+ } ,
487+ { spanId : run . relationships . root . spanId }
488+ ) }
489+ className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
490+ >
491+ { run . relationships . root . taskIdentifier }
492+ < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
493+ ({ run . relationships . root . friendlyId } )
494+ </ span >
495+ </ TextLink >
496+ </ Property . Value >
497+ </ Property . Item >
498+ ) : (
499+ < >
500+ < Property . Item >
501+ < Property . Label > Root</ Property . Label >
502+ < Property . Value >
503+ < TextLink
504+ to = { v3RunSpanPath (
505+ organization ,
506+ project ,
507+ {
508+ friendlyId : run . relationships . root . friendlyId ,
509+ } ,
510+ { spanId : run . relationships . root . spanId }
511+ ) }
512+ className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
513+ >
514+ { run . relationships . root . taskIdentifier }
515+ < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
516+ ({ run . relationships . root . friendlyId } )
517+ </ span >
518+ </ TextLink >
519+ </ Property . Value >
520+ </ Property . Item >
521+ { run . relationships . parent ? (
522+ < Property . Item >
523+ < Property . Label > Parent</ Property . Label >
524+ < Property . Value >
525+ < TextLink
526+ to = { v3RunSpanPath (
527+ organization ,
528+ project ,
529+ {
530+ friendlyId : run . relationships . parent . friendlyId ,
531+ } ,
532+ { spanId : run . relationships . parent . spanId }
533+ ) }
534+ className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
535+ >
536+ { run . relationships . parent . taskIdentifier }
537+ < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
538+ ({ run . relationships . parent . friendlyId } )
539+ </ span >
540+ </ TextLink >
541+ </ Property . Value >
542+ </ Property . Item >
543+ ) : null }
544+ </ >
545+ )
546+ ) : null }
451547 < Property . Item >
452548 < Property . Label > Version</ Property . Label >
453549 < Property . Value >
@@ -601,80 +697,7 @@ function RunBody({
601697 < TaskRunStatusCombo status = { run . status } className = "text-sm" />
602698 </ div >
603699 < RunTimeline run = { run } />
604- { run . relationships . root ? (
605- < Property . Table >
606- { run . relationships . root . isParent ? (
607- < Property . Item >
608- < Property . Label > Root & Parent </ Property . Label >
609- < Property . Value >
610- < TextLink
611- to = { v3RunSpanPath (
612- organization ,
613- project ,
614- {
615- friendlyId : run . relationships . root . friendlyId ,
616- } ,
617- { spanId : run . relationships . root . spanId }
618- ) }
619- className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
620- >
621- { run . relationships . root . taskIdentifier }
622- < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
623- ({ run . relationships . root . friendlyId } )
624- </ span >
625- </ TextLink >
626- </ Property . Value >
627- </ Property . Item >
628- ) : (
629- < >
630- < Property . Item >
631- < Property . Label > Root</ Property . Label >
632- < Property . Value >
633- < TextLink
634- to = { v3RunSpanPath (
635- organization ,
636- project ,
637- {
638- friendlyId : run . relationships . root . friendlyId ,
639- } ,
640- { spanId : run . relationships . root . spanId }
641- ) }
642- className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
643- >
644- { run . relationships . root . taskIdentifier }
645- < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
646- ({ run . relationships . root . friendlyId } )
647- </ span >
648- </ TextLink >
649- </ Property . Value >
650- </ Property . Item >
651- { run . relationships . parent ? (
652- < Property . Item >
653- < Property . Label > Parent</ Property . Label >
654- < Property . Value >
655- < TextLink
656- to = { v3RunSpanPath (
657- organization ,
658- project ,
659- {
660- friendlyId : run . relationships . parent . friendlyId ,
661- } ,
662- { spanId : run . relationships . parent . spanId }
663- ) }
664- className = "group flex flex-wrap items-center gap-x-1 gap-y-0"
665- >
666- { run . relationships . parent . taskIdentifier }
667- < span className = "break-all text-text-dimmed transition-colors group-hover:text-text-bright/80" >
668- ({ run . relationships . parent . friendlyId } )
669- </ span >
670- </ TextLink >
671- </ Property . Value >
672- </ Property . Item >
673- ) : null }
674- </ >
675- ) }
676- </ Property . Table >
677- ) : null }
700+
678701 { run . payload !== undefined && (
679702 < PacketDisplay data = { run . payload } dataType = { run . payloadType } title = "Payload" />
680703 ) }
0 commit comments