Problem
IOURequestEditReportCommon.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 only
- Called with: no arguments
- File:
src/pages/iou/request/step/IOURequestEditReportCommon.tsx
How options are used:
- Only
options.reports is used in a useMemo to find matching report options for alternateText, brickRoadIndicator, and policyID enrichment
- No loading/initialization flags are checked
Migration steps:
- Replace
import {useOptionsList} from '@components/OptionListContextProvider' with import useFilteredOptions from '@hooks/useFilteredOptions'
- Replace
useOptionsList() call with useFilteredOptions({ enabled: true })
- Handle the
null case for options (when loading) -- default to empty reports array in the useMemo
- The rest of the logic should work as-is since it only reads
options.reports
Complexity: Simple
Reference PR: #74071
Tests
- Verify editing a money request report works correctly
- Verify the report selector shows correct alternate text and indicators
- Verify no errors appear in the JS console
- Test on all platforms (iOS, Android, Web, Desktop)
Problem
IOURequestEditReportCommon.tsxcurrently uses theuseOptionsListhook fromOptionListContextProvider, which causes unnecessary background recalculations on every personal details or reports change.This is part of a larger effort to remove
OptionListContextProviderentirely. See parent issue #82193 for full context.Solution
Replace
useOptionsListwithuseFilteredOptionsfollowing the pattern established in PR #74071 (NewChatPage migration).Current usage:
optionsonlysrc/pages/iou/request/step/IOURequestEditReportCommon.tsxHow options are used:
options.reportsis used in auseMemoto find matching report options foralternateText,brickRoadIndicator, andpolicyIDenrichmentMigration steps:
import {useOptionsList} from '@components/OptionListContextProvider'withimport useFilteredOptions from '@hooks/useFilteredOptions'useOptionsList()call withuseFilteredOptions({ enabled: true })nullcase for options (when loading) -- default to empty reports array in the useMemooptions.reportsComplexity: Simple
Reference PR: #74071
Tests