vikarti.anatra/Skyvern
1
0
Fork 0
mirror of https://github.com/Skyvern-AI/skyvern.git synced 2025-09-02 02:30:07 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Render nested blocks correctly in workflow run timeline (#2033)

Browse source
This commit is contained in:
Shuchang Zheng 2025-03-27 06:31:14 -07:00 • committed by GitHub
parent e601a87298
commit 578a56d649
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 39 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimeline.tsx
View file

@ -98,13 +98,12 @@ function WorkflowRunTimeline({
return (
<WorkflowRunTimelineBlockItem
key={timelineItem.block.workflow_run_block_id}
subBlocks={timelineItem.children
.filter((item) => item.type === "block")
.map((item) => item.block)}
subItems={timelineItem.children}
activeItem={activeItem}
block={timelineItem.block}
onActionClick={onActionItemSelected}
onBlockItemClick={onBlockItemSelected}
onThoughtCardClick={onObserverThoughtCardSelected}
/>
);
}

51
skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx
View file

@ -8,8 +8,12 @@ import { workflowBlockTitle } from "../editor/nodes/types";
import { WorkflowBlockIcon } from "../editor/nodes/WorkflowBlockIcon";
import {
isAction,
isBlockItem,
isObserverThought,
isThoughtItem,
isWorkflowRunBlock,
WorkflowRunBlock,
WorkflowRunTimelineItem,
} from "../types/workflowRunTypes";
import { ActionCard } from "./ActionCard";
import {
@ -21,21 +25,24 @@ import { isTaskVariantBlock } from "../types/workflowTypes";
import { Link } from "react-router-dom";
import { useCallback } from "react";
import { Status } from "@/api/types";
import { ThoughtCard } from "./ThoughtCard";
import { ObserverThought } from "../types/workflowRunTypes";
type Props = {
activeItem: WorkflowRunOverviewActiveElement;
block: WorkflowRunBlock;
subBlocks: Array<WorkflowRunBlock>;
subItems: Array<WorkflowRunTimelineItem>;
onBlockItemClick: (block: WorkflowRunBlock) => void;
onActionClick: (action: ActionItem) => void;
onThoughtCardClick: (thought: ObserverThought) => void;
};
function WorkflowRunTimelineBlockItem({
activeItem,
block,
subBlocks,
subItems,
onBlockItemClick,
onActionClick,
onThoughtCardClick,
}: Props) {
const actions = block.actions ?? [];
@ -164,17 +171,33 @@ function WorkflowRunTimelineBlockItem({
/>
);
})}
{subBlocks.map((block) => {
return (
<WorkflowRunTimelineBlockItem
key={block.workflow_run_block_id}
block={block}
activeItem={activeItem}
onActionClick={onActionClick}
onBlockItemClick={onBlockItemClick}
subBlocks={[]}
/>
);
{subItems.map((item) => {
if (isBlockItem(item)) {
return (
<WorkflowRunTimelineBlockItem
key={item.block.workflow_run_block_id}
subItems={item.children}
activeItem={activeItem}
block={item.block}
onActionClick={onActionClick}
onBlockItemClick={onBlockItemClick}
onThoughtCardClick={onThoughtCardClick}
/>
);
}
if (isThoughtItem(item)) {
return (
<ThoughtCard
key={item.thought.thought_id}
active={
isObserverThought(activeItem) &&
activeItem.thought_id === item.thought.thought_id
}
onClick={onThoughtCardClick}
thought={item.thought}
/>
);
}
})}
</div>
);