This is an automated email from the ASF dual-hosted git repository. rusackas pushed a commit to branch fix/dropdown-container-button-visibility in repository https://gitbox.apache.org/repos/asf/superset.git
commit 45c05d3e5a22a57275b2abb84aaca75696e2dba6 Author: Evan Rusackas <[email protected]> AuthorDate: Sat Feb 21 22:45:47 2026 -0800 fix(FilterBar): always show 'More filters' button when items exist This fixes issue #28060 where the "More filters" button would disappear when filter values were set to their defaults and nothing was overflowing. The issue was caused by the button only rendering when `popoverContent` was truthy, which required either `dropdownContent` to be defined OR `overflowingCount > 0`. When neither condition was met (common when all filters fit in the container), the button would vanish, causing: - Inconsistent UI behavior - Layout shifts as the button appears/disappears - Poor user experience when resizing the browser window The fix introduces a `shouldShowButton` flag that ensures the button is always visible when items exist, regardless of overflow state. The badge correctly shows 0 when nothing is overflowing, providing clear feedback to users. Co-Authored-By: Claude Opus 4.5 <[email protected]> --- .../components/DropdownContainer/DropdownContainer.test.tsx | 10 +++++++++- .../src/components/DropdownContainer/DropdownContainer.tsx | 6 +++++- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.test.tsx b/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.test.tsx index f46b151c7a3..20e869cca79 100644 --- a/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.test.tsx +++ b/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.test.tsx @@ -51,8 +51,16 @@ test('renders children with custom horizontal spacing', () => { expect(screen.getByTestId('container')).toHaveStyle('gap: 20px'); }); -test('does not render a dropdown button when not overflowing', () => { +test('renders dropdown button when items exist even when not overflowing', () => { render(<DropdownContainer items={generateItems(3)} />); + // Button should always be visible when items exist to prevent layout shifts + expect(screen.getByText('More')).toBeInTheDocument(); + // Badge should show 0 when nothing is overflowing + expect(screen.getByText('0')).toBeInTheDocument(); +}); + +test('does not render a dropdown button when no items', () => { + render(<DropdownContainer items={[]} />); expect(screen.queryByText('More')).not.toBeInTheDocument(); }); diff --git a/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.tsx b/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.tsx index 14df91f4cf1..4ef3a508f6c 100644 --- a/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.tsx +++ b/superset-frontend/packages/superset-ui-core/src/components/DropdownContainer/DropdownContainer.tsx @@ -234,6 +234,10 @@ export const DropdownContainer = forwardRef( const overflowingCount = overflowingIndex !== -1 ? items.length - overflowingIndex : 0; + // Always show button when items exist to prevent layout shifts + // and ensure consistent UI even when nothing is currently overflowing + const shouldShowButton = items.length > 0 || !!dropdownContent; + const popoverContent = useMemo( () => dropdownContent || overflowingCount ? ( @@ -314,7 +318,7 @@ export const DropdownContainer = forwardRef( > {notOverflowedItems.map(item => item.element)} </div> - {popoverContent && ( + {shouldShowButton && ( <> <Global styles={css`
