fix copy-paste subflows deselecting children

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/hooks/index.ts

@@ -5,7 +5,6 @@ export {
   getClampedPositionForNode,
   isInEditableElement,
   resolveParentChildSelectionConflicts,
-  selectNodesDeferred,
   validateTriggerPaste,
 } from '@/app/workspace/[workspaceId]/w/[workflowId]/utils/workflow-canvas-helpers'
 export { useFloatBoundarySync, useFloatDrag, useFloatResize } from './float'

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/utils/workflow-canvas-helpers.ts

@@ -65,30 +65,6 @@ export function clearDragHighlights(): void {
   document.body.style.cursor = ''
 }
 
-/**
- * Selects nodes by their IDs after paste/duplicate operations.
- * Defers selection to next animation frame to allow displayNodes to sync from store first.
- * This is necessary because the component uses controlled state (nodes={displayNodes})
- * and newly added blocks need time to propagate through the store → derivedNodes → displayNodes cycle.
- * Automatically resolves parent-child selection conflicts to prevent wiggle during drag.
- */
-export function selectNodesDeferred(
-  nodeIds: string[],
-  setDisplayNodes: (updater: (nodes: Node[]) => Node[]) => void,
-  blocks: Record<string, { data?: { parentId?: string } }>
-): void {
-  const idsSet = new Set(nodeIds)
-  requestAnimationFrame(() => {
-    setDisplayNodes((nodes) => {
-      const withSelection = nodes.map((node) => ({
-        ...node,
-        selected: idsSet.has(node.id),
-      }))
-      return resolveParentChildSelectionConflicts(withSelection, blocks)
-    })
-  })
-}
-
 interface BlockData {
   height?: number
   data?: {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx

@@ -48,7 +48,6 @@ import {
   getClampedPositionForNode,
   isInEditableElement,
   resolveParentChildSelectionConflicts,
-  selectNodesDeferred,
   useAutoLayout,
   useCurrentWorkflow,
   useNodeUtilities,
@@ -358,6 +357,9 @@ const WorkflowContent = React.memo(() => {
     new Map()
   )
 
+  /** Stores node IDs to select on next derivedNodes sync (for paste/duplicate operations). */
+  const pendingSelectionRef = useRef<Set<string> | null>(null)
+
   /** Re-applies diff markers when blocks change after socket rehydration. */
   const blocksRef = useRef(blocks)
   useEffect(() => {
@@ -689,19 +691,16 @@ const WorkflowContent = React.memo(() => {
       return
     }
 
+    // Set pending selection before adding blocks - sync effect will apply it
+    pendingSelectionRef.current = new Set(pastedBlocksArray.map((b) => b.id))
+
     collaborativeBatchAddBlocks(
       pastedBlocksArray,
       pastedEdges,
       pastedLoops,
       pastedParallels,
       pastedSubBlockValues
     )
-
-    selectNodesDeferred(
-      pastedBlocksArray.map((b) => b.id),
-      setDisplayNodes,
-      blocks
-    )
   }, [
     hasClipboard,
     clipboard,
@@ -738,19 +737,16 @@ const WorkflowContent = React.memo(() => {
       return
     }
 
+    // Set pending selection before adding blocks - sync effect will apply it
+    pendingSelectionRef.current = new Set(pastedBlocksArray.map((b) => b.id))
+
     collaborativeBatchAddBlocks(
       pastedBlocksArray,
       pastedEdges,
       pastedLoops,
       pastedParallels,
       pastedSubBlockValues
     )
-
-    selectNodesDeferred(
-      pastedBlocksArray.map((b) => b.id),
-      setDisplayNodes,
-      blocks
-    )
   }, [
     contextMenuBlocks,
     copyBlocks,
@@ -884,19 +880,16 @@ const WorkflowContent = React.memo(() => {
               return
             }
 
+            // Set pending selection before adding blocks - sync effect will apply it
+            pendingSelectionRef.current = new Set(pastedBlocks.map((b) => b.id))
+
             collaborativeBatchAddBlocks(
               pastedBlocks,
               pasteData.edges,
               pasteData.loops,
               pasteData.parallels,
               pasteData.subBlockValues
             )
-
-            selectNodesDeferred(
-              pastedBlocks.map((b) => b.id),
-              setDisplayNodes,
-              blocks
-            )
           }
         }
       }
@@ -1959,15 +1952,27 @@ const WorkflowContent = React.memo(() => {
   }, [isShiftPressed])
 
   useEffect(() => {
-    // Preserve selection state when syncing from derivedNodes
+    // Check for pending selection (from paste/duplicate), otherwise preserve existing selection
+    const pendingSelection = pendingSelectionRef.current
+    pendingSelectionRef.current = null
+
     setDisplayNodes((currentNodes) => {
+      if (pendingSelection) {
+        // Apply pending selection and resolve parent-child conflicts
+        const withSelection = derivedNodes.map((node) => ({
+          ...node,
+          selected: pendingSelection.has(node.id),
+        }))
+        return resolveParentChildSelectionConflicts(withSelection, blocks)
+      }
+      // Preserve existing selection state
       const selectedIds = new Set(currentNodes.filter((n) => n.selected).map((n) => n.id))
       return derivedNodes.map((node) => ({
         ...node,
         selected: selectedIds.has(node.id),
       }))
     })
-  }, [derivedNodes])
+  }, [derivedNodes, blocks])
 
   /** Handles ActionBar remove-from-subflow events. */
   useEffect(() => {