Fix/69112 - Search input and filters disappear after deleting several reports

src/components/Search/SearchList/BaseSearchList/index.native.tsx

@@ -24,8 +24,8 @@ function BaseSearchList({
     calculatedListHeight,
 }: BaseSearchListProps) {
     const renderItemWithoutKeyboardFocus = useCallback(
-        ({item}: {item: SearchListItem; index: number}) => {
-            return renderItem(item, false, undefined);
+        ({item, index}: {item: SearchListItem; index: number}) => {
+            return renderItem(item, index, false, undefined);
         },
         [renderItem],
     );

src/components/Search/SearchList/BaseSearchList/index.tsx

@@ -75,7 +75,7 @@ function BaseSearchList({
                 }
                 setFocusedIndex(index);
             };
-            return renderItem(item, isItemFocused, onFocus);
+            return renderItem(item, index, isItemFocused, onFocus);
         },
         [focusedIndex, renderItem, setFocusedIndex],
     );

src/components/Search/SearchList/BaseSearchList/types.ts

@@ -25,7 +25,7 @@ type BaseSearchListProps = Pick<
     data: SearchListItem[];
 
     /** The function to render each item in the list */
-    renderItem: (item: SearchListItem, isItemFocused: boolean, onFocus?: (event: NativeSyntheticEvent<ExtendedTargetedEvent>) => void) => React.JSX.Element;
+    renderItem: (item: SearchListItem, index: number, isItemFocused: boolean, onFocus?: (event: NativeSyntheticEvent<ExtendedTargetedEvent>) => void) => React.JSX.Element;
 
     /** The columns that might change to trigger re-render via extraData */
     columns: SearchColumnType[];

src/components/Search/SearchList/index.tsx

@@ -272,15 +272,16 @@ function SearchList(
     useImperativeHandle(ref, () => ({scrollToIndex}), [scrollToIndex]);
 
     const renderItem = useCallback(
-        (item: SearchListItem, isItemFocused: boolean, onFocus?: (event: NativeSyntheticEvent<ExtendedTargetedEvent>) => void) => {
+        (item: SearchListItem, index: number, isItemFocused: boolean, onFocus?: (event: NativeSyntheticEvent<ExtendedTargetedEvent>) => void) => {
             const isDisabled = item.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE;
+            const shouldApplyAnimation = shouldAnimate && index < data.length - 1;
 
             return (
                 <Animated.View
-                    exiting={shouldAnimate && isFocused ? FadeOutUp.duration(CONST.SEARCH.EXITING_ANIMATION_DURATION).easing(easing) : undefined}
+                    exiting={shouldApplyAnimation && isFocused ? FadeOutUp.duration(CONST.SEARCH.EXITING_ANIMATION_DURATION).easing(easing) : undefined}
                     entering={undefined}
                     style={styles.overflowHidden}
-                    layout={shouldAnimate && hasItemsBeingRemoved && isFocused ? LinearTransition.easing(easing).duration(CONST.SEARCH.EXITING_ANIMATION_DURATION) : undefined}
+                    layout={shouldApplyAnimation && hasItemsBeingRemoved && isFocused ? LinearTransition.easing(easing).duration(CONST.SEARCH.EXITING_ANIMATION_DURATION) : undefined}
                 >
                     <ListItem
                         showTooltip
@@ -313,6 +314,7 @@ function SearchList(
         [
             shouldAnimate,
             isFocused,
+            data.length,
             styles.overflowHidden,
             hasItemsBeingRemoved,
             ListItem,

src/pages/Search/SearchPageNarrow.tsx

@@ -96,6 +96,7 @@ function SearchPageNarrow({queryJSON, headerButtonsOptions, searchResults, isMob
                 runOnJS(triggerScrollEvent)();
                 const {contentOffset, layoutMeasurement, contentSize} = event;
                 if (windowHeight > contentSize.height) {
+                    topBarOffset.set(StyleUtils.searchHeaderDefaultOffset);
                     return;
                 }
                 const currentOffset = contentOffset.y;