diff --git a/src/visualProgrammingUI/components/NodeDefinitions.tsx b/src/visualProgrammingUI/components/NodeDefinitions.tsx index b78cf3d..9cd2ace 100644 --- a/src/visualProgrammingUI/components/NodeDefinitions.tsx +++ b/src/visualProgrammingUI/components/NodeDefinitions.tsx @@ -17,13 +17,14 @@ type phaseNodeData = defaultNodeData & { export type nodeData = defaultNodeData | startNodeData | phaseNodeData | endNodeData; -// Node Toolbar definition +// Node Toolbar definition, contains node delete functionality type ToolbarProps= { nodeId: string; + allowDelete: boolean; }; -export function Toolbar({nodeId}:ToolbarProps) { +export function Toolbar({nodeId, allowDelete}:ToolbarProps) { const { setNodes, setEdges } = useReactFlow(); const handleDelete = () => { @@ -32,13 +33,15 @@ export function Toolbar({nodeId}:ToolbarProps) { }; return ( - + ); } // Definitions of Nodes +// Start Node definition: + type StartNodeProps = { id: string; data: startNodeData; @@ -47,7 +50,7 @@ type StartNodeProps = { export const StartNode= ({ id, data }: StartNodeProps) => { return ( <> - +
data test {data.label}
@@ -56,6 +59,9 @@ export const StartNode= ({ id, data }: StartNodeProps) => { ); }; + +// End node definition: + type EndNodeProps = { id: string; data: endNodeData; @@ -64,7 +70,7 @@ type EndNodeProps = { export const EndNode= ({ id, data }: EndNodeProps) => { return ( <> - +
{data.label}
@@ -74,6 +80,8 @@ export const EndNode= ({ id, data }: EndNodeProps) => { }; +// Phase node definition: + type PhaseNodeProps = { id: string; data: phaseNodeData; @@ -82,7 +90,7 @@ type PhaseNodeProps = { export const PhaseNode= ({ id, data }: PhaseNodeProps) => { return ( <> - +
phase {data.number} {data.label}
@@ -93,6 +101,9 @@ export const PhaseNode= ({ id, data }: PhaseNodeProps) => { ); }; + +// Norm node definition: + type NormNodeProps = { id: string; data: normNodeData; @@ -101,7 +112,7 @@ type NormNodeProps = { export const NormNode= ({ id, data }: NormNodeProps) => { return ( <> - +
Norm {data.label}