diff --git a/skyvern-frontend/src/routes/workflows/types/workflowRunTypes.ts b/skyvern-frontend/src/routes/workflows/types/workflowRunTypes.ts index 48e0ef76..3cdb40ed 100644 --- a/skyvern-frontend/src/routes/workflows/types/workflowRunTypes.ts +++ b/skyvern-frontend/src/routes/workflows/types/workflowRunTypes.ts @@ -1,5 +1,6 @@ import { ActionsApiResponse, Status } from "@/api/types"; import { isTaskVariantBlock, WorkflowBlockType } from "./workflowTypes"; +import { ActionItem } from "../workflowRun/WorkflowRunOverview"; export const WorkflowRunTimelineItemTypes = { Thought: "thought", @@ -123,6 +124,17 @@ export function isAction(item: unknown): item is ActionsApiResponse { return typeof item === "object" && item !== null && "action_id" in item; } +export function isActionItem(item: unknown): item is ActionItem { + return ( + typeof item === "object" && + item !== null && + "block" in item && + isWorkflowRunBlock(item.block) && + "action" in item && + isAction(item.action) + ); +} + export function hasExtractedInformation( item: unknown, ): item is { extracted_information: unknown } { diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunOverview.tsx b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunOverview.tsx index 988254f6..bfa655b2 100644 --- a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunOverview.tsx +++ b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunOverview.tsx @@ -9,7 +9,7 @@ import { ActionScreenshot } from "@/routes/tasks/detail/ActionScreenshot"; import { WorkflowRunTimelineBlockItem } from "./WorkflowRunTimelineBlockItem"; import { ThoughtCard } from "./ThoughtCard"; import { - isAction, + isActionItem, isBlockItem, isObserverThought, isThoughtItem, @@ -24,8 +24,13 @@ import { WorkflowRunTimelineItemInfoSection } from "./WorkflowRunTimelineItemInf import { ObserverThoughtScreenshot } from "./ObserverThoughtScreenshot"; import { ScrollArea, ScrollAreaViewport } from "@/components/ui/scroll-area"; +export type ActionItem = { + block: WorkflowRunBlock; + action: ActionsApiResponse; +}; + export type WorkflowRunOverviewActiveElement = - | ActionsApiResponse + | ActionItem | ObserverThought | WorkflowRunBlock | "stream" @@ -68,9 +73,11 @@ function WorkflowRunOverview() { timelineItem.block.actions.length > 0 ) { const last = timelineItem.block.actions.length - 1; - return timelineItem.block.actions[ - last - ] as WorkflowRunOverviewActiveElement; + const actionItem: ActionItem = { + block: timelineItem.block, + action: timelineItem.block.actions[last]!, + }; + return actionItem; } return timelineItem.block; } @@ -89,10 +96,10 @@ function WorkflowRunOverview() {
{selection === "stream" && } - {selection !== "stream" && isAction(selection) && ( + {selection !== "stream" && isActionItem(selection) && ( )} {isWorkflowRunBlock(selection) && ( @@ -107,7 +114,7 @@ function WorkflowRunOverview() { )} - +
diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx index e1c31e29..ac7a6537 100644 --- a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx +++ b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx @@ -1,19 +1,21 @@ -import { ActionsApiResponse } from "@/api/types"; import { - isAction, + isActionItem, isWorkflowRunBlock, WorkflowRunBlock, } from "../types/workflowRunTypes"; import { ActionCard } from "./ActionCard"; import { BlockCard } from "./BlockCard"; -import { WorkflowRunOverviewActiveElement } from "./WorkflowRunOverview"; +import { + ActionItem, + WorkflowRunOverviewActiveElement, +} from "./WorkflowRunOverview"; type Props = { activeItem: WorkflowRunOverviewActiveElement; block: WorkflowRunBlock; subBlocks: Array; onBlockItemClick: (block: WorkflowRunBlock) => void; - onActionClick: (action: ActionsApiResponse) => void; + onActionClick: (action: ActionItem) => void; }; function WorkflowRunTimelineBlockItem({ @@ -33,11 +35,16 @@ function WorkflowRunTimelineBlockItem({ key={action.action_id} action={action} active={ - isAction(activeItem) && activeItem.action_id === action.action_id + isActionItem(activeItem) && + activeItem.action.action_id === action.action_id } index={actions.length - index} onClick={() => { - onActionClick(action); + const actionItem: ActionItem = { + block, + action, + }; + onActionClick(actionItem); }} /> ); diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineItemInfoSection.tsx b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineItemInfoSection.tsx index 0bff9fcd..29eafdb8 100644 --- a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineItemInfoSection.tsx +++ b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineItemInfoSection.tsx @@ -1,11 +1,10 @@ -import { ActionsApiResponse, Status } from "@/api/types"; +import { Status } from "@/api/types"; import { hasExtractedInformation, isAction, + isActionItem, isObserverThought, isWorkflowRunBlock, - ObserverThought, - WorkflowRunBlock, } from "../types/workflowRunTypes"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import { CodeEditor } from "../components/CodeEditor"; @@ -13,17 +12,15 @@ import { AutoResizingTextarea } from "@/components/AutoResizingTextarea/AutoResi import { WorkflowBlockTypes } from "../types/workflowTypes"; import { statusIsAFailureType } from "@/routes/tasks/types"; import { SendEmailBlockInfo } from "./blockInfo/SendEmailBlockInfo"; +import { WorkflowRunOverviewActiveElement } from "./WorkflowRunOverview"; type Props = { - item: - | ActionsApiResponse - | ObserverThought - | WorkflowRunBlock - | "stream" - | null; + activeItem: WorkflowRunOverviewActiveElement; }; -function WorkflowRunTimelineItemInfoSection({ item }: Props) { +function WorkflowRunTimelineItemInfoSection({ activeItem }: Props) { + const item = isActionItem(activeItem) ? activeItem.block : activeItem; + if (!item) { return null; }