From 6d2221b05893f067e7fa027c927e1f0908fe8ade Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Fri, 5 Mar 2021 20:57:50 +0100
Subject: [PATCH] fix(edges): unset nodes selection on click closes #966

---
 src/components/Edges/wrapEdge.tsx | 16 ++++------------
 1 file changed, 4 insertions(+), 12 deletions(-)

diff --git a/src/components/Edges/wrapEdge.tsx b/src/components/Edges/wrapEdge.tsx
index 4fbda394..3f2fc7c8 100644
--- a/src/components/Edges/wrapEdge.tsx
+++ b/src/components/Edges/wrapEdge.tsx
@@ -43,6 +43,7 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
   }: WrapEdgeProps): JSX.Element | null => {
     const addSelectedElements = useStoreActions((actions) => actions.addSelectedElements);
     const setConnectionNodeId = useStoreActions((actions) => actions.setConnectionNodeId);
+    const unsetNodesSelection = useStoreActions((actions) => actions.unsetNodesSelection);
     const setPosition = useStoreActions((actions) => actions.setConnectionPosition);
     const connectionMode = useStoreState((state) => state.connectionMode);
 
@@ -82,6 +83,7 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
     const onEdgeClick = useCallback(
       (event: React.MouseEvent<SVGGElement, MouseEvent>): void => {
         if (elementsSelectable) {
+          unsetNodesSelection();
           addSelectedElements(edgeElement);
         }
 
@@ -148,12 +150,7 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
             onMouseEnter={onEdgeUpdaterMouseEnter}
             onMouseOut={onEdgeUpdaterMouseOut}
           >
-            <EdgeAnchor
-              position={sourcePosition}
-              centerX={sourceX}
-              centerY={sourceY}
-              radius={edgeUpdaterRadius}
-            />
+            <EdgeAnchor position={sourcePosition} centerX={sourceX} centerY={sourceY} radius={edgeUpdaterRadius} />
           </g>
         )}
         <EdgeComponent
@@ -187,12 +184,7 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
             onMouseEnter={onEdgeUpdaterMouseEnter}
             onMouseOut={onEdgeUpdaterMouseOut}
           >
-            <EdgeAnchor
-              position={targetPosition}
-              centerX={targetX}
-              centerY={targetY}
-              radius={edgeUpdaterRadius}
-            />
+            <EdgeAnchor position={targetPosition} centerX={targetX} centerY={targetY} radius={edgeUpdaterRadius} />
           </g>
         )}
       </g>