fix(shift): fix shift select blue ring fading

[waleedlatif1]

Summary

• fix shift select blue ring fading
• copy/paste worked, but the ring sometimes didn't appear on shift-drag

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 17, 2026 3:45am

[greptile-apps]

Greptile Summary

Fixed a bug where the blue ring wasn't appearing on shift-drag/box-select operations, though copy/paste selection worked correctly. The fix threads the selected prop from React Flow's NodeProps through all block components (WorkflowBlock, NoteBlock, SubflowNode) down to the ring styling logic.

• Added isSelected parameter to useBlockVisual hook and getBlockRingStyles utility
• Properly disabled isSelected in preview mode to avoid unintended ring display
• Ensured isSelected state is prioritized correctly in ring styling hierarchy (after executing/editor open, but before pending/diff states)
• Updated all three block component types to destructure and pass the selected prop

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes are well-structured, consistent across all affected components, and follow established patterns. The fix properly threads the selected prop through the component hierarchy, correctly handles preview mode by disabling selection rings, includes the new dependency in useMemo hooks, and maintains proper priority in the ring styling cascade. The implementation is defensive and comprehensive.
• No files require special attention

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/utils/block-ring-utils.ts	Added isSelected parameter to handle shift-select/box-select state, properly prioritized in ring styling logic with comprehensive condition checks
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/hooks/use-block-visual.ts	Added isSelected prop to hook interface, properly passed to getBlockRingStyles, included in useMemo dependencies, disabled in preview mode

Sequence Diagram

sequenceDiagram
    participant RF as ReactFlow
    participant WB as WorkflowBlock/NoteBlock/SubflowNode
    participant UBV as useBlockVisual Hook
    participant GBRS as getBlockRingStyles
    participant DOM as DOM (Ring Visual)

    Note over RF,DOM: User performs shift-drag or box-select
    
    RF->>WB: Render with selected=true
    WB->>UBV: useBlockVisual({ blockId, data, isSelected: selected })
    
    Note over UBV: Disable isSelected if isPreview=true
    
    UBV->>GBRS: getBlockRingStyles({ isSelected, isEditorOpen, ... })
    
    Note over GBRS: Priority cascade:<br/>1. isExecuting → green pulsing<br/>2. isEditorOpen/isSelected → blue ring<br/>3. isPending → warning<br/>4. isDeletedBlock → error<br/>5. diffStatus → green/orange<br/>6. runPathStatus → success/error
    
    GBRS->>UBV: { hasRing: true, ringClassName: 'ring-[1.75px] ring-[var(--brand-secondary)]' }
    UBV->>WB: { ringStyles }
    WB->>DOM: Apply blue ring className
    DOM->>DOM: Display blue ring on selected block

Loading