From 04db0a108b86aad40a44c7f34786c3f1b3b4ed26 Mon Sep 17 00:00:00 2001
From: Hebi Li <lihebi.com@gmail.com>
Date: Tue, 2 May 2023 22:25:27 -0700
Subject: [PATCH] fix: drag on toolbar handle into a scope (#253)

---
 ui/src/App.css               |  6 +++---
 ui/src/components/Canvas.tsx | 11 -----------
 2 files changed, 3 insertions(+), 14 deletions(-)

diff --git a/ui/src/App.css b/ui/src/App.css
index 4c9065d4..8659b58d 100644
--- a/ui/src/App.css
+++ b/ui/src/App.css
@@ -75,15 +75,15 @@
   text-decoration: wavy underline red;
 }
 
-.react-flow__node-scope.active {
+.react-flow__node-SCOPE.active {
   box-shadow: 0px 0px 12px 0px rgba(100, 100, 100, 0.9);
 }
 
-.react-flow__node-scope.selected {
+.react-flow__node-SCOPE.selected {
   box-shadow: 0px 0px 8px 0px rgba(100, 100, 100, 0.5);
 }
 
-.react-flow__node-scope.selected {
+.react-flow__node-SCOPE.selected {
   border-width: 2px;
 }
 
diff --git a/ui/src/components/Canvas.tsx b/ui/src/components/Canvas.tsx
index 76f4367b..7bbaeb46 100644
--- a/ui/src/components/Canvas.tsx
+++ b/ui/src/components/Canvas.tsx
@@ -588,17 +588,6 @@ function CanvasImpl() {
           onNodeDragStop={(event, node) => {
             removeDragHighlight();
             let mousePos = project({ x: event.clientX, y: event.clientY });
-            // check if the mouse is still inside this node. If not, the user
-            // has beenn trying to move a pod out.
-            if (
-              mousePos.x < node.positionAbsolute!.x ||
-              mousePos.y < node.positionAbsolute!.y ||
-              mousePos.x > node.positionAbsolute!.x + node.width! ||
-              mousePos.y > node.positionAbsolute!.y + node.height!
-            ) {
-              console.log("Cannot drop outside parent scope");
-              return;
-            }
             let scope = getScopeAtPos(mousePos, node.id);
             if (scope && scope.id !== node.parentNode) {
               moveIntoScope(node.id, scope.id);