Request Physical Card Follow Up

src/libs/GetPhysicalCardUtils.ts

@@ -1,4 +1,3 @@
-import CONST from '@src/CONST';
 import ROUTES from '@src/ROUTES';
 import {Login} from '@src/types/onyx';
 import Navigation from './Navigation/Navigation';
@@ -82,7 +81,7 @@ function setCurrentRoute(currentRoute: string, domain: string, privatePersonalDe
     }
 
     // Redirect the user if he's not allowed to be on the current step
-    Navigation.navigate(expectedRoute, CONST.NAVIGATION.ACTION_TYPE.REPLACE);
+    Navigation.goBack(expectedRoute);
 }
 
 /**

src/libs/Navigation/linkTo.ts

@@ -103,11 +103,6 @@ export default function linkTo(navigation: NavigationContainerRef<RootStackParam
             if (!isActiveRoute && type === CONST.NAVIGATION.ACTION_TYPE.PUSH) {
                 minimalAction.type = CONST.NAVIGATION.ACTION_TYPE.PUSH;
             }
-            // There are situations when the user is trying to access a route which he has no access to
-            // So we want to redirect him to the right one and replace the one he tried to access
-            if (type === CONST.NAVIGATION.ACTION_TYPE.REPLACE) {
-                minimalAction.type = CONST.NAVIGATION.ACTION_TYPE.REPLACE;
-            }
             root.dispatch(minimalAction);
             return;
         }

src/pages/settings/Wallet/ExpensifyCardPage.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import React, {useState} from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import {ScrollView, View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
@@ -87,7 +87,7 @@ const propTypes = {
 };
 
 const defaultProps = {
-    cardList: {},
+    cardList: null,
     draftValues: {
         addressLine1: '',
         addressLine2: '',
@@ -127,17 +127,21 @@ function ExpensifyCardPage({
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
     const {translate} = useLocalize();
-    const domainCards = CardUtils.getDomainCards(cardList)[domain];
-    const virtualCard = _.find(domainCards, (card) => card.isVirtual) || {};
-    const physicalCard = _.find(domainCards, (card) => !card.isVirtual) || {};
+    const domainCards = useMemo(() => cardList && CardUtils.getDomainCards(cardList)[domain], [cardList, domain]);
+    const virtualCard = useMemo(() => (domainCards && _.find(domainCards, (card) => card.isVirtual)) || {}, [domainCards]);
+    const physicalCard = useMemo(() => (domainCards && _.find(domainCards, (card) => !card.isVirtual)) || {}, [domainCards]);
 
     const [isLoading, setIsLoading] = useState(false);
+    const [isNotFound, setIsNotFound] = useState(false);
     const [details, setDetails] = useState({});
     const [cardDetailsError, setCardDetailsError] = useState('');
 
-    if (_.isEmpty(virtualCard) && _.isEmpty(physicalCard)) {
-        return <NotFoundPage onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WALLET)} />;
-    }
+    useEffect(() => {
+        if (!cardList) {
+            return;
+        }
+        setIsNotFound(_.isEmpty(virtualCard) && _.isEmpty(physicalCard));
+    }, [cardList, physicalCard, virtualCard]);
 
     const formattedAvailableSpendAmount = CurrencyUtils.convertToDisplayString(physicalCard.availableSpend || virtualCard.availableSpend || 0);
 
@@ -166,6 +170,10 @@ function ExpensifyCardPage({
     const hasDetectedIndividualFraud = _.some(domainCards, (card) => card.fraud === CONST.EXPENSIFY_CARD.FRAUD_TYPES.INDIVIDUAL);
     const cardDetailsErrorObject = cardDetailsError ? {error: cardDetailsError} : {};
 
+    if (isNotFound) {
+        return <NotFoundPage onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WALLET)} />;
+    }
+
     return (
         <ScreenWrapper
             includeSafeAreaPaddingBottom={false}