In this PR: - Refactored components to clarify their behavior. For example, I renamed the `Workflow` component to `WorkflowVisualizer`. This moved forward the issue #7010. - Create two variants of several workflow-related components: one version for editing and another for viewing. For instance, there is `WorkflowDiagramCanvasEditable.tsx` and `WorkflowDiagramCanvasReadonly.tsx` - Implement the show page for workflow versions. On this page, we display a readonly workflow visualizer. Users can click on nodes and it will expand the right drawer. - I added buttons in the header of the RecordShowPage for workflow versions: users can activate, deactivate or use the currently viewed version as the next draft. **There are many cache desynchronisation and I'll fix them really soon.** ## Demo (Turn sound on) https://github.com/user-attachments/assets/97fafa48-8902-4dab-8b39-f40848bf041e
29 lines
1.0 KiB
TypeScript
29 lines
1.0 KiB
TypeScript
import { WorkflowDiagramCanvasBase } from '@/workflow/components/WorkflowDiagramCanvasBase';
|
|
import { WorkflowDiagramCanvasReadonlyEffect } from '@/workflow/components/WorkflowDiagramCanvasReadonlyEffect';
|
|
import { WorkflowDiagramEmptyTrigger } from '@/workflow/components/WorkflowDiagramEmptyTrigger';
|
|
import { WorkflowDiagramStepNodeReadonly } from '@/workflow/components/WorkflowDiagramStepNodeReadonly';
|
|
import { WorkflowVersion } from '@/workflow/types/Workflow';
|
|
import { WorkflowDiagram } from '@/workflow/types/WorkflowDiagram';
|
|
|
|
export const WorkflowDiagramCanvasReadonly = ({
|
|
diagram,
|
|
workflowVersion,
|
|
}: {
|
|
diagram: WorkflowDiagram;
|
|
workflowVersion: WorkflowVersion;
|
|
}) => {
|
|
return (
|
|
<WorkflowDiagramCanvasBase
|
|
key={workflowVersion.id}
|
|
diagram={diagram}
|
|
status={workflowVersion.status}
|
|
nodeTypes={{
|
|
default: WorkflowDiagramStepNodeReadonly,
|
|
'empty-trigger': WorkflowDiagramEmptyTrigger,
|
|
}}
|
|
>
|
|
<WorkflowDiagramCanvasReadonlyEffect />
|
|
</WorkflowDiagramCanvasBase>
|
|
);
|
|
};
|