diff --git a/src/pages/VisProgPage/visualProgrammingUI/components/NodeDefinitions.tsx b/src/pages/VisProgPage/visualProgrammingUI/components/NodeDefinitions.tsx index 9cd2ace..8909093 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/components/NodeDefinitions.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/components/NodeDefinitions.tsx @@ -5,36 +5,36 @@ import '../VisProgUI.css'; // Datatypes for NodeTypes type defaultNodeData = { - label: string; + label: string; }; type startNodeData = defaultNodeData; type endNodeData = defaultNodeData; type normNodeData = defaultNodeData; type phaseNodeData = defaultNodeData & { - number: number; + number: number; }; export type nodeData = defaultNodeData | startNodeData | phaseNodeData | endNodeData; // Node Toolbar definition, contains node delete functionality -type ToolbarProps= { - nodeId: string; - allowDelete: boolean; +type ToolbarProps = { + nodeId: string; + allowDelete: boolean; }; -export function Toolbar({nodeId, allowDelete}:ToolbarProps) { - const { setNodes, setEdges } = useReactFlow(); +export function Toolbar({nodeId, allowDelete}: ToolbarProps) { + const {setNodes, setEdges} = useReactFlow(); - const handleDelete = () => { - setNodes((nds) => nds.filter((n) => n.id !== nodeId)); - setEdges((eds) => eds.filter((e) => e.source !== nodeId && e.target !== nodeId)); - }; - return ( - - delete - ); + const handleDelete = () => { + setNodes((nds) => nds.filter((n) => n.id !== nodeId)); + setEdges((eds) => eds.filter((e) => e.source !== nodeId && e.target !== nodeId)); + }; + return ( + + delete + ); } @@ -43,80 +43,80 @@ export function Toolbar({nodeId, allowDelete}:ToolbarProps) { // Start Node definition: type StartNodeProps = { - id: string; - data: startNodeData; + id: string; + data: startNodeData; }; -export const StartNode= ({ id, data }: StartNodeProps) => { - return ( - <> - - - data test {data.label} - - - > - ); +export const StartNode = ({id, data}: StartNodeProps) => { + return ( + <> + + + data test {data.label} + + + > + ); }; // End node definition: type EndNodeProps = { - id: string; - data: endNodeData; + id: string; + data: endNodeData; }; -export const EndNode= ({ id, data }: EndNodeProps) => { - return ( - <> - - - {data.label} - - - > - ); +export const EndNode = ({id, data}: EndNodeProps) => { + return ( + <> + + + {data.label} + + + > + ); }; // Phase node definition: type PhaseNodeProps = { - id: string; - data: phaseNodeData; + id: string; + data: phaseNodeData; }; -export const PhaseNode= ({ id, data }: PhaseNodeProps) => { - return ( - <> - - - phase {data.number} {data.label} - - - - - > - ); +export const PhaseNode = ({id, data}: PhaseNodeProps) => { + return ( + <> + + + phase {data.number} {data.label} + + + + + > + ); }; // Norm node definition: type NormNodeProps = { - id: string; - data: normNodeData; + id: string; + data: normNodeData; }; -export const NormNode= ({ id, data }: NormNodeProps) => { - return ( - <> - - - Norm {data.label} - - - > - ); +export const NormNode = ({id, data}: NormNodeProps) => { + return ( + <> + + + Norm {data.label} + + + > + ); }; \ No newline at end of file