diff --git a/app/components/debug-event.tsx b/app/components/debug-event.tsx index abc476b6..8d0d32a3 100644 --- a/app/components/debug-event.tsx +++ b/app/components/debug-event.tsx @@ -34,12 +34,14 @@ function formatDateTime(date: string | Date) { export function DebugEvent({ event, clusterId, + msSincePreviousEvent, }: { event: ClientInferResponseBody< typeof contract.getRunTimeline, 200 >["activity"][number]; clusterId: string; + msSincePreviousEvent: number; }) { const [eventMeta, setEventMeta] = useState(null); const [isLoading, setIsLoading] = useState(false); @@ -77,8 +79,11 @@ export function DebugEvent({

{startCase(event.type)}

- + {formatDateTime(event.createdAt)} + + {msSincePreviousEvent ? ` +${msSincePreviousEvent / 1000}s` : ""} + diff --git a/app/components/workflow.tsx b/app/components/workflow.tsx index f923732c..b3e28398 100644 --- a/app/components/workflow.tsx +++ b/app/components/workflow.tsx @@ -308,14 +308,27 @@ export function Run({ })) || []; const activityElements = - runTimeline?.activity.map((a) => ({ - element: ( - - - - ), - timestamp: new Date(a.createdAt).getTime(), - })) || []; + runTimeline?.activity + .sort((a, b) => (a.createdAt > b.createdAt ? 1 : -1)) + .map((a, index) => ({ + element: ( + + 0 + ? new Date(a.createdAt).getTime() - + new Date( + runTimeline?.activity[index - 1]?.createdAt ?? 0 + ).getTime() + : 0 + } + /> + + ), + timestamp: new Date(a.createdAt).getTime(), + })) || []; const testHeader = runTimeline?.run.test === true