revert Expensify#68498

Author: JS00001

src/components/ScrollOffsetContextProvider.tsx

@@ -1,5 +1,4 @@
 import type {ParamListBase} from '@react-navigation/native';
-import {findFocusedRoute} from '@react-navigation/native';
 import React, {createContext, useCallback, useEffect, useMemo, useRef} from 'react';
 import useOnyx from '@hooks/useOnyx';
 import usePrevious from '@hooks/usePrevious';
@@ -41,21 +40,11 @@ const defaultValue: ScrollOffsetContextValue = {
 
 const ScrollOffsetContext = createContext<ScrollOffsetContextValue>(defaultValue);
 
-/** This function is prepared to work with HOME and SEARCH screens. */
+/** This function is prepared to work with HOME screens. May need modification if we want to handle other types of screens. */
 function getKey(route: PlatformStackRouteProp<ParamListBase> | NavigationPartialRoute): string {
-    // Handle routes with direct policyID parameter (HOME screens)
     if (route.params && 'policyID' in route.params && typeof route.params.policyID === 'string') {
         return `${route.name}-${route.params.policyID}`;
     }
-
-    // Handle SEARCH screens with query parameters
-    if (route.name === SCREENS.SEARCH.ROOT && route.params && 'q' in route.params && typeof route.params.q === 'string') {
-        // Encode the query to handle spaces and special characters
-        const encodedQuery = encodeURIComponent(route.params.q);
-        return `${route.name}-${encodedQuery}`;
-    }
-
-    // For other routes, just use route name
     return `${route.name}-global`;
 }
 
@@ -69,9 +58,9 @@ function ScrollOffsetContextProvider({children}: ScrollOffsetContextProviderProp
             return;
         }
 
-        // If the priority mode changes, we need to clear the scroll offsets for the home and search screens because it affects the size of the elements and scroll positions wouldn't be correct.
+        // If the priority mode changes, we need to clear the scroll offsets for the home screens because it affects the size of the elements and scroll positions wouldn't be correct.
         for (const key of Object.keys(scrollOffsetsRef.current)) {
-            if (key.includes(SCREENS.HOME) || key.includes(SCREENS.SEARCH.ROOT)) {
+            if (key.includes(SCREENS.HOME)) {
                 delete scrollOffsetsRef.current[key];
             }
         }
@@ -88,39 +77,16 @@ function ScrollOffsetContextProvider({children}: ScrollOffsetContextProviderProp
         return scrollOffsetsRef.current[getKey(route)];
     }, []);
 
-    const cleanScrollOffsets = useCallback((keys: string[], shouldDelete: (key: string) => boolean) => {
-        keys.forEach((key) => {
-            if (!shouldDelete(key)) {
-                return;
+    const cleanStaleScrollOffsets: ScrollOffsetContextValue['cleanStaleScrollOffsets'] = useCallback((state) => {
+        const sidebarRoutes = state.routes.filter((route) => isSidebarScreenName(route.name));
+        const scrollOffsetKeysOfExistingScreens = sidebarRoutes.map((route) => getKey(route));
+        for (const key of Object.keys(scrollOffsetsRef.current)) {
+            if (!scrollOffsetKeysOfExistingScreens.includes(key)) {
+                delete scrollOffsetsRef.current[key];
             }
-
-            delete scrollOffsetsRef.current[key];
-        });
+        }
     }, []);
 
-    const cleanStaleScrollOffsets: ScrollOffsetContextValue['cleanStaleScrollOffsets'] = useCallback(
-        (state) => {
-            const sidebarRoutes = state.routes.filter((route) => isSidebarScreenName(route.name));
-            const existingScreenKeys = sidebarRoutes.map(getKey);
-
-            const focusedRoute = findFocusedRoute(state);
-            const routeName = focusedRoute?.name;
-
-            const isSearchScreen = routeName === SCREENS.SEARCH.ROOT;
-            const isSearchMoneyRequestReport = routeName === SCREENS.SEARCH.MONEY_REQUEST_REPORT || routeName === SCREENS.SEARCH.REPORT_RHP;
-
-            const scrollOffsetKeys = Object.keys(scrollOffsetsRef.current);
-
-            if (isSearchScreen || isSearchMoneyRequestReport) {
-                const currentKey = focusedRoute ? getKey(focusedRoute) : null;
-                cleanScrollOffsets(scrollOffsetKeys, (key) => key.startsWith(SCREENS.SEARCH.ROOT) && key !== currentKey && !isSearchMoneyRequestReport);
-                return;
-            }
-            cleanScrollOffsets(scrollOffsetKeys, (key) => !existingScreenKeys.includes(key));
-        },
-        [cleanScrollOffsets],
-    );
-
     const saveScrollIndex: ScrollOffsetContextValue['saveScrollIndex'] = useCallback((route, scrollIndex) => {
         scrollOffsetsRef.current[getKey(route)] = scrollIndex;
     }, []);
@@ -129,7 +95,6 @@ function ScrollOffsetContextProvider({children}: ScrollOffsetContextProviderProp
         if (!scrollOffsetsRef.current) {
             return;
         }
-
         return scrollOffsetsRef.current[getKey(route)];
     }, []);
 

src/components/Search/SearchList/index.tsx

@@ -1,6 +1,6 @@
 import {useRoute} from '@react-navigation/native';
 import type {FlashList, FlashListProps, ViewToken} from '@shopify/flash-list';
-import React, {forwardRef, useCallback, useContext, useImperativeHandle, useMemo, useRef, useState} from 'react';
+import React, {forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState} from 'react';
 import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
 import type {NativeSyntheticEvent, StyleProp, ViewStyle} from 'react-native';
@@ -11,7 +11,6 @@ import MenuItem from '@components/MenuItem';
 import Modal from '@components/Modal';
 import {usePersonalDetails} from '@components/OnyxListItemProvider';
 import {PressableWithFeedback} from '@components/Pressable';
-import {ScrollOffsetContext} from '@components/ScrollOffsetContextProvider';
 import {createItemHeightCalculator} from '@components/Search/itemHeightCalculator';
 import ITEM_HEIGHTS from '@components/Search/itemHeights';
 import type {SearchQueryJSON} from '@components/Search/types';
@@ -186,7 +185,6 @@ function SearchList(
     const [userBillingFundID] = useOnyx(ONYXKEYS.NVP_BILLING_FUND_ID, {canBeMissing: true});
 
     const route = useRoute();
-    const {saveScrollOffset, getScrollOffset} = useContext(ScrollOffsetContext);
 
     const handleLongPressRow = useCallback(
         (item: SearchListItem) => {
@@ -347,39 +345,6 @@ function SearchList(
         };
     }, [calculatedListHeight, calculatedListWidth]);
 
-    const handleScroll = useCallback<NonNullable<FlashListProps<SearchListItem>['onScroll']>>(
-        (e) => {
-            if (onScroll && typeof onScroll === 'function') {
-                onScroll(e);
-            }
-
-            if (e.nativeEvent.layoutMeasurement.height > 0) {
-                saveScrollOffset(route, e.nativeEvent.contentOffset.y);
-            }
-        },
-        [onScroll, route, saveScrollOffset],
-    );
-
-    const handleLayout = useCallback(() => {
-        if (onLayout && typeof onLayout === 'function') {
-            onLayout();
-        }
-
-        const offset = getScrollOffset(route);
-        if (!offset || !listRef.current) {
-            return;
-        }
-
-        // Use requestAnimationFrame to ensure proper scrolling on iOS
-        requestAnimationFrame(() => {
-            if (!offset || !listRef.current) {
-                return;
-            }
-
-            listRef.current.scrollToOffset({offset});
-        });
-    }, [onLayout, getScrollOffset, route]);
-
     return (
         <View style={[styles.flex1, !isKeyboardShown && safeAreaPaddingBottomStyle, containerStyle]}>
             {tableHeaderVisible && (
@@ -418,7 +383,8 @@ function SearchList(
                 renderItem={renderItem}
                 onSelectRow={onSelectRow}
                 keyExtractor={keyExtractor}
-                onScroll={handleScroll}
+                onScroll={onScroll}
+                showsVerticalScrollIndicator={false}
                 ref={listRef}
                 scrollToIndex={scrollToIndex}
                 isFocused={isFocused}
@@ -427,7 +393,9 @@ function SearchList(
                 onEndReachedThreshold={onEndReachedThreshold}
                 ListFooterComponent={ListFooterComponent}
                 onViewableItemsChanged={onViewableItemsChanged}
-                onLayout={handleLayout}
+                onLayout={onLayout}
+                removeClippedSubviews
+                drawDistance={1000}
                 estimatedItemSize={estimatedItemSize}
                 overrideItemLayout={overrideItemLayout}
                 estimatedListSize={estimatedListSize}