fix(workflow): update container dimensions on keyboard movement

[waleedlatif1]

Summary

• Renamed updateContainerDimensionsDuringDrag to updateContainerDimensionsDuringMove to reflect broader usage
• Added handling for position changes in onNodesChange to resize containers when child nodes are moved via keyboard arrows
• Containers now stay properly sized when nodes inside them are moved with keyboard navigation

Type of Change

• Bug fix

Testing

Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Review	Updated (UTC)
docs	Skipped		Jan 28, 2026 7:16am

[greptile-apps]

Greptile Overview

Greptile Summary

this PR fixes container resizing when child nodes are moved via keyboard arrows by adding position change handling in onNodesChange. the function updateContainerDimensionsDuringDrag was renamed to updateContainerDimensionsDuringMove to reflect its broader usage.

Key changes:

• renamed function from updateContainerDimensionsDuringDrag to updateContainerDimensionsDuringMove
• added position change handler in onNodesChange to catch keyboard movements
• containers now properly resize when child nodes move via keyboard navigation

Issue found:

• position changes during mouse drag operations will trigger the handler twice (once in onNodeDrag at line 2621, once in onNodesChange at line 2370), causing unnecessary re-renders and duplicate container dimension calculations

Confidence Score: 3/5

• this PR is safe to merge with one performance issue that should be addressed
• the implementation correctly solves the keyboard movement issue, but the missing !change.dragging check will cause the container resize function to be called twice during drag operations (once in onNodeDrag and once in onNodesChange), leading to unnecessary re-renders and performance overhead
• apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx needs the dragging check added to prevent duplicate calls

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx	renamed function and added keyboard movement handling for container resizing, but position changes during drag will trigger handler twice (needs dragging check)

Sequence Diagram

sequenceDiagram
    participant User
    participant ReactFlow
    participant onNodesChange
    participant onNodeDrag
    participant updateContainerDimensionsDuringMove
    participant Container

    Note over User,Container: Keyboard Arrow Movement
    User->>ReactFlow: Press arrow key on selected node
    ReactFlow->>onNodesChange: NodeChange (type='position', dragging=false)
    onNodesChange->>updateContainerDimensionsDuringMove: Update with new position
    updateContainerDimensionsDuringMove->>Container: Resize parent container

    Note over User,Container: Mouse Drag Movement
    User->>ReactFlow: Drag node with mouse
    ReactFlow->>onNodeDrag: Mouse drag event
    onNodeDrag->>updateContainerDimensionsDuringMove: Update with new position
    updateContainerDimensionsDuringMove->>Container: Resize parent container
    ReactFlow->>onNodesChange: NodeChange (type='position', dragging=true)
    Note over onNodesChange: ⚠️ Currently calls updateContainerDimensionsDuringMove again
    onNodesChange->>updateContainerDimensionsDuringMove: Duplicate call during drag
    updateContainerDimensionsDuringMove->>Container: Unnecessary resize

Loading

[greptile-apps]

_{1 file reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

during drag operations, position changes will trigger both onNodeDrag (line 2621) and this handler, causing updateContainerDimensionsDuringMove to be called twice per position update. add check for !change.dragging to only handle keyboard movements:

Suggested change

	for (const change of changes) {
	if (change.type === 'position' && 'position' in change && change.position) {
	updateContainerDimensionsDuringMove(change.id, change.position)
	}
	}
	// Handle position changes (e.g., from keyboard arrow key movement)
	// Update container dimensions when child nodes are moved
	for (const change of changes) {
	if (change.type === 'position' && !change.dragging && 'position' in change && change.position) {
	updateContainerDimensionsDuringMove(change.id, change.position)
	}
	}

Prompt To Fix With AI

This is a comment left during a code review.
Path: apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx
Line: 2368:2372

Comment:
during drag operations, position changes will trigger both `onNodeDrag` (line 2621) and this handler, causing `updateContainerDimensionsDuringMove` to be called twice per position update. add check for `!change.dragging` to only handle keyboard movements:

```suggestion
      // Handle position changes (e.g., from keyboard arrow key movement)
      // Update container dimensions when child nodes are moved
      for (const change of changes) {
        if (change.type === 'position' && !change.dragging && 'position' in change && change.position) {
          updateContainerDimensionsDuringMove(change.id, change.position)
        }
      }
```

How can I resolve this? If you propose a fix, please make it concise.