fix(sidebar): disarm the spring-open timer when a drag ends

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.test.tsx

@@ -327,6 +327,43 @@ describe('useDragDrop spring-open revert', () => {
     expect(expandedFolders.has('folder-1')).toBe(true)
   })
 
+  /**
+   * The spring-open timer is armed for 400ms, so a drag ending just before it fires leaves it
+   * pending. Relying on the effect cleanup to cancel it would let it land after the drag-end
+   * collapse had already emptied the set — re-adding the folder for the *next* drag to close, by
+   * which point the user had opened it themselves.
+   */
+  it('does not spring-open a folder when the drag ends before the timer fires', () => {
+    act(() => {
+      latest.handleDragStart(null)
+    })
+    act(() => {
+      latest
+        .createFolderDragHandlers('folder-1', null)
+        .onDragOver(fakeFolderDragOverEvent() as never)
+    })
+
+    /**
+     * Deliberately outside `act`: the race only exists while React has scheduled the drag-end state
+     * changes but not yet committed them, so the effect cleanup has not run and the timer is still
+     * armed. Wrapping this in `act` would flush the commit first and cancel the timer via the
+     * cleanup, hiding the very gap under test.
+     */
+    latest.handleDragEnd()
+    act(() => {
+      vi.advanceTimersByTime(500)
+    })
+
+    expect(mockSetExpanded).not.toHaveBeenCalledWith('folder-1', true)
+    expect(expandedFolders.has('folder-1')).toBe(false)
+
+    // Nothing was left behind for a later drag to collapse.
+    act(() => {
+      latest.handleDragEnd()
+    })
+    expect(mockSetExpanded).not.toHaveBeenCalledWith('folder-1', false)
+  })
+
   it('never closes a folder the user had already opened themselves', () => {
     expandedFolders.add('folder-1')
 

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts

@@ -732,6 +732,16 @@ export function useDragDrop(options: UseDragDropOptions = {}) {
     setDropIndicator(null)
     draggedSourceFolderRef.current = null
     setHoverFolderId(null)
+    /**
+     * Disarmed here rather than left to the effect cleanup, which only runs once React commits the
+     * state changes above. A timer due within that gap would otherwise fire after the collapse
+     * below, spring-opening a folder for a drag that already ended and leaving it in the set for
+     * the next drag to close — a folder the user, by then, opened themselves.
+     */
+    if (hoverExpandTimerRef.current) {
+      clearTimeout(hoverExpandTimerRef.current)
+      hoverExpandTimerRef.current = null
+    }
     collapseAutoExpandedFolders()
   }, [collapseAutoExpandedFolders])