From 22d32fee8cd438ec35fb55eeafcbd569fca2c304 Mon Sep 17 00:00:00 2001
From: Kelly Yang <124ykl@gmail.com>
Date: Mon, 20 Apr 2026 21:12:22 -0700
Subject: [PATCH] fix: address review feedback on TabSubgraphInputs
 drag-and-drop

- Fix stale index closures after reorder: watch promotionEntries and
  re-register drag handlers via nextTick so consecutive drags pass
  correct fromIndex/toIndex to movePromotion
- Replace `as number` type assertion with typeof guard per project guidelines
- Tighten cleanup test assertion to toHaveBeenCalledTimes(2) to verify
  both registered handlers are disposed on unmount
---
 .../rightSidePanel/parameters/TabSubgraphInputs.test.ts       | 4 ++--
 .../rightSidePanel/parameters/TabSubgraphInputs.vue           | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/rightSidePanel/parameters/TabSubgraphInputs.test.ts b/src/components/rightSidePanel/parameters/TabSubgraphInputs.test.ts
index a9d67b0848..3194ed775a 100644
--- a/src/components/rightSidePanel/parameters/TabSubgraphInputs.test.ts
+++ b/src/components/rightSidePanel/parameters/TabSubgraphInputs.test.ts
@@ -138,8 +138,8 @@ describe('TabSubgraphInputs drag-and-drop', () => {
 
     unmount()
 
-    expect(mockDraggableCleanup).toHaveBeenCalled()
-    expect(mockDropTargetCleanup).toHaveBeenCalled()
+    expect(mockDraggableCleanup).toHaveBeenCalledTimes(2)
+    expect(mockDropTargetCleanup).toHaveBeenCalledTimes(2)
   })
 
   it('calls movePromotion with correct indices when an item is dropped', () => {
diff --git a/src/components/rightSidePanel/parameters/TabSubgraphInputs.vue b/src/components/rightSidePanel/parameters/TabSubgraphInputs.vue
index 2fc8e096a4..217e8112ca 100644
--- a/src/components/rightSidePanel/parameters/TabSubgraphInputs.vue
+++ b/src/components/rightSidePanel/parameters/TabSubgraphInputs.vue
@@ -177,7 +177,8 @@ function setDraggableState() {
       dropTargetForElements({
         element: item,
         onDrop: ({ source }) => {
-          const fromIndex = source.data.index as number
+          const fromIndex = source.data.index
+          if (typeof fromIndex !== 'number') return
           if (fromIndex === index) return
           promotionStore.movePromotion(
             node.rootGraph.id,
@@ -197,6 +198,7 @@ function setDraggableState() {
 watchDebounced(searchedWidgetsList, () => setDraggableState(), {
   debounce: 100
 })
+watch(promotionEntries, () => nextTick(setDraggableState))
 onMounted(() => setDraggableState())
 onBeforeUnmount(() => cleanupDragAndDrop())