Merge pull request #28486 from dukenv0307/fix/28241

Fix navigation breaks on opening search page after reloading the attachment

src/components/PopoverWithoutOverlay/index.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useRef} from 'react';
 import {View} from 'react-native';
 import {SafeAreaInsetsContext} from 'react-native-safe-area-context';
 import {PopoverContext} from '../PopoverProvider';
@@ -8,9 +8,11 @@ import styles from '../../styles/styles';
 import * as StyleUtils from '../../styles/StyleUtils';
 import getModalStyles from '../../styles/getModalStyles';
 import withWindowDimensions from '../withWindowDimensions';
+import usePrevious from '../../hooks/usePrevious';
 
 function Popover(props) {
     const {onOpen, close} = React.useContext(PopoverContext);
+    const firstRenderRef = useRef(true);
     const {modalStyle, modalContainerStyle, shouldAddTopSafeAreaMargin, shouldAddBottomSafeAreaMargin, shouldAddTopSafeAreaPadding, shouldAddBottomSafeAreaPadding} = getModalStyles(
         'popover',
         {
@@ -23,6 +25,8 @@ function Popover(props) {
         props.outerStyle,
     );
 
+    const prevIsVisible = usePrevious(props.isVisible);
+
     React.useEffect(() => {
         if (props.isVisible) {
             props.onModalShow();
@@ -37,11 +41,18 @@ function Popover(props) {
             Modal.onModalDidClose();
         }
         Modal.willAlertModalBecomeVisible(props.isVisible);
+
+        // We prevent setting closeModal function to null when the component is invisible the first time it is rendered
+        if (prevIsVisible === props.isVisible && (!firstRenderRef.current || !props.isVisible)) {
+            firstRenderRef.current = false;
+            return;
+        }
+        firstRenderRef.current = false;
         Modal.setCloseModal(props.isVisible ? () => props.onClose(props.anchorRef) : null);
 
         // We want this effect to run strictly ONLY when isVisible prop changes
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.isVisible]);
+    }, [props.isVisible, prevIsVisible]);
 
     if (!props.isVisible) {
         return null;