From 3b78078ea4f73f22b16fbe64da8ea1e4cab66578 Mon Sep 17 00:00:00 2001
From: kay delaney <45561153+kaydelaney@users.noreply.github.com>
Date: Thu, 29 May 2025 13:48:25 +0100
Subject: [PATCH] DashboardLayoutOrchestrator: Refine drag drop logic (#106079)

---
 .../dashboards-move-panel.spec.ts             | 26 +++++++++++++++++++
 .../scene/DashboardLayoutOrchestrator.tsx     | 16 +++++++-----
 2 files changed, 36 insertions(+), 6 deletions(-)

diff --git a/e2e/dashboard-new-layouts/dashboards-move-panel.spec.ts b/e2e/dashboard-new-layouts/dashboards-move-panel.spec.ts
index 81d6dc749b1..431a75dd54b 100644
--- a/e2e/dashboard-new-layouts/dashboards-move-panel.spec.ts
+++ b/e2e/dashboard-new-layouts/dashboards-move-panel.spec.ts
@@ -30,4 +30,30 @@ describe('Dashboard', () => {
           .should('be.higherThan', panel3);
       });
   });
+
+  // Note, moving a panel from a nested row to a parent row currently just deletes the panel
+  // This test will need to be updated once the correct behavior is implemented.
+  it('can move panel from nested row to parent row', () => {
+    e2e.flows.openDashboard({ uid: `${PAGE_UNDER_TEST}?orgId=1` });
+
+    e2e.flows.scenes.toggleEditMode();
+
+    e2e.flows.scenes.groupIntoRow();
+    e2e.flows.scenes.groupIntoRow();
+
+    cy.get('[data-testid="data-testid dashboard-row-title-New row"]')
+      .first()
+      .then((el) => {
+        const rect = el.offset();
+        e2e.components.Panels.Panel.headerContainer()
+          .contains(/^Panel one$/)
+          .trigger('pointerdown', { which: 1 })
+          .trigger('pointermove', { clientX: rect.left, clientY: rect.top })
+          .trigger('pointerup');
+      });
+
+    e2e.components.Panels.Panel.headerContainer()
+      .contains(/^Panel one$/)
+      .should('not.exist');
+  });
 });
diff --git a/public/app/features/dashboard-scene/scene/DashboardLayoutOrchestrator.tsx b/public/app/features/dashboard-scene/scene/DashboardLayoutOrchestrator.tsx
index f97eeaa87a0..ff46c11cc0e 100644
--- a/public/app/features/dashboard-scene/scene/DashboardLayoutOrchestrator.tsx
+++ b/public/app/features/dashboard-scene/scene/DashboardLayoutOrchestrator.tsx
@@ -101,13 +101,17 @@ export class DashboardLayoutOrchestrator extends SceneObjectBase<DashboardLayout
   }
 
   private _getDropTargetUnderMouse(evt: MouseEvent): DashboardDropTarget | null {
-    const key = document
-      .elementsFromPoint(evt.clientX, evt.clientY)
-      ?.find((element) => {
-        const key = element.getAttribute('data-dashboard-drop-target-key');
+    const elementsUnderPoint = document.elementsFromPoint(evt.clientX, evt.clientY);
+    const cursorIsInSourceTarget = elementsUnderPoint.some(
+      (el) => el.getAttribute('data-dashboard-drop-target-key') === this._sourceDropTarget?.state.key
+    );
 
-        return !!key && key !== this._sourceDropTarget?.state.key;
-      })
+    if (cursorIsInSourceTarget) {
+      return null;
+    }
+
+    const key = elementsUnderPoint
+      ?.find((element) => element.getAttribute('data-dashboard-drop-target-key'))
       ?.getAttribute('data-dashboard-drop-target-key');
 
     if (!key) {