From 062e9e3f38333edc42e0b064804891fe2f1ec169 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Otgaar?= <b.r.c.otgaar@students.uu.nl>
Date: Wed, 10 Dec 2025 15:38:54 +0100
Subject: [PATCH 1/3] feat: add critical checkbox to the norm node, send it
 with the program, add test.

ref: N25B-390
---
 .../visualProgrammingUI/VisProgStores.tsx     |  2 +-
 .../nodes/NormNode.default.ts                 |  1 +
 .../visualProgrammingUI/nodes/NormNode.tsx    | 16 ++++++
 .../nodes/NormNode.test.tsx                   | 49 +++++++++++++++++++
 4 files changed, 67 insertions(+), 1 deletion(-)

diff --git a/src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx b/src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx
index 5bcd855..5154a8e 100644
--- a/src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx
+++ b/src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx
@@ -40,7 +40,7 @@ const initialNodes : Node[] = [
     createNode('start', 'start', {x: 100, y: 100}, {label: "Start"}, false),
     createNode('end', 'end', {x: 500, y: 100}, {label: "End"}, false),
     createNode('phase-1', 'phase',  {x:200, y:100}, {label: "Phase 1", children : []}),
-    createNode('norms-1', 'norm',  {x:-200, y:100}, {label: "Initial Norms", normList: ["Be a robot", "get good"]}),     
+    createNode('norms-1', 'norm',  {x:-200, y:100}, {label: "Initial Norms", normList: ["Be a robot", "get good"], critical:false}),     
 ];
 
 // * Initial edges * /
diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.default.ts b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.default.ts
index 12cb182..4b4a3ed 100644
--- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.default.ts
+++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.default.ts
@@ -8,4 +8,5 @@ export const NormNodeDefaults: NormNodeData = {
   droppable: true,
   norm: "",
   hasReduce: true,
+  critical: false,
 };
\ No newline at end of file
diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
index 31d92a5..59e9bc1 100644
--- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
+++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
@@ -21,6 +21,7 @@ export type NormNodeData = {
   droppable: boolean;
   norm: string;
   hasReduce: boolean;
+  critical: boolean;
 };
 
 export type NormNode = Node<NormNodeData>
@@ -35,11 +36,16 @@ export default function NormNode(props: NodeProps<NormNode>) {
   const {updateNodeData} = useFlowStore();
 
   const text_input_id = `norm_${props.id}_text_input`;
+  const checkbox_id = `goal_${props.id}_checkbox`;
 
   const setValue = (value: string) => {
     updateNodeData(props.id, {norm: value});
   }
 
+  const setAchieved = (value: boolean) => {
+    updateNodeData(props.id, {...data, critical: value});
+  }
+
   return <>
     <Toolbar nodeId={props.id} allowDelete={true}/>
     <div className={`${styles.defaultNode} ${styles.nodeNorm}`}>
@@ -52,6 +58,15 @@ export default function NormNode(props: NodeProps<NormNode>) {
           placeholder={"Pepper should ..."}
         />
       </div>
+      <div className={"flex-row gap-md align-center"}>
+        <label htmlFor={checkbox_id}>Critical:</label>
+        <input
+          id={checkbox_id}
+          type={"checkbox"}
+          checked={data.critical || false}
+          onChange={(e) => setAchieved(e.target.checked)}
+        />
+      </div>
       <Handle type="source" position={Position.Right} id="norms"/>
     </div>
   </>;
@@ -69,6 +84,7 @@ export function NormReduce(node: Node, _nodes: Node[]) {
       id: node.id,
       label: data.label,
       norm: data.norm,
+      critical: data.critical,
     }
 }
 
diff --git a/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx b/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx
index 25c9947..8cba780 100644
--- a/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx
+++ b/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx
@@ -94,6 +94,7 @@ describe('NormNode', () => {
           droppable: true,
           norm: '',
           hasReduce: true,
+          critical: false
         },
       };
 
@@ -622,6 +623,54 @@ describe('NormNode', () => {
       });
     });
 
+    it('should properly update the store when editing critical checkbox', async () => {
+      const mockNode: Node = {
+        id: 'norm-1',
+        type: 'norm',
+        position: { x: 0, y: 0 },
+        data: {
+          label: 'Test Norm',
+          droppable: true,
+          norm: '',
+          hasReduce: true,
+          critical: false,
+        },
+      };
+
+      useFlowStore.setState({
+        nodes: [mockNode],
+        edges: [],
+      });
+
+      renderWithProviders(
+        <NormNode
+          id={mockNode.id}
+          type={mockNode.type as string}
+          data={mockNode.data as any}
+          selected={false}
+          isConnectable={true}
+          zIndex={0}
+          dragging={false}
+          selectable={true}
+          deletable={true}
+          draggable={true}
+          positionAbsoluteX={0}
+          positionAbsoluteY={0}
+        />
+      );
+
+      const checkbox = screen.getByLabelText('Critical:');
+      await user.click(checkbox);
+
+      await waitFor(() => {
+        const state = useFlowStore.getState();
+        expect(state.nodes).toHaveLength(1);
+        expect(state.nodes[0].id).toBe('norm-1');
+        expect(state.nodes[0].data.norm).toBe('');
+        expect(state.nodes[0].data.critical).toBe(true);
+      });
+    });
+
     it('should not affect other nodes when updating one norm node', async () => {
       const norm1: Node = {
         id: 'norm-1',

From d5480f957b21f228ef5384c7fce85edf4d0ca886 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Otgaar?= <b.r.c.otgaar@students.uu.nl>
Date: Thu, 11 Dec 2025 09:54:34 +0000
Subject: [PATCH 2/3] Apply 1 suggestion(s) to 1 file(s)

Co-authored-by: Twirre <s.a.meulenbelt@students.uu.nl>
---
 src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
index 59e9bc1..14a5ca9 100644
--- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
+++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
@@ -42,7 +42,7 @@ export default function NormNode(props: NodeProps<NormNode>) {
     updateNodeData(props.id, {norm: value});
   }
 
-  const setAchieved = (value: boolean) => {
+  const setCritical = (value: boolean) => {
     updateNodeData(props.id, {...data, critical: value});
   }
 

From 62c8118650f6a6f3d044367b2f164d932e7d3223 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Otgaar?= <b.r.c.otgaar@students.uu.nl>
Date: Thu, 11 Dec 2025 09:54:39 +0000
Subject: [PATCH 3/3] Apply 1 suggestion(s) to 1 file(s)

Co-authored-by: Twirre <s.a.meulenbelt@students.uu.nl>
---
 src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
index 14a5ca9..29b5865 100644
--- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
+++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx
@@ -64,7 +64,7 @@ export default function NormNode(props: NodeProps<NormNode>) {
           id={checkbox_id}
           type={"checkbox"}
           checked={data.critical || false}
-          onChange={(e) => setAchieved(e.target.checked)}
+          onChange={(e) => setCritical(e.target.checked)}
         />
       </div>
       <Handle type="source" position={Position.Right} id="norms"/>