Addressed test results from Test_status_Wkf.md: **Issue #5: End-Node Überschriften** - Fixed aggregate_results to show node labels instead of "Node 10" - Added graph lookup to get node.data.label from node objects - Modified backend/workflow_executor.py (2 locations) **Issue #8: Löschen-Taste funktioniert nicht** - Added Delete key support to WorkflowCanvas - Set deleteKeyCode={['Backspace', 'Delete']} - Frontend: WorkflowCanvas.jsx **Issue #9: Mehrere End-Nodes verhindern** - Added validation error when multiple End-Nodes exist - Backend supports only 1 End-Node (aggregate_results takes last) - Frontend: workflowValidation.js **Issue #11: Export Fehler "Internal Server Error"** - Added missing fields to export-all endpoint: - graph_data (workflow node graph) - question_augmentations (analysis prompts) - Added missing fields to import endpoint - Proper JSON serialization for all JSONB fields - Backend: routers/prompts.py **Issue #12: Workflow duplizieren funktioniert nicht** - Fixed duplicate endpoint to include all prompt fields: - type, stages, output_format, output_schema - question_augmentations, graph_data (critical for workflows!) - Backend: routers/prompts.py Files changed: - backend/workflow_executor.py: Node label lookup in aggregate_results - backend/routers/prompts.py: Export/import/duplicate fixes - frontend/src/components/workflow/WorkflowCanvas.jsx: Delete key - frontend/src/utils/workflowValidation.js: Max 1 End-Node validation Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
73 lines
1.8 KiB
JavaScript
73 lines
1.8 KiB
JavaScript
import ReactFlow, { Background, Controls, MiniMap } from 'reactflow'
|
|
import 'reactflow/dist/style.css'
|
|
|
|
/**
|
|
* WorkflowCanvas - React Flow Wrapper Component
|
|
*
|
|
* Kapselt React Flow Setup (Background, Controls, MiniMap).
|
|
* Separation of Concerns: Canvas-Logik getrennt von Editor-Orchestrierung.
|
|
*
|
|
* Props:
|
|
* - nodes: Array of React Flow nodes
|
|
* - edges: Array of React Flow edges
|
|
* - nodeTypes: Object mapping node type to component
|
|
* - onNodesChange: Handler for node changes (drag, delete, etc.)
|
|
* - onEdgesChange: Handler for edge changes
|
|
* - onConnect: Handler for new edge connections
|
|
* - onNodeClick: Handler for node selection
|
|
*/
|
|
export function WorkflowCanvas({
|
|
nodes,
|
|
edges,
|
|
nodeTypes,
|
|
onNodesChange,
|
|
onEdgesChange,
|
|
onConnect,
|
|
onNodeClick
|
|
}) {
|
|
return (
|
|
<div style={{ width: '100%', height: '100%' }}>
|
|
<ReactFlow
|
|
nodes={nodes}
|
|
edges={edges}
|
|
onNodesChange={onNodesChange}
|
|
onEdgesChange={onEdgesChange}
|
|
onConnect={onConnect}
|
|
onNodeClick={onNodeClick}
|
|
nodeTypes={nodeTypes}
|
|
fitView
|
|
className="workflow-canvas"
|
|
minZoom={0.2}
|
|
maxZoom={2}
|
|
deleteKeyCode={['Backspace', 'Delete']}
|
|
defaultEdgeOptions={{
|
|
animated: false,
|
|
style: { strokeWidth: 2 },
|
|
deletable: true
|
|
}}
|
|
>
|
|
<Background
|
|
variant="dots"
|
|
gap={16}
|
|
size={1}
|
|
color="var(--border)"
|
|
/>
|
|
<Controls
|
|
showZoom={true}
|
|
showFitView={true}
|
|
showInteractive={true}
|
|
/>
|
|
<MiniMap
|
|
nodeStrokeWidth={3}
|
|
zoomable
|
|
pannable
|
|
style={{
|
|
backgroundColor: 'var(--surface)',
|
|
border: '1px solid var(--border)'
|
|
}}
|
|
/>
|
|
</ReactFlow>
|
|
</div>
|
|
)
|
|
}
|