feat: add SearchSelect component with sync and async support

[impoiler]

Summary

Introduces a new reusable SearchSelect component that renders a popover-based search input with a filterable list of selectable options. It supports both synchronous (client-side filtered) and asynchronous (server-driven search) modes.

Changes

• Added SearchSelect component built on top of cmdk and the existing Popover, Skeleton, and utility primitives.
• Supports controlled and uncontrolled open state via optional open/onOpenChange props.
• Async mode exposes onSearchChange, isSearching, isLoading, isError, and errorMessage props; when async, the cmdk filter is bypassed so results are fully controlled externally.
• Provides a default entry view rendering a label, optional description, and a Plus icon, with an entryView render prop for custom item rendering.
• Loading state renders skeleton placeholders; error state renders a destructive message; empty state uses CommandPrimitive.Empty.
• Accepts a footer slot rendered below the list, separated by a border.
• Exported SearchSelect, SearchSelectOption, and SearchSelectProps types for external use.

Type of change

• Bug fix
• Feature
• Refactor
• Documentation
• Chore/CI

Affected areas

• Core (Go)
• Transports (HTTP)
• Providers/Integrations
• Plugins
• UI (React)
• Docs

How to test

cd ui
pnpm i || npm i
pnpm build || npm run build

Render the component with a static options array and verify:

1. The popover opens on trigger click and the search input is auto-focused.
2. Typing filters the list (sync mode).
3. Selecting an item calls onValueSelect with the correct option object.
4. In async mode, onSearchChange is called on input and loading/error/empty states render correctly.

Screenshots/Recordings

Add before/after screenshots or a short clip demonstrating the component in use.

Breaking changes

• Yes
• No

Related issues

Link related issues and discussions.

Security considerations

No auth, secrets, or PII involved. Options and search values are UI-local.

Checklist

• I read docs/contributing/README.md and followed the guidelines
• I added/updated tests where appropriate
• I updated documentation where needed
• I verified builds succeed (Go and UI)
• I verified the CI pipeline passes locally if applicable

[coderabbitai]

Warning

Review limit reached

@impoiler, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 4 minutes and 21 seconds. Learn how PR review limits work.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 61304054-0cad-4b95-8910-c49c02712d45

📥 Commits

Reviewing files that changed from the base of the PR and between 1b4ba73 and 2ace481.

📒 Files selected for processing (1)

• ui/components/ui/searchSelect.tsx

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch 05-26-feat_searchselect_component

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[impoiler]

• feat: replace enabled badge with toggle switch and add edit action in MCP clients table #3809
• fix: exclude sonner toast elements from sheet outside-click detection #3805
• refactor: reuse SheetNavigationButtons component and useSheetNavigation hook #3804
• refactor: extract dashboard tab data-fetching into dedicated TabView components #3797
• feat: add GetDimensionRankings API and dashboard tabs for team, customer, BU, and user rankings #3766
• refactor: replace TeamDialog with TeamSheet and improve teams table layout #3757
• feat: add SearchSelect component with sync and async support #3752 👈 (View in Graphite)
• fix: persist customers pagination/search in URL state and improve table layout #3751
• feat: add prev/next navigation to RoutingRuleInfoSheet #3745
• feat: add prev/next navigation to MCPClientSheet #3744
• feat: add keyboard navigation and URL state for virtual key detail sheet #3740
• feat: add useSheetNavigation hook and SheetNavigationButtons component #3739
• refactor: replace CustomerDialog with CustomerSheet for customer create/edit #3726
• feat: log database type when connecting in NewConfigStore #3724
• dev

This stack of pull requests is managed by Graphite. Learn more about stacking.

[greptile-apps]

Confidence Score: 4/5

Safe to merge after addressing the double search-clear callback and the cmdk item identity collision.

The double-clear bug means async consumers receive onSearchChange("") twice on every close, potentially firing two server requests and confusing debounced handlers. The value={option.label} issue means any dataset with non-unique labels will silently drop options from the list. Both are correctable in-place before the component is wired to real data.

ui/components/ui/searchSelect.tsx — the only changed file; both issues are confined to it.

Important Files Changed

Filename	Overview
ui/components/ui/searchSelect.tsx	New reusable SearchSelect component with sync/async modes; has two logic bugs: duplicate onSearchChange("") calls on close and cmdk item identity collision when options share a label.

_{Reviews (4): Last reviewed commit: "feat: searchSelect component" | Re-trigger Greptile}

[akshaydeo]

Merge activity

• May 27, 1:44 PM UTC: A user started a stack merge that includes this pull request via Graphite.
• May 27, 1:54 PM UTC: @akshaydeo merged this pull request with Graphite.

The base branch was changed.