Conversation
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
Greptile Summary
This PR implements several minor UX improvements across the workflow editor interface. The changes focus on enhancing user interaction patterns and visual feedback:
Console and Variables Panel Enhancements: The console and variables components now show scrollbars by changing the hideScrollbar prop from true to false in their ScrollArea components. This provides better visual indication when content overflows and improves navigation through long lists of console entries or variables.
Variable Collapse Functionality: A new collapsible feature has been added to the variables panel, allowing users to minimize individual variables to reduce visual clutter. The implementation uses React state management with collapsedById state to track which variables are collapsed, and adds a toggle button in the options dropdown with conditional Maximize2/Minimize2 icons. The value editor is conditionally rendered based on the collapsed state.
Tag Dropdown Click-Outside Behavior: The TagDropdown component now supports dismissing the dropdown by clicking outside of it. This is implemented using a useRef hook to reference the dropdown container and a useEffect that listens for mousedown and touchstart events outside the dropdown, following standard UX patterns for overlay dismissal.
Auto-Connect Logic Improvement: The workflow auto-connect behavior for blocks dropped inside sub-flows (loop/parallel containers) has been enhanced. Previously, new blocks would always connect to the container's start handle. Now, when existing child blocks are present, new blocks connect to the nearest existing child block instead, creating more intuitive sequential flows within containers while maintaining backward compatibility.
These changes integrate well with the existing codebase architecture, using established patterns like React hooks, conditional rendering, and the existing ScrollArea component from the UI library. The improvements enhance the overall user experience without introducing breaking changes to the workflow editor functionality.
Confidence score: 5/5
- This PR is safe to merge with minimal risk
- Score reflects simple, well-isolated UX improvements with proper React patterns and no breaking changes
- No files require special attention
4 files reviewed, no comments
* minor UX fixes * changed variable collapse * lint --------- Co-authored-by: Adam Gough <adamgough@Mac.attlocal.net>
2 participants
Summary
Fixed auto connect inside sub flows, added scrollbar on side bar for console and variable, allowed for users to click out of variable tag dropdown, and allowed for variable collapse.
Type of Change
Testing
See video
Checklist
Screenshots/Videos
Screen.Recording.2025-08-22.at.2.53.52.PM.mov