diff --git a/src/CONST/index.ts b/src/CONST/index.ts index 78e7cf9c8f6ac..c062336611c1c 100755 --- a/src/CONST/index.ts +++ b/src/CONST/index.ts @@ -5191,7 +5191,7 @@ const CONST = { * The maximum count of items per page for SelectionList. * When paginate, it multiplies by page number. */ - MAX_SELECTION_LIST_PAGE_LENGTH: 500, + MAX_SELECTION_LIST_PAGE_LENGTH: 50, /** * Bank account names diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx index 765813b7aa228..e0790727cb938 100644 --- a/src/components/SelectionList/BaseSelectionList.tsx +++ b/src/components/SelectionList/BaseSelectionList.tsx @@ -195,6 +195,35 @@ function BaseSelectionList( return canShowProductTrainingTooltip && isFocused; }, [canShowProductTrainingTooltip, isFocused]); + // Calculate initial page count so selected item is loaded + const initialPageCount = useMemo(() => { + if (canSelectMultiple || sections.length === 0) { + return 1; + } + + let currentIndex = 0; + for (const section of sections) { + if (section.data) { + for (const item of section.data) { + if (isItemSelected(item)) { + return Math.floor(currentIndex / CONST.MAX_SELECTION_LIST_PAGE_LENGTH) + 1; + } + currentIndex++; + } + } + } + + return 1; + }, [sections, canSelectMultiple, isItemSelected]); + + useEffect(() => { + if (initialPageCount < 1) { + return; + } + + setCurrentPage(initialPageCount); + }, [initialPageCount]); + /** * Iterates through the sections and items inside each section, and builds 4 arrays along the way: * - `allOptions`: Contains all the items in the list, flattened, regardless of section @@ -777,7 +806,9 @@ function BaseSelectionList( : 0; // Reset the current page to 1 when the user types something - setCurrentPage(1); + if (prevTextInputValue !== textInputValue) { + setCurrentPage(1); + } updateAndScrollToFocusedIndex(newSelectedIndex); }, [