fix: improve filter dropdown list height#8176
Conversation
There was a problem hiding this comment.
Code Review
This pull request increases the maximum height of the filter dropdown list and introduces viewport-aware height constraints to prevent the list from being cut off. The feedback recommends referencing the MAX_LIST_HEIGHT constant instead of hardcoding 384px to maintain a single source of truth, and retaining overflow: 'auto' to handle potential horizontal overflow safely.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
| maxHeight: 'min(384px, calc(100vh - 220px))', | ||
| overflowY: 'auto', |
There was a problem hiding this comment.
Avoid duplicating the hardcoded maximum height value (384px). Instead, reference the existing MAX_LIST_HEIGHT constant to keep the configuration single-sourced. Additionally, keeping overflow: 'auto' is preferred over overflowY: 'auto' to safely handle any potential horizontal overflow.
| maxHeight: 'min(384px, calc(100vh - 220px))', | |
| overflowY: 'auto', | |
| maxHeight: 'min(' + MAX_LIST_HEIGHT + 'px, calc(100vh - 220px))', | |
| overflow: 'auto', |
Background
This PR attempts to address issue #3816, where the operation filter dropdown on the Insights page is cut off when many operations are displayed.
Description
I investigated the Insights filter components and traced the operation filter to the shared
FilterContentcomponent.Changes made:
maxHeightbased on the viewport so larger operation lists have more available space.Modified file:
packages/web/app/src/components/base/floating/filter-dropdown/filter-content.tsxTesting
pnpm build.Related Issue
Fixes #3816
Notes
My local environment did not contain enough operation data to reproduce the exact long dropdown shown in the GitHub issue, so this fix is based on the reported behavior and code investigation.