diff --git a/src/components/ValidateCodeActionModal/index.tsx b/src/components/ValidateCodeActionModal/index.tsx index b848cb501b0f..f715fd8ef136 100644 --- a/src/components/ValidateCodeActionModal/index.tsx +++ b/src/components/ValidateCodeActionModal/index.tsx @@ -38,7 +38,7 @@ function ValidateCodeActionModal({ const hide = useCallback(() => { clearError(); - onClose(); + onClose?.(); }, [onClose, clearError]); useEffect(() => { diff --git a/src/components/ValidateCodeActionModal/type.ts b/src/components/ValidateCodeActionModal/type.ts index 2682ac3a6ea3..2fbf88768e62 100644 --- a/src/components/ValidateCodeActionModal/type.ts +++ b/src/components/ValidateCodeActionModal/type.ts @@ -15,7 +15,7 @@ type ValidateCodeActionModalProps = { descriptionSecondary?: string | null; /** Function to call when the user closes the modal */ - onClose: () => void; + onClose?: () => void; /** Function to be called when the modal is closed */ onModalHide?: () => void; diff --git a/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts b/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts index 7c9f9775cd09..16a4b2613d8f 100755 --- a/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts +++ b/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts @@ -37,7 +37,6 @@ const CENTRAL_PANE_TO_RHP_MAPPING: Partial> = SCREENS.SETTINGS.WALLET.CARD_ACTIVATE, SCREENS.SETTINGS.WALLET.REPORT_VIRTUAL_CARD_FRAUD, SCREENS.SETTINGS.WALLET.CARDS_DIGITAL_DETAILS_UPDATE_ADDRESS, - SCREENS.SETTINGS.WALLET.VERIFY_ACCOUNT, ], [SCREENS.SETTINGS.SECURITY]: [ SCREENS.SETTINGS.TWO_FACTOR_AUTH, diff --git a/src/pages/settings/Wallet/VerifyAccountPage.tsx b/src/pages/settings/Wallet/VerifyAccountPage.tsx index f8e362609d61..5699c0a31cc6 100644 --- a/src/pages/settings/Wallet/VerifyAccountPage.tsx +++ b/src/pages/settings/Wallet/VerifyAccountPage.tsx @@ -8,7 +8,6 @@ import Navigation from '@libs/Navigation/Navigation'; import type {SettingsNavigatorParamList} from '@libs/Navigation/types'; import * as User from '@userActions/User'; import ONYXKEYS from '@src/ONYXKEYS'; -import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; type VerifyAccountPageProps = StackScreenProps; @@ -21,7 +20,6 @@ function VerifyAccountPage({route}: VerifyAccountPageProps) { const loginData = loginList?.[contactMethod]; const validateLoginError = ErrorUtils.getEarliestErrorField(loginData, 'validateLogin'); const [isUserValidated] = useOnyx(ONYXKEYS.USER, {selector: (user) => !!user?.validated}); - const [isValidateCodeActionModalVisible, setIsValidateCodeActionModalVisible] = useState(true); const navigateBackTo = route?.params?.backTo; @@ -39,6 +37,13 @@ function VerifyAccountPage({route}: VerifyAccountPageProps) { User.clearContactMethodErrors(contactMethod, 'validateLogin'); }, [contactMethod]); + const closeModal = useCallback(() => { + // Disable modal visibility so the navigation is animated + setIsValidateCodeActionModalVisible(false); + Navigation.goBack(); + }, []); + + // Handle navigation once the user is validated useEffect(() => { if (!isUserValidated) { return; @@ -46,24 +51,12 @@ function VerifyAccountPage({route}: VerifyAccountPageProps) { setIsValidateCodeActionModalVisible(false); - if (!navigateBackTo) { - return; - } - - Navigation.navigate(navigateBackTo); - }, [isUserValidated, navigateBackTo]); - - useEffect(() => { - if (isValidateCodeActionModalVisible) { - return; - } - - if (!isUserValidated && navigateBackTo) { - Navigation.navigate(ROUTES.SETTINGS_WALLET); - } else if (!navigateBackTo) { + if (navigateBackTo) { + Navigation.navigate(navigateBackTo); + } else { Navigation.goBack(); } - }, [isValidateCodeActionModalVisible, isUserValidated, navigateBackTo]); + }, [isUserValidated, navigateBackTo]); return ( setIsValidateCodeActionModalVisible(false)} clearError={clearError} + onClose={closeModal} + onModalHide={() => {}} /> ); }