From 1e3f31b43d97c463eeb735ea35a68a599f760714 Mon Sep 17 00:00:00 2001
From: nkdengineer <nkdengineer@outlook.com>
Date: Wed, 7 May 2025 11:42:10 +0700
Subject: [PATCH] move scroll to onLayout

---
 src/components/Search/SearchList.tsx     | 5 +++++
 src/components/Search/index.tsx          | 7 +++++--
 src/hooks/useSearchHighlightAndScroll.ts | 2 +-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/Search/SearchList.tsx b/src/components/Search/SearchList.tsx
index b193fb11cf71..aff5b5ae2704 100644
--- a/src/components/Search/SearchList.tsx
+++ b/src/components/Search/SearchList.tsx
@@ -77,6 +77,9 @@ type SearchListProps = Pick<FlatListPropsWithLayout<SearchListItem>, 'onScroll'
 
     /** Called when the viewability of rows changes, as defined by the viewabilityConfig prop. */
     onViewableItemsChanged?: (info: {changed: ViewToken[]; viewableItems: ViewToken[]}) => void;
+
+    /** Invoked on mount and layout changes */
+    onLayout?: () => void;
 };
 
 const onScrollToIndexFailed = () => {};
@@ -101,6 +104,7 @@ function SearchList(
         queryJSONHash,
         shouldGroupByReports,
         onViewableItemsChanged,
+        onLayout,
     }: SearchListProps,
     ref: ForwardedRef<SearchListHandle>,
 ) {
@@ -393,6 +397,7 @@ function SearchList(
                 removeClippedSubviews
                 onViewableItemsChanged={onViewableItemsChanged}
                 onScrollToIndexFailed={onScrollToIndexFailed}
+                onLayout={onLayout}
             />
             <Modal
                 isVisible={isModalVisible}
diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx
index b3550cef8611..66af91461fb1 100644
--- a/src/components/Search/index.tsx
+++ b/src/components/Search/index.tsx
@@ -6,7 +6,7 @@ import {useOnyx} from 'react-native-onyx';
 import FullPageErrorView from '@components/BlockingViews/FullPageErrorView';
 import FullPageOfflineBlockingView from '@components/BlockingViews/FullPageOfflineBlockingView';
 import SearchTableHeader from '@components/SelectionList/SearchTableHeader';
-import type {ReportActionListItemType, ReportListItemType, SearchListItem, TransactionListItemType} from '@components/SelectionList/types';
+import type {ReportActionListItemType, ReportListItemType, SearchListItem, SelectionListHandle, TransactionListItemType} from '@components/SelectionList/types';
 import SearchRowSkeleton from '@components/Skeletons/SearchRowSkeleton';
 import useLocalize from '@hooks/useLocalize';
 import useMobileSelectionMode from '@hooks/useMobileSelectionMode';
@@ -158,6 +158,8 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS
     const [reportActions] = useOnyx(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {canBeMissing: true});
     const previousReportActions = usePrevious(reportActions);
     const {translate} = useLocalize();
+    const searchListRef = useRef<SelectionListHandle | null>(null);
+
     const shouldGroupByReports = groupBy === CONST.SEARCH.GROUP_BY.REPORTS;
 
     const {canUseTableReportView} = usePermissions();
@@ -540,7 +542,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS
     return (
         <SearchScopeProvider isOnSearch>
             <SearchList
-                ref={handleSelectionListScroll(sortedSelectedData)}
+                ref={searchListRef}
                 data={sortedSelectedData}
                 ListItem={ListItem}
                 onSelectRow={openReport}
@@ -579,6 +581,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS
                 }
                 queryJSONHash={hash}
                 onViewableItemsChanged={onViewableItemsChanged}
+                onLayout={() => handleSelectionListScroll(sortedSelectedData, searchListRef.current)}
             />
         </SearchScopeProvider>
     );
diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts
index 271bdd21e6cf..3c6f4d2e0d50 100644
--- a/src/hooks/useSearchHighlightAndScroll.ts
+++ b/src/hooks/useSearchHighlightAndScroll.ts
@@ -143,7 +143,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans
      * Callback to handle scrolling to the new search result.
      */
     const handleSelectionListScroll = useCallback(
-        (data: SearchListItem[]) => (ref: SelectionListHandle | null) => {
+        (data: SearchListItem[], ref: SelectionListHandle | null) => {
             // Early return if there's no ref, new transaction wasn't brought in by this hook
             // or there's no new search result key
             if (!ref || !triggeredByHookRef.current || newSearchResultKey === null) {