Use CommonAction.reset to dismissModal when wide rhp is visible

Author: WojtekBoman

src/libs/Navigation/AppNavigator/AuthScreens.tsx

@@ -1,5 +1,5 @@
 import type {RouteProp} from '@react-navigation/native';
-import {StackActions} from '@react-navigation/native';
+import {StackActions, useNavigation} from '@react-navigation/native';
 import type {StackCardInterpolationProps} from '@react-navigation/stack';
 import React, {memo, useContext, useEffect, useMemo, useRef, useState} from 'react';
 import ComposeProviders from '@components/ComposeProviders';
@@ -32,7 +32,7 @@ import KeyboardShortcut from '@libs/KeyboardShortcut';
 import Log from '@libs/Log';
 import NavBarManager from '@libs/NavBarManager';
 import getCurrentUrl from '@libs/Navigation/currentUrl';
-import Navigation, {navigationRef} from '@libs/Navigation/Navigation';
+import Navigation from '@libs/Navigation/Navigation';
 import Animations, {InternalPlatformAnimations} from '@libs/Navigation/PlatformStackNavigation/navigationOptions/animation';
 import Presentation from '@libs/Navigation/PlatformStackNavigation/navigationOptions/presentation';
 import type {AuthScreensParamList} from '@libs/Navigation/types';
@@ -357,16 +357,6 @@ function AuthScreens() {
                     return;
                 }
 
-                const rootState = navigationRef.getRootState();
-                const lastRoute = rootState.routes.at(-1);
-                if (lastRoute?.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR) {
-                    const rhpRoutes = lastRoute?.state?.routes;
-                    if (rhpRoutes?.at(0)?.name === SCREENS.RIGHT_MODAL.SEARCH_REPORT && rhpRoutes?.length > 1) {
-                        navigationRef.dispatch({...StackActions.popToTop(), target: lastRoute.state?.key});
-                        return;
-                    }
-                }
-
                 Navigation.dismissModal();
             },
             shortcutConfig.descriptionKey,

src/libs/Navigation/AppNavigator/createRootStackNavigator/GetStateForActionHandlers.ts

@@ -1,5 +1,5 @@
-import type {CommonActions, RouterConfigOptions, StackActionType, StackNavigationState} from '@react-navigation/native';
-import {StackActions} from '@react-navigation/native';
+import type {RouterConfigOptions, StackActionType, StackNavigationState} from '@react-navigation/native';
+import {CommonActions, StackActions} from '@react-navigation/native';
 import type {ParamListBase, Router} from '@react-navigation/routers';
 import SCREENS_WITH_NAVIGATION_TAB_BAR from '@components/Navigation/TopLevelNavigationTabBar/SCREENS_WITH_NAVIGATION_TAB_BAR';
 import getIsNarrowLayout from '@libs/getIsNarrowLayout';
@@ -152,17 +152,26 @@ function handleDismissModalAction(
         return null;
     }
 
-    let newAction = StackActions.pop();
-
-    if (lastRoute?.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR) {
+    if (lastRoute?.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR && lastRoute?.state) {
         const rhpRoutes = lastRoute?.state?.routes;
         // This handles closing the modal when wide rhp is visible
-        if (rhpRoutes?.at(0)?.name === SCREENS.RIGHT_MODAL.SEARCH_REPORT && rhpRoutes?.length > 1) {
-            newAction = {...StackActions.popToTop(), target: lastRoute.state?.key};
-            return;
+        const wideRhpIndex = rhpRoutes.findLastIndex((rhpRoute) => rhpRoute.name === SCREENS.RIGHT_MODAL.SEARCH_REPORT);
+        if (wideRhpIndex > -1 && wideRhpIndex !== rhpRoutes.length - 1) {
+            const modifiedRhp = {
+                ...lastRoute,
+                state: {
+                    ...lastRoute.state,
+                    index: wideRhpIndex,
+                    routes: lastRoute.state.routes.slice(0, wideRhpIndex + 1),
+                    history: lastRoute.state.history?.slice(0, wideRhpIndex + 1),
+                },
+            };
+            const modifiedState = {...state, routes: [...state.routes.slice(0, -1), modifiedRhp]};
+            const action = CommonActions.reset(modifiedState);
+            return stackRouter.getStateForAction(state, action, configOptions);
         }
     }
-
+    const newAction = StackActions.pop();
     return stackRouter.getStateForAction(state, newAction, configOptions);
 }