feat: Click on svg background to terminate edge creation [PT-185596253]

concord-consortium · Jul 13, 2023 · ade7ca1 · ade7ca1
1 parent 9c709ad
commit ade7ca1
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/src/components/drawing.tsx b/src/components/drawing.tsx
@@ -186,8 +186,14 @@ export const Drawing = (props: Props) => {
     if (drawingMode === "addNode") {
       addNode(translateToGraphPoint(e));
       handleSetSelectMode();
+    } else if (drawingMode === "addEdge") {
+      const onSVGBackground = ((e.target as HTMLElement)?.tagName || "").toLowerCase() === "svg";
+      if (onSVGBackground) {
+        clearSelections();
+        handleSetSelectMode();
+      }
     }
-  }, [drawingMode, addNode, handleSetSelectMode]);
+  }, [drawingMode, addNode, handleSetSelectMode, clearSelections]);
 
   // allow nodes to be "dragged" from the toolbar to the canvas
   const handleMouseUp = useCallback((e: React.MouseEvent<HTMLDivElement>) => {