admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Visualize workflow run step output (#10730)

Browse Source 
- Displays the output of the selected step in the `Output` tab
- Access to the `Output` tab is prevented when the selected node is
currently executed or was skipped
- Display the status of the workflow run instead of the status of the
workflow version at the top left corner of the workflow run visualizer
- Fixed the icon's color for disabled tabs
- Use text/primary color for the step's name even when the input is
disabled

## Demo: Successful execution


https://github.com/user-attachments/assets/02e492f3-1589-48e9-926e-7edb031d9210

## Demo: Failed execution


https://github.com/user-attachments/assets/73e5ec86-5f38-4306-aa9a-46b2e73950da

Closes https://github.com/twentyhq/core-team-issues/issues/434
This commit is contained in:
Baptiste Devessier
2025-03-07 17:35:39 +01:00
committed by GitHub
parent 0e1d742f3d
commit b49ec864b1
19 changed files with 219 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/modules/workflow/components/WorkflowRunVisualizer.tsx
View File

@ -1,5 +1,5 @@
import { WorkflowRunVisualizerContent } from '@/workflow/components/WorkflowRunVisualizerContent';
import { useWorkflowRun } from '@/workflow/hooks/useWorkflowRun';
import { WorkflowRunDiagramCanvas } from '@/workflow/workflow-diagram/components/WorkflowRunDiagramCanvas';
import styled from '@emotion/styled';
import { isDefined } from 'twenty-shared';
@ -19,7 +19,7 @@ export const WorkflowRunVisualizer = ({
return (
<StyledSourceCodeContainer>
<WorkflowRunVisualizerContent workflowRun={workflowRun} />
<WorkflowRunDiagramCanvas workflowRunStatus={workflowRun.status} />
</StyledSourceCodeContainer>
);
};

17
packages/twenty-front/src/modules/workflow/components/WorkflowRunVisualizerContent.tsx
View File

@ -1,17 +0,0 @@
import { useWorkflowVersion } from '@/workflow/hooks/useWorkflowVersion';
import { WorkflowRun } from '@/workflow/types/Workflow';
import { WorkflowRunDiagramCanvas } from '@/workflow/workflow-diagram/components/WorkflowRunDiagramCanvas';
import { isDefined } from 'twenty-shared';
export const WorkflowRunVisualizerContent = ({
workflowRun,
}: {
workflowRun: WorkflowRun;
}) => {
const workflowVersion = useWorkflowVersion(workflowRun.workflowVersionId);
if (!isDefined(workflowVersion)) {
return null;
}
return <WorkflowRunDiagramCanvas versionStatus={workflowVersion.status} />;
};