From 42cc9f5d18a9d232541661018d2688624a3f18ee Mon Sep 17 00:00:00 2001
From: Evan Simkowitz <esimkowitz@users.noreply.github.com>
Date: Thu, 15 Aug 2024 15:03:15 -0700
Subject: [PATCH] disable drag when there's a magnified node

---
 frontend/app/theme.less            | 4 ++--
 frontend/layout/lib/TileLayout.tsx | 3 ++-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/frontend/app/theme.less b/frontend/app/theme.less
index 15e2e744..d0091a96 100644
--- a/frontend/app/theme.less
+++ b/frontend/app/theme.less
@@ -49,8 +49,8 @@
     --zindex-layout-last-magnified-node: 1;
     --zindex-layout-resize-handle: 2;
     --zindex-layout-placeholder-container: 3;
-    --zindex-layout-magnified-node: 4;
-    --zindex-layout-overlay-container: 5;
+    --zindex-layout-overlay-container: 4;
+    --zindex-layout-magnified-node: 5;
     --zindex-block-mask-inner: 10;
 
     // z-indexes in xterm.css
diff --git a/frontend/layout/lib/TileLayout.tsx b/frontend/layout/lib/TileLayout.tsx
index 3d0c00c4..eb2a5c59 100644
--- a/frontend/layout/lib/TileLayout.tsx
+++ b/frontend/layout/lib/TileLayout.tsx
@@ -183,11 +183,12 @@ const DisplayNode = ({ layoutModel, layoutNode, contents }: DisplayNodeProps) =>
         () => ({
             type: dragItemType,
             item: () => layoutNode,
+            canDrag: () => !layoutModel?.treeState?.magnifiedNodeId,
             collect: (monitor) => ({
                 isDragging: monitor.isDragging(),
             }),
         }),
-        [layoutNode]
+        [layoutNode, layoutGeneration]
     );
 
     const [previewElementGeneration, setPreviewElementGeneration] = useState(0);