improvement(router): add resizable textareas for router conditions

[waleedlatif1]

Summary

• Added resizable textareas to router condition blocks with drag handles
• Increased default textarea height for better content visibility
• Simplified resize handler in long-input by removing unnecessary useCallback

Type of Change

• Improvement (enhancement to existing feature)

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 19, 2026 9:51pm

[greptile-apps]

Greptile Summary

This PR adds resizable textareas to router condition blocks with custom drag handles, improving content visibility by increasing the default height from 60px to 100px. The implementation follows the existing resize pattern from long-input.tsx.

Key changes:

• Added router-specific resize functionality with startRouterResize handler and routerHeights state tracking
• Increased default router textarea height to 100px (from 60px) with a minimum of 80px
• Added custom resize handle with ChevronsUpDown icon at bottom-right corner
• Simplified startResize in long-input.tsx by removing unnecessary useCallback wrapper since it's not used as a hook dependency

Confidence Score: 4/5

• Safe to merge with one minor logic issue in the resize handler
• The implementation follows existing patterns and improves UX. There's one logic issue where the resize handler might not work correctly due to ref population timing, but the functionality is straightforward and well-tested manually
• Check that the resize functionality works correctly in router mode - verify that inputRefs are properly populated when the resize handler is called

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/condition-input/condition-input.tsx	Added resizable textareas for router conditions with custom drag handles and increased default height from 60px to 100px
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/long-input/long-input.tsx	Removed unnecessary useCallback wrapper from resize handler

Sequence Diagram

sequenceDiagram
    participant User
    participant ResizeHandle
    participant startRouterResize
    participant Document
    participant Textarea
    participant State

    User->>ResizeHandle: mouseDown on drag handle
    ResizeHandle->>startRouterResize: call with event & blockId
    startRouterResize->>startRouterResize: capture startY & startHeight
    startRouterResize->>Document: addEventListener('mousemove', handleMouseMove)
    startRouterResize->>Document: addEventListener('mouseup', handleMouseUp)
    
    loop While dragging
        User->>Document: mousemove
        Document->>handleMouseMove: trigger
        handleMouseMove->>handleMouseMove: calculate newHeight from deltaY
        handleMouseMove->>Textarea: update style.height directly
        handleMouseMove->>State: setRouterHeights(newHeight)
    end
    
    User->>Document: mouseup
    Document->>handleMouseUp: trigger
    handleMouseUp->>Document: removeEventListener('mousemove')
    handleMouseUp->>Document: removeEventListener('mouseup')

Loading

[greptile-apps]

Additional Comments (1)

1. apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/condition-input/condition-input.tsx, line 742-754 (link)

   logic: the inputRefs map is not populated for router mode textareas at this point because this effect only runs for condition mode (!isRouterMode). the resize handler at line 792 tries to access inputRefs.current.get(blockId) which will be undefined for router textareas.

   move the ref assignment to happen directly in the Textarea component (line 925) where ref={(el) => { if (el) inputRefs.current.set(block.id, el) }} is already present - that should work correctly

_{2 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}