vodorod/Dorod-Sky
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add duration to workflow block timeline (#3107)

Browse Source
This commit is contained in:
Jonathan Dobson
2025-08-05 16:56:29 -04:00
committed by GitHub
parent 9c8ed3a701
commit 9fb6eb942f
3 changed files with 58 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx
View File

@@ -25,6 +25,7 @@ import { isTaskVariantBlock } from "../types/workflowTypes";
import { Link } from "react-router-dom";
import { useCallback } from "react";
import { Status } from "@/api/types";
import { formatDuration, toDuration } from "@/routes/workflows/utils";
import { ThoughtCard } from "./ThoughtCard";
import { ObserverThought } from "../types/workflowRunTypes";
type Props = {
@@ -85,6 +86,9 @@ function WorkflowRunTimelineBlockItem({
block.status === Status.TimedOut ||
block.status === Status.Canceled);
const duration =
block.duration !== null ? formatDuration(toDuration(block.duration)) : null;
return (
<div
className={cn(
@@ -115,7 +119,9 @@ function WorkflowRunTimelineBlockItem({
<span className="text-sm">
{workflowBlockTitle[block.block_type]}
</span>
<span className="text-xs text-slate-400">{block.label}</span>
<span className="flex gap-2 text-xs text-slate-400">
{block.label}
</span>
</div>
</div>
<div className="flex gap-2">
@@ -129,19 +135,26 @@ function WorkflowRunTimelineBlockItem({
<CheckCircledIcon className="size-4 text-success" />
</div>
)}
<div className="flex gap-1 self-start rounded bg-slate-elevation5 px-2 py-1">
{showDiagnosticLink ? (
<Link to={`/tasks/${block.task_id}/diagnostics`}>
<div className="flex gap-1">
<ExternalLinkIcon className="size-4" />
<span className="text-xs">Diagnostics</span>
</div>
</Link>
) : (
<>
<CubeIcon className="size-4" />
<span className="text-xs">Block</span>
</>
<div className="flex flex-col items-end gap-[1px]">
<div className="flex gap-1 self-start rounded bg-slate-elevation5 px-2 py-1">
{showDiagnosticLink ? (
<Link to={`/tasks/${block.task_id}/diagnostics`}>
<div className="flex gap-1">
<ExternalLinkIcon className="size-4" />
<span className="text-xs">Diagnostics</span>
</div>
</Link>
) : (
<>
<CubeIcon className="size-4" />
<span className="text-xs">Block</span>
</>
)}
</div>
{duration && (
<div className="pr-[5px] text-xs text-[#00ecff]">
{duration}
</div>
)}
</div>
</div>