feat: changed startNode to use custom type for data

changed to startNode file to be a general file for custom node types, and created a custom type for the data property of StartNode.

BREAKING: renamed StartNode.tsx to NodeDefinitions.tsx

ref: N25B-114
This commit is contained in:
JGerla
2025-10-01 10:38:35 +02:00
parent e098ffebd6
commit b991e92c37
3 changed files with 19 additions and 5 deletions

View File

@@ -0,0 +1,7 @@
.default-node {
padding: 10px 20px;
background-color: white;
outline-style: solid;
border-radius: 5pt;
outline-width: 1pt;
}

View File

@@ -17,7 +17,7 @@ import {
type Connection,
} from '@xyflow/react';
import '@xyflow/react/dist/style.css';
import StartNode from './components/StartNode.tsx';
import StartNode from "./components/NodeDefinitions.tsx";
const nodeTypes = {
startNode: StartNode,
@@ -28,7 +28,7 @@ const initialNodes = [
id: 'start',
type: 'startNode',
position: {x: 0, y: 0},
data: {label: 'Start'},
data: {label: 'start'}
},
{
id: 'genericPhase',

View File

@@ -1,12 +1,19 @@
import { Handle, Position } from '@xyflow/react';
import '@xyflow/react/dist/style.css';
import '../VisProgUI.css';
// @ts-ignore
export const StartNode = ({ data }) => {
// Datatypes for NodeTypes
type startNodeData = { label: string; };
// Definitions of Nodes
export const StartNode= ({ data } : {data : startNodeData}) => {
return (
<>
<div>
<div style={{ padding: '10px 20px', backgroundColor: 'white', outlineStyle: 'solid', borderRadius: '5pt', outlineWidth: '1pt'}}> data test {data.label} </div>
<div className="default-node"> data test {data.label} </div>
<Handle type="source" position={Position.Right} id="start" />
</div>
</>