Skip to content
Snippets Groups Projects
Commit 88ba7e21 authored by Matthias Konitzny's avatar Matthias Konitzny :fire:
Browse files

Fixed a few bugs related to bad props/state type checking.

parent 132e26ae
No related branches found
No related tags found
No related merge requests found
Pipeline #56964 passed
......@@ -41,6 +41,10 @@ export class GraphRenderer2D extends React.PureComponent<
constructor(props: InferType<typeof GraphRenderer2D.propTypes>) {
super(props);
this.handleNodeClick = this.handleNodeClick.bind(this);
this.handleEngineStop = this.handleEngineStop.bind(this);
this.handleNodeDrag = this.handleNodeDrag.bind(this);
this.handleElementRightClick = this.handleElementRightClick.bind(this);
this.screen2GraphCoords = this.screen2GraphCoords.bind(this);
this.handleNodeCanvasObject = this.handleNodeCanvasObject.bind(this);
this.handleLinkCanvasObject = this.handleLinkCanvasObject.bind(this);
......@@ -62,6 +66,7 @@ export class GraphRenderer2D extends React.PureComponent<
selectedNodes: [], // TODO: Why was undefined allowed here?
};
this.keys = {};
this.forceGraph = React.createRef();
}
......@@ -100,7 +105,7 @@ export class GraphRenderer2D extends React.PureComponent<
private handleNodeClick(node: Node) {
this.graphInFocus = true;
if (this.state.keys["Control"]) {
if (this.keys["Control"]) {
// Connect to clicked node as parent while control is pressed
if (this.state.selectedNodes.length == 0) {
// Have no node connected, so select
......@@ -109,7 +114,7 @@ export class GraphRenderer2D extends React.PureComponent<
// Already have *other* node/s selected, so connect
this.connectSelectionToNode(node);
}
} else if (this.state.keys["Shift"]) {
} else if (this.keys["Shift"]) {
this.toggleNodeSelection(node);
} else {
// By default, simply select node
......@@ -129,7 +134,7 @@ export class GraphRenderer2D extends React.PureComponent<
this.graphInFocus = true;
// Is there really no node there? Trying to prevent small error, where this event is triggered, even if there is a node.
const nearestNode = this.state.graph.getClosestNode(
const nearestNode = this.props.graph.getClosestNode(
position.graph.x,
position.graph.y
);
......@@ -139,7 +144,7 @@ export class GraphRenderer2D extends React.PureComponent<
}
// Just deselect if control key is pressed
if (this.state.keys["Control"]) {
if (this.keys["Control"]) {
this.props.onNodeSelectionChanged([]);
return;
}
......@@ -155,7 +160,7 @@ export class GraphRenderer2D extends React.PureComponent<
this.forceUpdate(); // TODO: Remove?
// Select newly created node
if (this.state.keys["Shift"]) {
if (this.keys["Shift"]) {
// Simply add to current selection of shift is pressed
this.toggleNodeSelection(node);
} else {
......@@ -177,22 +182,22 @@ export class GraphRenderer2D extends React.PureComponent<
* Propagates the changed state of the graph.
*/
private onGraphDataChange() {
const nodes: Node[] = this.state.selectedNodes.map((node: Node) =>
this.state.graph.node(node.id)
const nodes: Node[] = this.props.selectedNodes.map((node: Node) =>
this.props.graph.node(node.id)
);
this.props.onNodeSelectionChanged(nodes);
this.forceUpdate(); // TODO
}
private connectSelectionToNode(node: Node) {
if (this.state.selectedNodes.length == 0) {
if (this.props.selectedNodes.length == 0) {
return;
}
if (this.state.selectedNodes.length == 1) {
if (this.props.selectedNodes.length == 1) {
node.connect(this.state.selectedNodes[0]);
} else {
this.state.selectedNodes.forEach((selectedNode: Node) =>
this.props.selectedNodes.forEach((selectedNode: Node) =>
node.connect(selectedNode)
);
}
......@@ -200,7 +205,7 @@ export class GraphRenderer2D extends React.PureComponent<
private toggleNodeSelection(node: Node) {
// Convert selection to array as basis
let selection = this.state.selectedNodes;
let selection = this.props.selectedNodes;
// Add/Remove node
if (selection.includes(node)) {
......@@ -262,7 +267,7 @@ export class GraphRenderer2D extends React.PureComponent<
// TODO: Refactor
// add ring just for highlighted nodes
if (this.state.selectedNodes.includes(node)) {
if (this.props.selectedNodes.includes(node)) {
// Outer circle
ctx.beginPath();
ctx.arc(node.x, node.y, 4 * 0.7, 0, 2 * Math.PI, false);
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment