From 79b645df88a30e3b3555ab3b4d514bfd2c152b4e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bj=C3=B6rn=20Otgaar?= Date: Thu, 20 Nov 2025 14:53:42 +0100 Subject: [PATCH] chore: apply suggestions from threads for merge. --- src/pages/VisProgPage/VisProg.module.css | 25 ------------------- .../components/NodeComponents.tsx | 3 +-- .../visualProgrammingUI/nodes/EndNode.tsx | 2 +- .../visualProgrammingUI/nodes/GoalNode.tsx | 7 +++--- .../visualProgrammingUI/nodes/NormNode.tsx | 7 +++--- .../visualProgrammingUI/nodes/PhaseNode.tsx | 4 +-- .../visualProgrammingUI/nodes/StartNode.tsx | 14 ++++++++++- .../visualProgrammingUI/nodes/TriggerNode.tsx | 7 +++--- 8 files changed, 29 insertions(+), 40 deletions(-) diff --git a/src/pages/VisProgPage/VisProg.module.css b/src/pages/VisProgPage/VisProg.module.css index 7649429..250fba6 100644 --- a/src/pages/VisProgPage/VisProg.module.css +++ b/src/pages/VisProgPage/VisProg.module.css @@ -7,31 +7,6 @@ height: 100%; } - - -.node-text-input { - border: 1px solid transparent; - border-radius: 5pt; - padding: 4px 8px; - outline: none; - background-color: white; - transition: border-color 0.2s, box-shadow 0.2s; - cursor: text; -} - -.node-text-input:focus { - border-color: gainsboro; -} - -.node-text-input:read-only { - cursor: pointer; - background-color: whitesmoke; -} - -.node-text-input:read-only:hover { - border-color: gainsboro; -} - .dnd-panel { margin-inline-start: auto; margin-inline-end: auto; diff --git a/src/pages/VisProgPage/visualProgrammingUI/components/NodeComponents.tsx b/src/pages/VisProgPage/visualProgrammingUI/components/NodeComponents.tsx index 524d494..090fa38 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/components/NodeComponents.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/components/NodeComponents.tsx @@ -1,5 +1,4 @@ -import { - NodeToolbar} from '@xyflow/react'; +import { NodeToolbar } from '@xyflow/react'; import '@xyflow/react/dist/style.css'; import useFlowStore from "../VisProgStores.tsx"; diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/EndNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/EndNode.tsx index 3de153d..580499e 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/EndNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/EndNode.tsx @@ -23,7 +23,7 @@ export type EndNode = Node * @param props the node's properties * @returns React.JSX.Element */ -export default function EndNode(props: NodeProps) { +export default function EndNode(props: NodeProps) { return ( <> diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/GoalNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/GoalNode.tsx index 1461f6d..8cfa122 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/GoalNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/GoalNode.tsx @@ -32,8 +32,8 @@ export type GoalNode = Node * @param props NodeProps, like id, label, children * @returns React.JSX.Element */ -export default function GoalNode(props: NodeProps) { - const data = props.data as GoalNodeData; +export default function GoalNode(props: NodeProps) { + const data = props.data const {updateNodeData} = useFlowStore(); const text_input_id = `goal_${props.id}_text_input`; @@ -76,7 +76,8 @@ export default function GoalNode(props: NodeProps) { /** * Reduces each Goal, including its children down into its relevant data. - * @param props: The Node Properties of this node. + * @param node: The Node Properties of this node. + * @param nodes: all the nodes in the graph */ export function GoalReduce(node: Node, nodes: Node[]) { // Replace this for nodes functionality diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx index f9760af..5789cac 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx @@ -30,8 +30,8 @@ export type NormNode = Node * @param props NodeProps, like id, label, children * @returns React.JSX.Element */ -export default function NormNode(props: NodeProps) { - const data = props.data as NormNodeData; +export default function NormNode(props: NodeProps) { + const data = props.data; const {updateNodeData} = useFlowStore(); const text_input_id = `norm_${props.id}_text_input`; @@ -60,7 +60,8 @@ export default function NormNode(props: NodeProps) { /** * Reduces each Norm, including its children down into its relevant data. - * @param props: The Node Properties of this node. + * @param node: The Node Properties of this node. + * @param nodes: all the nodes in the graph */ export function NormReduce(node: Node, nodes: Node[]) { // Replace this for nodes functionality diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/PhaseNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/PhaseNode.tsx index 9285c61..7234e34 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/PhaseNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/PhaseNode.tsx @@ -31,8 +31,8 @@ export type PhaseNode = Node * @param props NodeProps, like id, label, children * @returns React.JSX.Element */ -export default function PhaseNode(props: NodeProps) { - const data = props.data as PhaseNodeData; +export default function PhaseNode(props: NodeProps) { + const data = props.data; const {updateNodeData} = useFlowStore(); const updateLabel = (value: string) => updateNodeData(props.id, {...data, label: value}); const label_input_id = `phase_${props.id}_label_input`; diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/StartNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/StartNode.tsx index 40e3865..6d74c08 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/StartNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/StartNode.tsx @@ -17,7 +17,13 @@ export type StartNodeData = { export type StartNode = Node -export default function StartNode(props: NodeProps) { + +/** + * Defines how a Norm node should be rendered + * @param props NodeProps, like id, label, children + * @returns React.JSX.Element + */ +export default function StartNode(props: NodeProps) { return ( <> @@ -31,6 +37,12 @@ export default function StartNode(props: NodeProps) { ); } +/** + * The reduce function for this node type. + * @param node this node + * @param nodes all the nodes in the graph + * @returns a reduced structure of this node + */ export function StartReduce(node: Node, nodes: Node[]) { // Replace this for nodes functionality if (nodes.length <= -1) { diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/TriggerNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/TriggerNode.tsx index 6752d73..a6f114e 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/TriggerNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/TriggerNode.tsx @@ -40,8 +40,8 @@ export function TriggerNodeCanConnect(connection: Connection | Edge): boolean { * @param props NodeProps, like id, label, children * @returns React.JSX.Element */ -export default function TriggerNode(props: NodeProps) { - const data = props.data as TriggerNodeData +export default function TriggerNode(props: NodeProps) { + const data = props.data; const {updateNodeData} = useFlowStore(); const setKeywords = (keywords: Keyword[]) => { @@ -67,7 +67,8 @@ export default function TriggerNode(props: NodeProps) { /** * Reduces each Trigger, including its children down into its relevant data. - * @param props: The Node Properties of this node. + * @param node: The Node Properties of this node. + * @param nodes: all the nodes in the graph. */ export function TriggerReduce(node: Node, nodes: Node[]) { // Replace this for nodes functionality