docs(SelectNext): add server-side search example (DS-4770)

[KamilEmeleev]

Summary by CodeRabbit

• New Features

  • Added a SelectNext example for server-side search with asynchronous loading, pagination, multi-selection, loading states, and error handling.
  • Selected options remain available while searching and can be restored when the dropdown is reopened.
  • Added local filtering for selected options during server-backed searches.

• Documentation

  • Added guidance covering server search behavior, request cancellation, pagination, selected-option persistence, and local filtering.

[coderabbitai]

📝 Walkthrough

Walkthrough

SelectNext now includes a ServerSearch story and documentation for asynchronous server-side search. The example covers SWAPI loading, abortable requests, pagination, selection preservation, filtering, loading states, and errors.

Changes

SelectNext server search

Layer / File(s)	Summary
Server search story packages/components/src/components/SelectNext/Select.stories.tsx	Adds the ServerSearch story with useAsyncList and useFilter. The story supports SWAPI search, pagination, abort signals, error handling, preserved selections, local filtering, loading states, and selection ordering restoration.
Server search documentation packages/components/src/components/SelectNext/Select.mdx	Documents the asynchronous server-search behavior and links to the corresponding story.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant Select
  participant useAsyncList
  participant SWAPI
  Select->>useAsyncList: Submit search or load-more request
  useAsyncList->>SWAPI: Fetch people with query, page, and abort signal
  SWAPI-->>useAsyncList: Return people or request error
  useAsyncList-->>Select: Update items, loading state, or error state

Loading

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title clearly and concisely describes the added SelectNext server-side search example documented by the pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch docs/ds-4770

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[github-actions]

Visit the preview URL for this PR (updated for commit ad54b84):

https://react-koobiq-next--prs-445-ld14ydvd.web.app

_{(expires Mon, 10 Aug 2026 13:30:57 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: fc29847d4a9e5cb1adf458c76a9b681c76e2eeff}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/components/src/components/SelectNext/Select.stories.tsx`:
- Around line 602-606: Update the async list loader around the fetch request to
catch both rejected requests and non-OK responses, set hasMore to false before
rethrowing, and preserve the existing successful-load behavior. In the Select
story’s async-list rendering, use the error state to provide an error-specific
noItemsText so failures display the error/empty state instead of remaining
loading.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: c3d178fa-a5a0-4686-b734-8b80e348f33d

📥 Commits

Reviewing files that changed from the base of the PR and between ca07268 and cf82239.

📒 Files selected for processing (2)

• packages/components/src/components/SelectNext/Select.mdx
• packages/components/src/components/SelectNext/Select.stories.tsx

[Copilot]

🟡 Changes recommended

The new story’s retained/pinned option tracking can become stale when selection changes without a reload, leading to incorrect filtering behavior in the server-search example.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

This review doesn't count toward merge requirements. Sign up for the private preview to control whether Copilot approvals count.

Pull request overview

Adds a new SelectNext documentation example demonstrating server-side search backed by useAsyncList, including async loading, pagination (loadMore), selection persistence, and request cancellation via AbortSignal.

Changes:

• Added a new ServerSearch Storybook story that fetches options from SWAPI, supports pagination, and retains selected items across searches.
• Added a new “Server search” documentation section embedding the new story and explaining the approach.

File summaries

File	Description
packages/components/src/components/SelectNext/Select.stories.tsx	Adds the ServerSearch example story implementing async server search + pagination with retained selections.
packages/components/src/components/SelectNext/Select.mdx	Documents server-side search behavior and embeds the new story.

Review details

• Files reviewed: 2/2 changed files
• Comments generated: 1
• Review effort level: Lite

We're testing this review assessment. Please use 👍 or 👎 to tell us if it's correct.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/components/src/components/SelectNext/Select.stories.tsx`:
- Line 671: Update the SelectNext story’s loading prop so the `Select` component
uses only `list.isLoading` and no longer treats `hasMore` as loading. Remove the
unused `hasMore`/`setHasMore` state from the story around `useAsyncList`, and
keep the pagination behavior driven by the existing `list` symbol without
showing loading text during idle pagination.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 7ec9fa45-5d41-40fa-a56e-884d1a315557

📥 Commits

Reviewing files that changed from the base of the PR and between cf82239 and ad54b84.

📒 Files selected for processing (1)

• packages/components/src/components/SelectNext/Select.stories.tsx