From 588b590e1470810c7f36c6942b6de97881db66b5 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Fri, 28 Jan 2022 16:46:35 +0100
Subject: [PATCH] refactor(wrapnode): pass shallow clones to handlers

---
 src/components/Nodes/wrapNode.tsx | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/src/components/Nodes/wrapNode.tsx b/src/components/Nodes/wrapNode.tsx
index 05ce989e..b924d191 100644
--- a/src/components/Nodes/wrapNode.tsx
+++ b/src/components/Nodes/wrapNode.tsx
@@ -140,7 +140,7 @@ export default (NodeComponent: ComponentType<NodeProps>) => {
       (event: DraggableEvent) => {
         if (onNodeDragStart) {
           const node = store.getState().nodeInternals.get(id)!;
-          onNodeDragStart(event as MouseEvent, node);
+          onNodeDragStart(event as MouseEvent, { ...node });
         }
 
         if (selectNodesOnDrag && isSelectable) {
@@ -161,10 +161,18 @@ export default (NodeComponent: ComponentType<NodeProps>) => {
       (event: DraggableEvent, draggableData: DraggableData) => {
         if (onNodeDrag) {
           const node = store.getState().nodeInternals.get(id)!;
-          // node.position.x += draggableData.deltaX;
-          // node.position.y += draggableData.deltaY;
-
-          onNodeDrag(event as MouseEvent, node);
+          onNodeDrag(event as MouseEvent, {
+            ...node,
+            dragging: true,
+            position: {
+              x: node.position.x + draggableData.deltaX,
+              y: node.position.y + draggableData.deltaY,
+            },
+            positionAbsolute: {
+              x: (node.positionAbsolute?.x || 0) + draggableData.deltaX,
+              y: (node.positionAbsolute?.y || 0) + draggableData.deltaY,
+            },
+          });
         }
 
         updateNodePosition({ id, dragging: true, diff: { x: draggableData.deltaX, y: draggableData.deltaY } });
@@ -188,7 +196,7 @@ export default (NodeComponent: ComponentType<NodeProps>) => {
           }
 
           if (onClick && node) {
-            onClick(event as MouseEvent, node);
+            onClick(event as MouseEvent, { ...node });
           }
 
           return;
@@ -200,7 +208,7 @@ export default (NodeComponent: ComponentType<NodeProps>) => {
         });
 
         if (onNodeDragStop && node) {
-          onNodeDragStop(event as MouseEvent, node);
+          onNodeDragStop(event as MouseEvent, { ...node, dragging: false });
         }
       },
       [id, isSelectable, selectNodesOnDrag, onClick, onNodeDragStop, dragging, selected]
@@ -210,7 +218,7 @@ export default (NodeComponent: ComponentType<NodeProps>) => {
       (event: MouseEvent) => {
         if (onNodeDoubleClick) {
           const node = store.getState().nodeInternals.get(id)!;
-          onNodeDoubleClick(event, node);
+          onNodeDoubleClick(event, { ...node });
         }
       },
       [id, onNodeDoubleClick]