From 39368a0a7cc8074db9ab606f297407d4b45561ab Mon Sep 17 00:00:00 2001 From: daledah Date: Fri, 4 Oct 2024 17:58:07 +0700 Subject: [PATCH 1/4] fix: remove add bank account page from central pane mapping --- src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts | 1 - 1 file changed, 1 deletion(-) 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 5d2a6b75c224..495554dae58f 100755 --- a/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts +++ b/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts @@ -38,7 +38,6 @@ const CENTRAL_PANE_TO_RHP_MAPPING: Partial> = SCREENS.SETTINGS.WALLET.REPORT_VIRTUAL_CARD_FRAUD, SCREENS.SETTINGS.WALLET.CARDS_DIGITAL_DETAILS_UPDATE_ADDRESS, SCREENS.SETTINGS.WALLET.VERIFY_ACCOUNT, - SCREENS.SETTINGS.ADD_BANK_ACCOUNT, ], [SCREENS.SETTINGS.SECURITY]: [ SCREENS.SETTINGS.TWO_FACTOR_AUTH, From a4e7499a0d1b42ac3930f12fd459d3949b3562c5 Mon Sep 17 00:00:00 2001 From: daledah Date: Thu, 10 Oct 2024 17:50:45 +0700 Subject: [PATCH 2/4] fix: fix goBack in add bank account flow --- src/components/SettlementButton/index.tsx | 2 +- src/libs/actions/BankAccounts.ts | 5 ++++- src/pages/AddPersonalBankAccountPage.tsx | 22 ++++++++++++++++--- .../AddBankAccount/AddBankAccount.tsx | 4 ++-- src/pages/EnablePayments/EnablePayments.tsx | 2 +- src/pages/home/report/ReportActionItem.tsx | 3 ++- 6 files changed, 29 insertions(+), 9 deletions(-) diff --git a/src/components/SettlementButton/index.tsx b/src/components/SettlementButton/index.tsx index f371545ab7b0..f859f4a36803 100644 --- a/src/components/SettlementButton/index.tsx +++ b/src/components/SettlementButton/index.tsx @@ -190,7 +190,7 @@ function SettlementButton({ if (iouPaymentType === CONST.IOU.PAYMENT_TYPE.EXPENSIFY || iouPaymentType === CONST.IOU.PAYMENT_TYPE.VBBA) { if (!isUserValidated) { - Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute()); + Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute(ROUTES.SETTINGS_ADD_BANK_ACCOUNT)); return; } triggerKYCFlow(event, iouPaymentType); diff --git a/src/libs/actions/BankAccounts.ts b/src/libs/actions/BankAccounts.ts index 3007bd2cb88c..6679a6e4b9ea 100644 --- a/src/libs/actions/BankAccounts.ts +++ b/src/libs/actions/BankAccounts.ts @@ -73,11 +73,14 @@ function setPlaidEvent(eventName: string | null) { /** * Open the personal bank account setup flow, with an optional exitReportID to redirect to once the flow is finished. */ -function openPersonalBankAccountSetupView(exitReportID?: string) { +function openPersonalBankAccountSetupView(exitReportID?: string, isUserValidated = true) { clearPlaid().then(() => { if (exitReportID) { Onyx.merge(ONYXKEYS.PERSONAL_BANK_ACCOUNT, {exitReportID}); } + if (!isUserValidated) { + Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute(ROUTES.SETTINGS_ADD_BANK_ACCOUNT)); + } Navigation.navigate(ROUTES.SETTINGS_ADD_BANK_ACCOUNT); }); } diff --git a/src/pages/AddPersonalBankAccountPage.tsx b/src/pages/AddPersonalBankAccountPage.tsx index fdc200f45ad9..7b0a76e59922 100644 --- a/src/pages/AddPersonalBankAccountPage.tsx +++ b/src/pages/AddPersonalBankAccountPage.tsx @@ -15,6 +15,7 @@ import * as BankAccounts from '@userActions/BankAccounts'; import * as PaymentMethods from '@userActions/PaymentMethods'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; +import SCREENS from '@src/SCREENS'; import INPUT_IDS from '@src/types/form/ReimbursementAccountForm'; function AddPersonalBankAccountPage() { @@ -25,6 +26,21 @@ function AddPersonalBankAccountPage() { const [personalBankAccount] = useOnyx(ONYXKEYS.PERSONAL_BANK_ACCOUNT); const [plaidData] = useOnyx(ONYXKEYS.PLAID_DATA); const shouldShowSuccess = personalBankAccount?.shouldShowSuccess ?? false; + const topMostCentralPane = Navigation.getTopMostCentralPaneRouteFromRootState(); + + const goBack = useCallback(() => { + switch (topMostCentralPane?.name) { + case SCREENS.SETTINGS.WALLET.ROOT: + Navigation.goBack(ROUTES.SETTINGS_WALLET, true); + break; + case SCREENS.REPORT: + Navigation.closeRHPFlow(); + break; + default: + Navigation.goBack(); + break; + } + }, [topMostCentralPane]); const submitBankAccountForm = useCallback(() => { const bankAccounts = plaidData?.bankAccounts ?? []; @@ -45,10 +61,10 @@ function AddPersonalBankAccountPage() { } else if (shouldContinue && onSuccessFallbackRoute) { PaymentMethods.continueSetup(onSuccessFallbackRoute); } else { - Navigation.navigate(ROUTES.SETTINGS_WALLET); + goBack(); } }, - [personalBankAccount], + [personalBankAccount, goBack], ); useEffect(() => BankAccounts.clearPersonalBankAccount, []); @@ -90,7 +106,7 @@ function AddPersonalBankAccountPage() { text={translate('walletPage.chooseAccountBody')} plaidData={plaidData} isDisplayedInWalletFlow - onExitPlaid={() => Navigation.navigate(ROUTES.SETTINGS_WALLET)} + onExitPlaid={goBack} receivedRedirectURI={getPlaidOAuthReceivedRedirectURI()} selectedPlaidAccountID={selectedPlaidAccountId} /> diff --git a/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx b/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx index a274990ea6a7..c272a616520b 100644 --- a/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx +++ b/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx @@ -64,7 +64,7 @@ function AddBankAccount({personalBankAccount, plaidData, personalBankAccountDraf PaymentMethods.continueSetup(onSuccessFallbackRoute); return; } - Navigation.goBack(); + Navigation.goBack(ROUTES.SETTINGS_WALLET, true); }; const handleBackButtonPress = () => { @@ -75,7 +75,7 @@ function AddBankAccount({personalBankAccount, plaidData, personalBankAccountDraf if (screenIndex === 0) { BankAccounts.clearPersonalBankAccount(); Wallet.updateCurrentStep(null); - Navigation.goBack(ROUTES.SETTINGS_WALLET); + Navigation.goBack(ROUTES.SETTINGS_WALLET, true); return; } prevScreen(); diff --git a/src/pages/EnablePayments/EnablePayments.tsx b/src/pages/EnablePayments/EnablePayments.tsx index 742202e43bb3..357a2be9b1e0 100644 --- a/src/pages/EnablePayments/EnablePayments.tsx +++ b/src/pages/EnablePayments/EnablePayments.tsx @@ -46,7 +46,7 @@ function EnablePaymentsPage() { > Navigation.goBack(ROUTES.SETTINGS_WALLET)} + onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WALLET, true)} /> diff --git a/src/pages/home/report/ReportActionItem.tsx b/src/pages/home/report/ReportActionItem.tsx index 5b826b94aa77..667301f42e67 100644 --- a/src/pages/home/report/ReportActionItem.tsx +++ b/src/pages/home/report/ReportActionItem.tsx @@ -195,6 +195,7 @@ function ReportActionItem({ const popoverAnchorRef = useRef>(null); const downloadedPreviews = useRef([]); const prevDraftMessage = usePrevious(draftMessage); + const [isUserValidated] = useOnyx(ONYXKEYS.USER, {selector: (user) => !!user?.validated}); // The app would crash due to subscribing to the entire report collection if parentReportID is an empty string. So we should have a fallback ID here. // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing @@ -599,7 +600,7 @@ function ReportActionItem({ success style={[styles.w100, styles.requestPreviewBox]} text={translate('bankAccount.addBankAccount')} - onPress={() => BankAccounts.openPersonalBankAccountSetupView(Navigation.getTopmostReportId() ?? linkedReport?.reportID)} + onPress={() => BankAccounts.openPersonalBankAccountSetupView(Navigation.getTopmostReportId() ?? linkedReport?.reportID, isUserValidated)} pressOnEnter large /> From 92c2496b59862275720d629366a53a3c27f5e43c Mon Sep 17 00:00:00 2001 From: daledah Date: Thu, 10 Oct 2024 18:04:55 +0700 Subject: [PATCH 3/4] fix: migrate withOnyx --- .../AddBankAccount/AddBankAccount.tsx | 35 ++++--------------- 1 file changed, 6 insertions(+), 29 deletions(-) diff --git a/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx b/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx index c272a616520b..55f19f8c35b9 100644 --- a/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx +++ b/src/pages/EnablePayments/AddBankAccount/AddBankAccount.tsx @@ -1,7 +1,6 @@ import React, {useCallback} from 'react'; import {View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import InteractiveStepSubHeader from '@components/InteractiveStepSubHeader'; import ScreenWrapper from '@components/ScreenWrapper'; @@ -16,26 +15,15 @@ import * as Wallet from '@userActions/Wallet'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type {PersonalBankAccountForm} from '@src/types/form'; -import type {PersonalBankAccount, PlaidData} from '@src/types/onyx'; import SetupMethod from './SetupMethod'; import Confirmation from './substeps/ConfirmationStep'; import Plaid from './substeps/PlaidStep'; -type AddPersonalBankAccountPageWithOnyxProps = { - /** Contains plaid data */ - plaidData: OnyxEntry; - - /** The details about the Personal bank account we are adding saved in Onyx */ - personalBankAccount: OnyxEntry; - - /** The draft values of the bank account being setup */ - personalBankAccountDraft: OnyxEntry; -}; - const plaidSubsteps: Array> = [Plaid, Confirmation]; - -function AddBankAccount({personalBankAccount, plaidData, personalBankAccountDraft}: AddPersonalBankAccountPageWithOnyxProps) { +function AddBankAccount() { + const [plaidData] = useOnyx(ONYXKEYS.PLAID_DATA); + const [personalBankAccount] = useOnyx(ONYXKEYS.PERSONAL_BANK_ACCOUNT); + const [personalBankAccountDraft] = useOnyx(ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM_DRAFT); const {translate} = useLocalize(); const styles = useThemeStyles(); @@ -118,15 +106,4 @@ function AddBankAccount({personalBankAccount, plaidData, personalBankAccountDraf AddBankAccount.displayName = 'AddBankAccountPage'; -export default withOnyx({ - plaidData: { - key: ONYXKEYS.PLAID_DATA, - }, - // @ts-expect-error: ONYXKEYS.PERSONAL_BANK_ACCOUNT is conflicting with ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM - personalBankAccount: { - key: ONYXKEYS.PERSONAL_BANK_ACCOUNT, - }, - personalBankAccountDraft: { - key: ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM_DRAFT, - }, -})(AddBankAccount); +export default AddBankAccount; From 4454d3952cde9ed09075cc366a39a910b8b8ba72 Mon Sep 17 00:00:00 2001 From: daledah Date: Fri, 11 Oct 2024 17:49:41 +0700 Subject: [PATCH 4/4] fix: resolve conflict --- src/pages/home/report/ReportActionItem.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/pages/home/report/ReportActionItem.tsx b/src/pages/home/report/ReportActionItem.tsx index e5d2ceff2716..f2e444b5a1b6 100644 --- a/src/pages/home/report/ReportActionItem.tsx +++ b/src/pages/home/report/ReportActionItem.tsx @@ -197,12 +197,8 @@ function ReportActionItem({ const popoverAnchorRef = useRef>(null); const downloadedPreviews = useRef([]); const prevDraftMessage = usePrevious(draftMessage); -<<<<<<< HEAD const [isUserValidated] = useOnyx(ONYXKEYS.USER, {selector: (user) => !!user?.validated}); -======= const {canUseP2PDistanceRequests} = usePermissions(); ->>>>>>> main - // The app would crash due to subscribing to the entire report collection if parentReportID is an empty string. So we should have a fallback ID here. // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing const [parentReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${report?.parentReportID || -1}`);