diff --git a/src/components/Search/SearchAutocompleteList.tsx b/src/components/Search/SearchAutocompleteList.tsx index ff1124f4528c..2ce9c5329a70 100644 --- a/src/components/Search/SearchAutocompleteList.tsx +++ b/src/components/Search/SearchAutocompleteList.tsx @@ -541,31 +541,35 @@ function SearchAutocompleteList( }, [autocompleteQueryValue, onHighlightFirstItem, normalizedReferenceText]); return ( - - showLoadingPlaceholder={!areOptionsInitialized} - fixedNumItemsForLoader={4} - loaderSpeed={CONST.TIMING.SKELETON_ANIMATION_SPEED} - sections={sections} - onSelectRow={onListItemPress} - ListItem={SearchRouterItem} - containerStyle={[styles.mh100]} - sectionListStyle={[styles.ph2, styles.pb2, styles.overscrollBehaviorContain]} - listItemWrapperStyle={[styles.pr0, styles.pl0]} - getItemHeight={getItemHeight} - onLayout={() => { - setPerformanceTimersEnd(); - setIsInitialRender(false); - }} - showScrollIndicator={!shouldUseNarrowLayout} - sectionTitleStyles={styles.mhn2} - shouldSingleExecuteRowSelect - onArrowFocus={onArrowFocus} - ref={ref} - initiallyFocusedOptionKey={!shouldUseNarrowLayout ? styledRecentReports.at(0)?.keyForList : undefined} - shouldScrollToFocusedIndex={!isInitialRender} - shouldSubscribeToArrowKeyEvents={shouldSubscribeToArrowKeyEvents} - disableKeyboardShortcuts={!shouldSubscribeToArrowKeyEvents} - /> + // On page refresh, when the list is rendered before options are initialized the auto-focusing on initiallyFocusedOptionKey + // will fail because the list will be empty on first render so we only render after options are initialized. + areOptionsInitialized && ( + + showLoadingPlaceholder={!areOptionsInitialized} + fixedNumItemsForLoader={4} + loaderSpeed={CONST.TIMING.SKELETON_ANIMATION_SPEED} + sections={sections} + onSelectRow={onListItemPress} + ListItem={SearchRouterItem} + containerStyle={[styles.mh100]} + sectionListStyle={[styles.ph2, styles.pb2, styles.overscrollBehaviorContain]} + listItemWrapperStyle={[styles.pr0, styles.pl0]} + getItemHeight={getItemHeight} + onLayout={() => { + setPerformanceTimersEnd(); + setIsInitialRender(false); + }} + showScrollIndicator={!shouldUseNarrowLayout} + sectionTitleStyles={styles.mhn2} + shouldSingleExecuteRowSelect + onArrowFocus={onArrowFocus} + ref={ref} + initiallyFocusedOptionKey={!shouldUseNarrowLayout ? styledRecentReports.at(0)?.keyForList : undefined} + shouldScrollToFocusedIndex={!isInitialRender} + shouldSubscribeToArrowKeyEvents={shouldSubscribeToArrowKeyEvents} + disableKeyboardShortcuts={!shouldSubscribeToArrowKeyEvents} + /> + ) ); }