Skip to content

feat: support filtering search results by category#712

Open
qiancai wants to merge 2 commits into
pingcap:masterfrom
qiancai:add-search-filters
Open

feat: support filtering search results by category#712
qiancai wants to merge 2 commits into
pingcap:masterfrom
qiancai:add-search-filters

Conversation

@qiancai

@qiancai qiancai commented Jun 12, 2026

Copy link
Copy Markdown
Collaborator

Summary

Add category filtering to the onsite search results page, so users can narrow results by documentation category (e.g. TiDB, TiDB Cloud, Developer) after running a search.

What changed

  • src/templates/DocSearchTemplate.tsx: Track an activeFilter state, compute per-category hit counts from Algolia results, filter the displayed list client-side, and reset the filter when the query or language changes.
  • src/components/Search/Results.tsx: Add a SearchFilterBar component that renders category chips with counts; make per-result category chips clickable to apply the same filter; pass filtered data to the results list.
  • locale/en/translation.json, locale/zh/translation.json: Add the search.filters label for the filter bar.

Purpose

Search results can span multiple documentation areas in a single query. Without filtering, users must scan a long mixed list to find hits in the section they care about. This change lets users quickly focus on one category after searching.

Implementation

  • Reuse the existing resolveSearchCategory() utility (shared/utils/searchCategory.ts) to classify each hit by URL path—no Algolia index or query changes required.
  • Build a categoryCountMap from raw search hits and show a SearchFilterBar only when there are results from more than one category.
  • Filter results in a useMemo on the template; clicking a filter chip toggles that category (click again to clear).
  • Category chips on individual result items also trigger the same filter for a quicker entry point.

Test plan

  • Run a search that returns hits across multiple categories (e.g. backup) and confirm the filter bar appears with correct labels and counts.
  • Click a category chip in the filter bar and verify only matching results are shown; click again to clear.
  • Click a category chip on a result item and verify the same filter is applied.
  • Run a new search or clear the query and confirm the active filter resets.
  • Verify EN and ZH locales show the filter bar label correctly.

@vercel

vercel Bot commented Jun 12, 2026

Copy link
Copy Markdown

@qiancai is attempting to deploy a commit to the test-vi Team on Vercel.

A member of the Team first needs to authorize it.

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a search filtering feature for the documentation search page, allowing users to filter search results by category. It adds a new SearchFilterBar component, updates SearchResults and SearchItem to support filter changes, and manages the active filter state in DocSearchTemplate. The feedback suggests making the category chip's interactivity conditional on the presence of the onFilterChange callback, and filtering out categories without valid translation labels before rendering the filter bar to prevent rendering redundant or empty states.

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.

Comment thread src/components/Search/Results.tsx Outdated
Comment thread src/components/Search/Results.tsx Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant