Skip to content

Migrate SearchAutocompleteList.tsx from useOptionsList to useFilteredOptions #82187

@mountiny

Description

@mountiny

Problem

SearchAutocompleteList.tsx currently uses the useOptionsList hook from OptionListContextProvider, which causes unnecessary background recalculations on every personal details or reports change.

This is part of a larger effort to remove OptionListContextProvider entirely. See parent issue #82193 for full context.

Solution

Replace useOptionsList with useFilteredOptions following the pattern established in PR #74071 (NewChatPage migration).

Current usage:

  • Properties used: options, areOptionsInitialized
  • Called with: no arguments (defaults to shouldInitialize: true)
  • File: src/components/Search/SearchAutocompleteList.tsx

How options are used:

  • options is passed into getSearchOptions() to build searchOptions in a useMemo
  • options is passed into getSearchOptions() again for autocomplete participants and IN filter in autocompleteSuggestions useMemo
  • areOptionsInitialized controls early return in searchOptions useMemo (falls back to defaultListOptions when false)
  • areOptionsInitialized conditionally renders the main SelectionList

Migration steps:

  1. Replace import {useOptionsList} from '@components/OptionListContextProvider' with import useFilteredOptions from '@hooks/useFilteredOptions'
  2. Replace useOptionsList() call with useFilteredOptions({ enabled: true })
  3. Replace areOptionsInitialized with !isLoading (or options !== null)
  4. Update the searchOptions useMemo guard to check options !== null instead of areOptionsInitialized
  5. Update the autocompleteSuggestions useMemo similarly
  6. Update the conditional render for SelectionList

Complexity: Medium -- multiple usages of options across different code paths

Reference PR: #74071

Tests

  • Verify search autocomplete works correctly when typing in the search bar
  • Verify autocomplete suggestions appear for participants, chats, and IN filters
  • Verify fallback to defaultListOptions works when options are loading
  • Verify no errors appear in the JS console
  • Test on all platforms (iOS, Android, Web, Desktop)

Metadata

Metadata

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions