From 54b5935829974f19ef95325b87610524a8234a46 Mon Sep 17 00:00:00 2001
From: JGerla <jgerla61@gmail.com>
Date: Wed, 1 Oct 2025 10:55:24 +0200
Subject: [PATCH] feat: created new nodes and a default nodeType

added a type for defaultNodeData, this can house common data that all nodes should have. the other types can build on this defaultData. Also added an endNode and phaseNode to NodeDefinitions.tsx, together with a nodeData type for each new node type.

ref: N25B-114
---
 src/visualProgrammingUI/VisProgUI.tsx         | 18 ++++++---
 .../components/NodeDefinitions.tsx            | 37 ++++++++++++++++++-
 2 files changed, 47 insertions(+), 8 deletions(-)

diff --git a/src/visualProgrammingUI/VisProgUI.tsx b/src/visualProgrammingUI/VisProgUI.tsx
index ae526c6..48c987f 100644
--- a/src/visualProgrammingUI/VisProgUI.tsx
+++ b/src/visualProgrammingUI/VisProgUI.tsx
@@ -17,28 +17,34 @@ import {
     type Connection,
 } from '@xyflow/react';
 import '@xyflow/react/dist/style.css';
-import StartNode from "./components/NodeDefinitions.tsx";
+import {
+    StartNode,
+    EndNode,
+    PhaseNode
+} from "./components/NodeDefinitions.tsx";
 
 const nodeTypes = {
-    startNode: StartNode,
+    start: StartNode,
+    end: EndNode,
+    phase: PhaseNode,
 };
 
 const initialNodes = [
     {
         id: 'start',
-        type: 'startNode',
+        type: 'start',
         position: {x: 0, y: 0},
         data: {label: 'start'}
     },
     {
         id: 'genericPhase',
-        type: 'default',
+        type: 'phase',
         position: {x: 0, y: 150},
-        data: {label: 'Generic Phase'},
+        data: {label: 'Generic Phase', number: 1},
     },
     {
         id: 'end',
-        type: 'output',
+        type: 'end',
         position: {x: 0, y: 300},
         data: {label: 'End'}
     }
diff --git a/src/visualProgrammingUI/components/NodeDefinitions.tsx b/src/visualProgrammingUI/components/NodeDefinitions.tsx
index e9fc0b9..c3c011b 100644
--- a/src/visualProgrammingUI/components/NodeDefinitions.tsx
+++ b/src/visualProgrammingUI/components/NodeDefinitions.tsx
@@ -4,7 +4,17 @@ import '../VisProgUI.css';
 
 // Datatypes for NodeTypes
 
-type startNodeData = { label: string; };
+type defaultNodeData = {
+    label: string;
+};
+
+type startNodeData = defaultNodeData;
+type endNodeData = defaultNodeData;
+type phaseNodeData = defaultNodeData & {
+    number: number;
+};
+
+export type nodeData = defaultNodeData | startNodeData | phaseNodeData | endNodeData;
 
 // Definitions of Nodes
 
@@ -19,4 +29,27 @@ export const StartNode= ({ data } : {data : startNodeData}) => {
         </>
     );
 };
-export default StartNode;
\ No newline at end of file
+
+
+export const EndNode= ({ data } : {data : endNodeData}) => {
+    return (
+        <>
+            <div>
+                <div className="default-node"> {data.label} </div>
+                <Handle type="target" position={Position.Left} id="end" />
+            </div>
+        </>
+    );
+};
+
+export const PhaseNode= ({ data } : {data : phaseNodeData}) => {
+    return (
+        <>
+            <div>
+                <div className="default-node"> phase {data.number} {data.label} </div>
+                <Handle type="target" position={Position.Left} id="target" />
+                <Handle type="source" position={Position.Right} id="source" />
+            </div>
+        </>
+    );
+};