refactor: moved delete logic out of the toolbar declaration and into the FlowStore.
BREAKING: changed type of FlowState ref: N25B-114
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import {Handle, NodeToolbar, Position, useReactFlow} from '@xyflow/react';
|
||||
import {Handle, NodeToolbar, Position} from '@xyflow/react';
|
||||
import '@xyflow/react/dist/style.css';
|
||||
import styles from '../../VisProg.module.css';
|
||||
import useFlowStore from "../VisProgStores.tsx";
|
||||
|
||||
// Contains the datatypes for the data inside our NodeTypes
|
||||
// this has to be improved or adapted to suit our implementation for computing the graph
|
||||
@@ -27,15 +28,14 @@ type ToolbarProps = {
|
||||
};
|
||||
|
||||
export function Toolbar({nodeId, allowDelete}: ToolbarProps) {
|
||||
const {setNodes, setEdges} = useReactFlow();
|
||||
const {deleteNode} = useFlowStore();
|
||||
|
||||
const handleDelete = () => {
|
||||
setNodes((nds) => nds.filter((n) => n.id !== nodeId));
|
||||
setEdges((eds) => eds.filter((e) => e.source !== nodeId && e.target !== nodeId));
|
||||
};
|
||||
const deleteParentNode = ()=> {
|
||||
deleteNode(nodeId);
|
||||
}
|
||||
return (
|
||||
<NodeToolbar>
|
||||
<button className="Node-toolbar__deletebutton" onClick={handleDelete} disabled={!allowDelete}>delete</button>
|
||||
<button className="Node-toolbar__deletebutton" onClick={deleteParentNode} disabled={!allowDelete}>delete</button>
|
||||
</NodeToolbar>);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user