Skip to content

Commit 28af219

Browse files
committed
Show a table of triggered runs in the inspector
1 parent 84c38c1 commit 28af219

File tree

2 files changed

+125
-95
lines changed

2 files changed

+125
-95
lines changed

apps/webapp/app/presenters/v3/SpanPresenter.server.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -321,6 +321,13 @@ export class SpanPresenter extends BasePresenter {
321321
friendlyId: true,
322322
taskIdentifier: true,
323323
spanId: true,
324+
createdAt: true,
325+
number: true,
326+
lockedToVersion: {
327+
select: {
328+
version: true,
329+
},
330+
},
324331
},
325332
where: {
326333
parentSpanId: spanId,

apps/webapp/app/routes/resources.orgs.$organizationSlug.projects.v3.$projectParam.runs.$runParam.spans.$spanParam/route.tsx

Lines changed: 118 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,14 @@ import { Header2, Header3 } from "~/components/primitives/Headers";
1919
import { Paragraph } from "~/components/primitives/Paragraph";
2020
import * as Property from "~/components/primitives/PropertyTable";
2121
import { Spinner } from "~/components/primitives/Spinner";
22+
import {
23+
Table,
24+
TableBody,
25+
TableCell,
26+
TableHeader,
27+
TableHeaderCell,
28+
TableRow,
29+
} from "~/components/primitives/Table";
2230
import { TabButton, TabContainer } from "~/components/primitives/Tabs";
2331
import { TextLink } from "~/components/primitives/TextLink";
2432
import { InfoIconTooltip, SimpleTooltip } from "~/components/primitives/Tooltip";
@@ -28,6 +36,7 @@ import { RunTag } from "~/components/runs/v3/RunTag";
2836
import { SpanEvents } from "~/components/runs/v3/SpanEvents";
2937
import { SpanTitle } from "~/components/runs/v3/SpanTitle";
3038
import { TaskRunAttemptStatusCombo } from "~/components/runs/v3/TaskRunAttemptStatus";
39+
import { TaskRunsTable } from "~/components/runs/v3/TaskRunsTable";
3140
import { TaskRunStatusCombo } from "~/components/runs/v3/TaskRunStatus";
3241
import { useOrganization } from "~/hooks/useOrganizations";
3342
import { 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

Comments
 (0)