Merge pull request #27268 from tienifr/fix/26178

fix: 26178 Context menu does not close after user goes to the previous page

Author: youssef-lr

src/libs/Navigation/NavigationRoot.js

@@ -11,6 +11,8 @@ import Log from '../Log';
 import StatusBar from '../StatusBar';
 import useCurrentReportID from '../../hooks/useCurrentReportID';
 import useWindowDimensions from '../../hooks/useWindowDimensions';
+import * as ReportActionContextMenu from '../../pages/home/report/ContextMenu/ReportActionContextMenu';
+import * as EmojiPickerAction from '../actions/EmojiPickerAction';
 
 // https://reactnavigation.org/docs/themes
 const navigationTheme = {
@@ -121,6 +123,10 @@ function NavigationRoot(props) {
         if (!state) {
             return;
         }
+        ReportActionContextMenu.hideContextMenu();
+        ReportActionContextMenu.hideDeleteModal();
+        EmojiPickerAction.hideEmojiPicker(true);
+
         updateCurrentReportID(state);
         parseAndLogRoute(state);
         animateStatusBarBackgroundColor();

src/pages/home/report/ReactionList/PopoverReactionList/BasePopoverReactionList.js

@@ -198,6 +198,9 @@ class BasePopoverReactionList extends React.Component {
      * Hide the ReactionList modal popover.
      */
     hideReactionList() {
+        if (!this.state.isPopoverVisible) {
+            return;
+        }
         this.setState({
             isPopoverVisible: false,
         });

src/pages/home/report/ReportActionsView.js

@@ -132,6 +132,13 @@ function ReportActionsView(props) {
         }
     }, [props.report, didSubscribeToReportTypingEvents, reportID]);
 
+    useEffect(() => {
+        if (isFocused || !context.reactionListRef || !context.reactionListRef.current) {
+            return;
+        }
+        context.reactionListRef.current.hideReactionList();
+    }, [isFocused, context.reactionListRef]);
+
     /**
      * Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
      * displaying.