Search autocomplete and topic suggestions

[sacredvoid]

Problem

Users must know the exact terminology to search effectively. There's no guidance on what topics exist or how they're named in OpenAlex, leading to missed results or frustration.

Proposed Solution

Autocomplete Dropdown

• As the user types in the search box (topic mode), show a dropdown with matching OpenAlex topics/concepts
• Debounce input (300ms) to avoid excessive API calls
• Show top 5-8 suggestions with work counts (e.g., "Machine Learning (1.2M works)")
• Keyboard navigation (arrow keys + enter to select)

Data Source

• OpenAlex has an autocomplete endpoint: GET /autocomplete/topics?q=...
• Alternatively, use GET /topics?search=... with per_page=8
• Cache results client-side (same topic prefix likely queried multiple times)

Related Topics

• After a search completes, show a "Related Topics" section with sibling/parent topics from the OpenAlex topic hierarchy
• E.g., searching "deep learning" could suggest "neural networks", "computer vision", "NLP"
• Uses the subfield and field relationships already in the topic data

Implementation

• New SearchAutocomplete client component wrapping the search input
• Use useRef + useEffect for outside-click dismissal
• ARIA attributes for accessibility (role="listbox", aria-activedescendant)
• Loading state while fetching suggestions

Priority

High — significantly improves search discoverability and reduces failed searches.