diff --git a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx index 1b4d200..5832401 100644 --- a/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx +++ b/src/pages/VisProgPage/visualProgrammingUI/nodes/NormNode.tsx @@ -1,6 +1,8 @@ // This program has been developed by students from the bachelor Computer Science at Utrecht // University within the Software Project course. // © Copyright Utrecht University (Department of Information and Computing Sciences) +import { useEffect } from "react"; +import type { EditorWarning } from "../components/EditorWarnings.tsx"; import { type NodeProps, Position, @@ -39,7 +41,7 @@ export type NormNode = Node */ export default function NormNode(props: NodeProps) { const data = props.data; - const {updateNodeData} = useFlowStore(); + const {updateNodeData, registerWarning, unregisterWarning} = useFlowStore(); const text_input_id = `norm_${props.id}_text_input`; const checkbox_id = `goal_${props.id}_checkbox`; @@ -47,10 +49,28 @@ export default function NormNode(props: NodeProps) { const setValue = (value: string) => { updateNodeData(props.id, {norm: value}); } + //this function is commented out, because of lack of backend implementation. + //If you wish to set critical norms, in the UI side, you can uncomment and use this function. + + // const setCritical = (value: boolean) => { + // updateNodeData(props.id, {...data, critical: value}); + // } + useEffect(() => { + const normText = data.norm || ""; + + const startsWithNumberWarning: EditorWarning = { + scope: { id: props.id }, + type: 'ELEMENT_STARTS_WITH_NUMBER', + severity: 'ERROR', + description: "Norms are not allowed to start with a number." + }; - const setCritical = (value: boolean) => { - updateNodeData(props.id, {...data, critical: value}); - } + if (/^\d/.test(normText)) { + registerWarning(startsWithNumberWarning); + } else { + unregisterWarning(props.id, 'ELEMENT_STARTS_WITH_NUMBER'); + } + }, [data.norm, props.id, registerWarning, unregisterWarning]); return <> @@ -64,7 +84,10 @@ export default function NormNode(props: NodeProps) { placeholder={"Pepper should ..."} /> -
+ {/*There is no backend implementation yet of how critical norms would + be treated differently than normal norms. The commented code below shows + how you could add the UI side, if you wish to implement */} + {/*
) { checked={data.critical || false} onChange={(e) => setCritical(e.target.checked)} /> -
+
*/} {data.condition && (
diff --git a/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx b/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx index 935ea55..bba51a6 100644 --- a/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx +++ b/test/pages/visProgPage/visualProgrammingUI/nodes/NormNode.test.tsx @@ -699,15 +699,12 @@ describe('NormNode', () => { /> ); - 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); + }); });