Merge pull request #89192 from software-mansion-labs/@OlGierd03/Spend-fix-Change-Approver-button-navigation

Fix issue #88942: Fix navigation after pressing Change Approver button

Author: arosiclair

src/ROUTES.ts

@@ -491,7 +491,15 @@ const ROUTES = {
             return `search/move-transactions/search/${encodeURIComponent(backTo)}` as const;
         },
     },
-    CHANGE_APPROVER_SEARCH_RHP: 'search/change-approver',
+    CHANGE_APPROVER_SEARCH_RHP: {
+        route: 'search/change-approver/search/:backTo?',
+        getRoute: (backTo?: string) => {
+            if (!backTo) {
+                return 'search/change-approver/search' as const;
+            }
+            return `search/change-approver/search/${encodeURIComponent(backTo)}` as const;
+        },
+    },
     CHANGE_APPROVER_ADD_APPROVER_SEARCH_RHP: 'search/change-approver/add',
 
     // This is a utility route used to go to the user's concierge chat, or the sign-in page if the user's not authenticated

src/hooks/useSearchBulkActions.ts

@@ -1189,7 +1189,7 @@ function useSearchBulkActions({queryJSON}: UseSearchBulkActionsParams) {
                 text: translate('iou.changeApprover.title'),
                 value: CONST.SEARCH.BULK_ACTION_TYPES.CHANGE_APPROVER,
                 shouldCloseModalOnSelect: true,
-                onSelected: () => Navigation.navigate(ROUTES.CHANGE_APPROVER_SEARCH_RHP),
+                onSelected: () => navigateToSearchRHP(ROUTES.CHANGE_APPROVER_SEARCH_RHP),
             });
         }
 

src/libs/Navigation/linkingConfig/config.ts

@@ -1949,7 +1949,10 @@ const config: LinkingOptions<RootNavigatorParamList>['config'] = {
                             path: ROUTES.MOVE_TRANSACTIONS_SEARCH_RHP.route,
                             exact: true,
                         },
-                        [SCREENS.SEARCH.CHANGE_APPROVER.ROOT]: ROUTES.CHANGE_APPROVER_SEARCH_RHP,
+                        [SCREENS.SEARCH.CHANGE_APPROVER.ROOT]: {
+                            path: ROUTES.CHANGE_APPROVER_SEARCH_RHP.route,
+                            exact: true,
+                        },
                         [SCREENS.SEARCH.CHANGE_APPROVER.ADD_APPROVER]: ROUTES.CHANGE_APPROVER_ADD_APPROVER_SEARCH_RHP,
                     },
                 },

src/pages/Search/SearchChangeApproverPage.tsx

@@ -96,7 +96,20 @@ function SearchChangeApproverPage() {
     const [onyxReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {selector: getOnyxReports});
 
     const hasAutoAppliedRef = useRef(false);
+    // Set when navigating to WORKSPACE_UPGRADE; prevents the auto-close in useLayoutEffect from
+    // dismissing the RHP if selectedReports goes transiently empty before this page unmounts
+    // TODO: drop this ref once the CHANGE_APPROVER_SEARCH_RHP `backTo` is removed so navigation matches the regular
+    // "Change approver" flow after upgrading workspace. See https://github.com/Expensify/App/pull/89192.
+    const hasInitiatedUpgradeRef = useRef(false);
     const prevSelectedReportsLength = useRef(0);
+
+    useEffect(() => {
+        if (selectedReports.length === 0) {
+            return;
+        }
+        hasInitiatedUpgradeRef.current = false;
+    }, [selectedReports.length]);
+
     useEffect(() => {
         if (!hasLoadedApp || !selectedReports.length || prevSelectedReportsLength.current === selectedReports.length) {
             return;
@@ -123,12 +136,19 @@ function SearchChangeApproverPage() {
             const policiesToUpgrade = selectedPolicies.filter((policy) => !isControlPolicy(policy));
             if (policiesToUpgrade.length > 1) {
                 // Bulk upgrade is not supported, so show a general page to guide the user to upgrade manually
-                Navigation.navigate(ROUTES.WORKSPACE_UPGRADE.getRoute(undefined, undefined, ROUTES.CHANGE_APPROVER_SEARCH_RHP));
+                hasInitiatedUpgradeRef.current = true;
+                Navigation.navigate(ROUTES.WORKSPACE_UPGRADE.getRoute(undefined, undefined, ROUTES.CHANGE_APPROVER_ADD_APPROVER_SEARCH_RHP), {forceReplace: true});
                 return;
             }
             if (policiesToUpgrade.length === 1) {
+                hasInitiatedUpgradeRef.current = true;
                 Navigation.navigate(
-                    ROUTES.WORKSPACE_UPGRADE.getRoute(policiesToUpgrade.at(0)?.id, CONST.UPGRADE_FEATURE_INTRO_MAPPING.multiApprovalLevels.alias, ROUTES.CHANGE_APPROVER_SEARCH_RHP),
+                    ROUTES.WORKSPACE_UPGRADE.getRoute(
+                        policiesToUpgrade.at(0)?.id,
+                        CONST.UPGRADE_FEATURE_INTRO_MAPPING.multiApprovalLevels.alias,
+                        ROUTES.CHANGE_APPROVER_ADD_APPROVER_SEARCH_RHP,
+                    ),
+                    {forceReplace: true},
                 );
                 return;
             }
@@ -208,6 +228,12 @@ function SearchChangeApproverPage() {
             return;
         }
 
+        // Skip during an upgrade round-trip: selectedReports may be transiently empty while
+        // navigating to WORKSPACE_UPGRADE, and closing the RHP would kill the Add Approver flow.
+        if (hasInitiatedUpgradeRef.current) {
+            return;
+        }
+
         Navigation.setNavigationActionToMicrotaskQueue(() => {
             Navigation.closeRHPFlow();
         });