feat(ui-core): add FilterSelect — unified filter dropdown primitive

[harsh-vador]

Describe your changes

Fixes #29569

Part of the filter-dropdown unification effort (#31999 and the Collate explore-filter polish epic). This adds the shared primitive; follow-up PRs swap the app's filter dropdowns (SearchDropdown, QuickFilterDropdown, FilterChip, …) onto it.

FilterSelect (ui-core-components/application/filter-select/) — a filter dropdown built on the existing react-aria primitives (Dropdown, Input, Checkbox, Button):

• Trigger variants: chip (pill), button, input-style — the three shapes used across the app today.
• Selection: single / multiple; commits immediate (per toggle) or staged (Apply / Cancel / Clear all footer).
• Search: built-in box; delegates to onSearch for async option fetching, otherwise filters locally.
• Uniform rows: every row — value rows, the pinned "No X" nullOption, Select All — renders through Dropdown.Item + CheckboxBase size="sm", so checkbox size, alignment, and typography cannot drift per consumer.
• Select All (Enhancement: Add "Select All" Support for Multi-Select Filter Dropdowns #29569): tri-state header row scoped to the currently displayed (filtered) rows; deselect keeps selections hidden by the active search.
• Robustness: resolves react-aria's 'all' selection sentinel (⌘A) to concrete values; merges persisted-but-unfetched selected values (e.g. restored from a URL) into the list via resolveMissingLabel.
• Counts as row addons, hideCounts to suppress; isLoading / emptyState handling.

Screen.Recording.2026-09-11.at.11.25.52.AM.mov

i18n

Adds six core-namespace keys (apply, cancel, clear-all, no-data-found, search, select-all) with real translations in all 20 language files. yarn check-i18n-all passes (548 translations, none English-fallback).

Testing

• 14 unit tests (vitest + RTL) covering immediate/staged commits, select-all scoping, null-option rendering, local vs async search, missing-value merge, single-select, trigger count, empty state.
• Storybook stories (immediate, staged + null option, single-select input variant).
• yarn type-check, yarn lint, yarn build all clean. The one failing table test on main (can omit the selection cell for a full-width synthetic row) pre-exists and is unrelated.

🤖 Generated with Claude Code

[github-actions]

✅ PR checks passed

The linked issue has a description and all required Shipping project fields set. Thanks!

[github-actions]

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

[github-actions]

✅ Playwright Results — workflow succeeded

Validated commit 67cdedf8cbe68eaf6ddd2c6afa06470f6b6f6ec9 in Playwright run 34567299292, attempt 1.

✅ 576 passed · ❌ 0 failed · 🟡 0 flaky · ⏭️ 0 skipped · 🧰 0 lifecycle flaky

Performance

Blocking targets: ✅ met · Optimization targets: 🟡 in progress

Shard-job maxima below are not the full workflow wall time; the linked run includes build, fixture, planning, and reporting.

🕒 Full workflow signal wall (to summary) 46m 27s

⏱️ Max setup 4m 24s · max shard execution 15m 17s · max shard-job elapsed before upload 20m 4s · reporting 4s

🌐 225.07 requests/attempt · 2.25 app boots/UI scenario · 26.50% common-shard skew

Optimization targets still in progress:

• Common shard skew was 26.5% (convergence target: at most 15%).
• Browser traffic was 225.07 requests per attempt (convergence target: fewer than 200).
• Application boot ratio was 2.25 per UI scenario (1346 boots / 597 scenarios; convergence target: at most 1).

Shard	Passed	Failed	Flaky	Skipped	Lifecycle failed	Lifecycle flaky
✅ Shard chromium-01	141	0	0	0	0	0
✅ Shard chromium-02	148	0	0	0	0	0
✅ Shard chromium-03	129	0	0	0	0	0
✅ Shard data-asset-rules-01	65	0	0	0	0	0
✅ Shard domain-isolation-01	16	0	0	0	0	0
✅ Shard global-state-01	34	0	0	0	0	0
✅ Shard ingestion-01	1	0	0	0	0	0
✅ Shard reindex-01	2	0	0	0	0	0
✅ Shard search-01	11	0	0	0	0	0
✅ Shard search-rbac-01	29	0	0	0	0	0

📦 Download artifacts

How to debug locally

# Download playwright-test-results-<shard> artifact and unzip
npx playwright show-trace path/to/trace.zip    # view trace

[gitar-bot]

Code Review ✅ Approved 3 resolved / 3 findings

Introduces FilterSelect, a unified filter dropdown primitive supporting trigger variants (chip, button, input), single/multiple selection with immediate or staged commits, built-in search with async option fetching, tri-state Select All scoped to filtered rows, and count displays. Resolves staged selection resyncing on controlled open, Array/fragment icon node type checking, and chips field button nesting. Includes 14 unit tests, Storybook stories, i18n translations across 20 languages, and passes type-check, lint, and build. No issues found.

✅ 3 resolved

✅ Edge Case: Staged selection not resynced on controlled/programmatic open

📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/application/filter-select/filter-select.tsx:167-169 📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/application/filter-select/filter-select.tsx:234-241
staged is only refreshed inside handleOpenChange, which react-aria's MenuTrigger fires on user interaction — not when the dropdown is opened by flipping the controlled isOpen prop. When a consumer opens the filter programmatically (controlled isOpen) in staged mode, or selectedValues changes while the popover is already open, staged stays stale and the checkboxes/footer reflect an outdated selection until the next user-driven open. Resync staged from selectedValues when the resolved open state transitions to true, independent of the react-aria callback.

✅ Edge Case: Array/fragment icon node can throw in isReactComponent

📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/application/filter-select/filter-select.tsx:118-121
With icon now widened to FC<{className?}> | ReactNode, an array of nodes is a type-valid value. When such an array reaches isReactComponent → isForwardRefComponent, the guard does component.$$typeof.toString(); arrays are typeof 'object' and non-null but have no $$typeof, so this throws TypeError: Cannot read properties of undefined. Single elements and components are unaffected (elements carry $$typeof). If consumers may pass fragment/array icon nodes, guard against a missing $$typeof (e.g. component.$$typeof?.toString() === 'Symbol(react.forward_ref)') or document that icon must be a single element/component.

✅ Edge Case: Chips field nests multiple buttons inside one MenuTrigger

📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/application/filter-select/filter-select.tsx:170-184 📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/application/filter-select/filter-select.tsx:475-489
ChipsField renders a plain <div> as the Dropdown.Root (react-aria MenuTrigger) child, containing one AriaButton per chip-remove plus the trailing menu-trigger AriaButton. react-aria broadcasts the trigger's press/open props through ButtonContext to every descendant Button that consumes it, so each chip's remove button likely inherits the menu's press-to-open handler in addition to its own onRemove — clicking ✕ would fire onChange AND open the popover, and the trigger ref/press target is ambiguous. The added tests only exercise chips with isOpen={false} (render + remove) and never open the dropdown by clicking, so this path is uncovered. Verify open-by-click and remove-by-click behave independently (e.g. wrap the remove buttons outside the MenuTrigger, or make a single dedicated trigger element), and add a test that opens the chips popover via click.

Options

Display: compact → Counting what did not apply, without listing it.

Comment with these commands to change the behavior for this request:

Compact

gitar display:verbose

_{Was this helpful? React with 👍 / 👎 | Powered by Gitar — free for open source}