diff --git a/src/editor/js/components/editor.tsx b/src/editor/js/components/editor.tsx index 5000541dfe051c80b38a3e11be6dd3a35f0d6f80..cbfac5841defecf4309d2d84d4863ee5059ec47b 100644 --- a/src/editor/js/components/editor.tsx +++ b/src/editor/js/components/editor.tsx @@ -8,6 +8,7 @@ import { ToolDetails } from "./tooldetails"; import { SpaceSelect } from "./spaceselect"; import "./editor.css"; import ReactForceGraph2d from "react-force-graph-2d"; +import { Node } from "../structures/graph/node"; type propTypes = any; type stateTypes = { @@ -26,6 +27,7 @@ export class Editor extends React.PureComponent<propTypes, stateTypes> { super(props); this.loadGraph = this.loadGraph.bind(this); this.loadSpace = this.loadSpace.bind(this); + this.handleNodeClick = this.handleNodeClick.bind(this); // Set as new state this.state = { @@ -156,6 +158,10 @@ export class Editor extends React.PureComponent<propTypes, stateTypes> { }; } + private handleNodeClick(node: Node) { + node.delete(); + } + render(): React.ReactNode { // The id "ks-editor" indicates, that the javascript associated with this should automatically be executed return ( @@ -170,7 +176,11 @@ export class Editor extends React.PureComponent<propTypes, stateTypes> { <ToolDetails /> </div> {this.state.graph ? ( - <ReactForceGraph2d graphData={this.state.graph.data} /> + <ReactForceGraph2d + graphData={this.state.graph.data} + onNodeClick={this.handleNodeClick} + autoPauseRedraw={false} + /> ) : undefined} </div> </div>