feat: add search filters for platform and gen version#8526
Conversation
Add visible filter controls inside the DocSearch modal so users can narrow search results by platform and Gen version. Platform uses optionalFacetFilters for boosting (cross-platform results still appear, ranked lower). Gen version uses hard filtering with Gen1/Gen2/Both options. Defaults to All platforms and Gen 2. Also adds getMissingResultsUrl so zero-result searches show a link to report missing content on GitHub. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
| setPortalContainer(null); | ||
| } | ||
| }); | ||
| observer.observe(document.body, { childList: true, subtree: true }); |
There was a problem hiding this comment.
does it work with this change? not sure we need to fire the observer on all updates in the body
| observer.observe(document.body, { childList: true, subtree: true }); | |
| observer.observe(document.body, { childList: true, subtree: false }); |
|
|
||
| describe('SearchFilters', () => { | ||
| let mockModal: HTMLElement; | ||
| let onPlatformChange: jest.Mock; |
There was a problem hiding this comment.
We should test these interactions as well, onPlatformChange and onGenChange are unused.
| const router = useRouter(); | ||
| const asPathWithNoHash = usePathWithoutHash(); | ||
|
|
||
| const [platformFilter, setPlatformFilter] = useState<PlatformFilter>('all'); |
There was a problem hiding this comment.
why using 'all' by default?
could we not utilize currentPlatform and fallback to all?
| const [platformFilter, setPlatformFilter] = useState<PlatformFilter>('all'); | |
| const [platformFilter, setPlatformFilter] = useState<PlatformFilter>(currentPlatform ?? 'all'); |
There was a problem hiding this comment.
We intentionally default to "All" so search covers the full docs by default — users often search for concepts that span platforms (e.g. "auth", "data modeling"). The platform sidebar already filters navigation to the current platform, so having search default to "All" gives a broader discovery experience. If the user wants platform-specific results, they can narrow via the dropdown.
| onGenChange | ||
| }: SearchFiltersProps) { | ||
| const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null); | ||
| const containerRef = useRef<HTMLDivElement | null>(null); |
There was a problem hiding this comment.
you have 2 approaches to save the container element, a ref and state. is it possible to use a single approach only?
- Use subtree: false on MutationObserver since DocSearch modal is a direct child of body (pranavosu) - Add interaction tests for onPlatformChange and onGenChange (pranavosu) - Consolidate ref + state into state-only approach with cleanup via setState callback (bobbor) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
3 participants
Summary
optionalFacetFiltersto boost (not hard-filter) results for the selected platform — cross-platform results still appear, ranked lowergetMissingResultsUrlso zero-result searches show a link to report missing content on GitHubFiles changed
src/components/Search/SearchFilters.tsxsrc/components/Search/__tests__/SearchFilters.test.tsxsrc/components/Search/index.tssrc/components/Layout/LayoutHeader.tsxsrc/styles/algolia.scssTest plan
yarn test:unit— 222 tests pass, no regressions🤖 Generated with Claude Code