feat: added undo and redo functionality

This commit is contained in:
Gerla, J. (Justin)
2025-12-07 15:21:59 +00:00
committed by JobvAlewijk
parent 608bd54617
commit 5e22ed8806
9 changed files with 490 additions and 51 deletions

View File

@@ -32,23 +32,22 @@ export type GoalNode = Node<GoalNodeData>
* @param props NodeProps, like id, label, children
* @returns React.JSX.Element
*/
export default function GoalNode(props: NodeProps<GoalNode>) {
const data = props.data
export default function GoalNode({id, data}: NodeProps<GoalNode>) {
const {updateNodeData} = useFlowStore();
const text_input_id = `goal_${props.id}_text_input`;
const checkbox_id = `goal_${props.id}_checkbox`;
const text_input_id = `goal_${id}_text_input`;
const checkbox_id = `goal_${id}_checkbox`;
const setDescription = (value: string) => {
updateNodeData(props.id, {...data, description: value});
updateNodeData(id, {...data, description: value});
}
const setAchieved = (value: boolean) => {
updateNodeData(props.id, {...data, achieved: value});
updateNodeData(id, {...data, achieved: value});
}
return <>
<Toolbar nodeId={props.id} allowDelete={true}/>
<Toolbar nodeId={id} allowDelete={true}/>
<div className={`${styles.defaultNode} ${styles.nodeGoal} flex-col gap-sm`}>
<div className={"flex-row gap-md"}>
<label htmlFor={text_input_id}>Goal:</label>
@@ -64,7 +63,7 @@ export default function GoalNode(props: NodeProps<GoalNode>) {
<input
id={checkbox_id}
type={"checkbox"}
value={data.achieved ? "checked" : ""}
checked={data.achieved || false}
onChange={(e) => setAchieved(e.target.checked)}
/>
</div>