From d5b84afcc1e3a5facd5b1864e6d363e0ef1a0798 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Wed, 14 Apr 2021 09:57:23 +0200
Subject: [PATCH] chore(example): add edge double click to overview

---
 example/src/Overview/index.tsx    |  2 ++
 src/components/Edges/wrapEdge.tsx | 11 +++++++----
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/example/src/Overview/index.tsx b/example/src/Overview/index.tsx
index 27562904..c35eeb2a 100644
--- a/example/src/Overview/index.tsx
+++ b/example/src/Overview/index.tsx
@@ -45,6 +45,7 @@ const onEdgeContextMenu = (_: MouseEvent, edge: Edge) => console.log('edge conte
 const onEdgeMouseEnter = (_: MouseEvent, edge: Edge) => console.log('edge mouse enter', edge);
 const onEdgeMouseMove = (_: MouseEvent, edge: Edge) => console.log('edge mouse move', edge);
 const onEdgeMouseLeave = (_: MouseEvent, edge: Edge) => console.log('edge mouse leave', edge);
+const onEdgeDoubleClick = (_: MouseEvent, edge: Edge) => console.log('edge double click', edge);
 
 const initialElements: Elements = [
   {
@@ -187,6 +188,7 @@ const OverviewFlow = () => {
       onEdgeMouseEnter={onEdgeMouseEnter}
       onEdgeMouseMove={onEdgeMouseMove}
       onEdgeMouseLeave={onEdgeMouseLeave}
+      onEdgeDoubleClick={onEdgeDoubleClick}
     >
       <MiniMap nodeStrokeColor={nodeStrokeColor} nodeColor={nodeColor} nodeBorderRadius={2} />
       <Controls />
diff --git a/src/components/Edges/wrapEdge.tsx b/src/components/Edges/wrapEdge.tsx
index 0875ae17..d667f6b9 100644
--- a/src/components/Edges/wrapEdge.tsx
+++ b/src/components/Edges/wrapEdge.tsx
@@ -96,6 +96,13 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
       [elementsSelectable, edgeElement, onClick]
     );
 
+    const onEdgeDoubleClickHandler = useCallback(
+      (event: React.MouseEvent<SVGGElement, MouseEvent>) => {
+        onEdgeDoubleClick?.(event, edgeElement);
+      },
+      [edgeElement, onEdgeDoubleClick]
+    );
+
     const onEdgeContextMenu = useCallback(
       (event: React.MouseEvent<SVGGElement, MouseEvent>): void => {
         onContextMenu?.(event, edgeElement);
@@ -163,10 +170,6 @@ export default (EdgeComponent: ComponentType<EdgeProps>) => {
     const onEdgeUpdaterMouseEnter = useCallback(() => setUpdating(true), [setUpdating]);
     const onEdgeUpdaterMouseOut = useCallback(() => setUpdating(false), [setUpdating]);
 
-    const onEdgeDoubleClickHandler = useCallback((event: React.MouseEvent<SVGGElement, MouseEvent>) => {
-      onEdgeDoubleClick?.(event, edgeElement)
-    }, [edgeElement, onEdgeDoubleClick])
-
     if (isHidden) {
       return null;
     }