diff --git a/src/components/KYCWall/BaseKYCWall.tsx b/src/components/KYCWall/BaseKYCWall.tsx index 4db3ef50eae2..cb1f76825fe8 100644 --- a/src/components/KYCWall/BaseKYCWall.tsx +++ b/src/components/KYCWall/BaseKYCWall.tsx @@ -10,7 +10,7 @@ import getClickedTargetLocation from '@libs/getClickedTargetLocation'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import {hasExpensifyPaymentMethod} from '@libs/PaymentUtils'; -import {isExpenseReport as isExpenseReportReportUtils, isIOUReport} from '@libs/ReportUtils'; +import {getBankAccountRoute, isExpenseReport as isExpenseReportReportUtils, isIOUReport} from '@libs/ReportUtils'; import {kycWallRef} from '@userActions/PaymentMethods'; import {createWorkspaceFromIOUPayment} from '@userActions/Policy/Policy'; import {setKYCWallSource} from '@userActions/Wallet'; @@ -52,6 +52,7 @@ function KYCWall({ const [fundList] = useOnyx(ONYXKEYS.FUND_LIST, {canBeMissing: true}); const [bankAccountList = getEmptyObject()] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST, {canBeMissing: true}); const [reimbursementAccount] = useOnyx(ONYXKEYS.REIMBURSEMENT_ACCOUNT, {canBeMissing: true}); + const [chatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`, {canBeMissing: true}); const anchorRef = useRef(null); const transferBalanceButtonRef = useRef(null); @@ -122,10 +123,11 @@ function KYCWall({ return; } - Navigation.navigate(addBankAccountRoute); + const bankAccountRoute = addBankAccountRoute ?? getBankAccountRoute(chatReport); + Navigation.navigate(bankAccountRoute); } }, - [addBankAccountRoute, addDebitCardRoute, iouReport, onSelectPaymentMethod], + [addBankAccountRoute, addDebitCardRoute, chatReport, iouReport, onSelectPaymentMethod], ); /** diff --git a/src/components/KYCWall/types.ts b/src/components/KYCWall/types.ts index 5214e5ea15b9..06fd42d3103a 100644 --- a/src/components/KYCWall/types.ts +++ b/src/components/KYCWall/types.ts @@ -23,7 +23,7 @@ type PaymentMethod = ValueOf; type KYCWallProps = { /** Route for the Add Bank Account screen for a given navigation stack */ - addBankAccountRoute: Route; + addBankAccountRoute?: Route; /** Route for the Add Debit Card screen for a given navigation stack */ addDebitCardRoute?: Route; diff --git a/src/components/MoneyReportHeader.tsx b/src/components/MoneyReportHeader.tsx index fa3c4f6cff1f..0bca126c77a6 100644 --- a/src/components/MoneyReportHeader.tsx +++ b/src/components/MoneyReportHeader.tsx @@ -32,7 +32,6 @@ import {getSecondaryReportActions} from '@libs/ReportSecondaryActionUtils'; import { changeMoneyRequestHoldStatus, getArchiveReason, - getBankAccountRoute, getIntegrationIcon, getIntegrationNameFromExportMessage as getIntegrationNameFromExportMessageUtils, getNextApproverAccountID, @@ -313,7 +312,6 @@ function MoneyReportHeader({ const optimisticNextStep = isSubmitterSameAsNextApprover && policy?.preventSelfApproval ? buildOptimisticNextStepForPreventSelfApprovalsEnabled() : nextStep; const shouldShowNextStep = isFromPaidPolicy && !isInvoiceReport && !shouldShowStatusBar; - const bankAccountRoute = getBankAccountRoute(chatReport); const {nonHeldAmount, fullAmount, hasValidNonHeldAmount} = getNonHeldAndFullAmount(moneyRequestReport, shouldShowPayButton); const isAnyTransactionOnHold = hasHeldExpensesReportUtils(moneyRequestReport?.reportID); const {isDelegateAccessRestricted, showDelegateNoAccessModal} = useContext(DelegateNoAccessContext); @@ -477,7 +475,6 @@ function MoneyReportHeader({ const {formattedAmount: totalAmount} = hasOnlyHeldExpenses ? getAmount(CONST.REPORT.REPORT_PREVIEW_ACTIONS.REVIEW) : getAmount(CONST.REPORT.PRIMARY_ACTIONS.PAY); const paymentButtonOptions = usePaymentOptions({ - addBankAccountRoute: bankAccountRoute, currency: moneyRequestReport?.currency, iouReport: moneyRequestReport, chatReportID: chatReport?.reportID, @@ -557,7 +554,6 @@ function MoneyReportHeader({ iouReport={moneyRequestReport} onPress={confirmPayment} enablePaymentsRoute={ROUTES.ENABLE_PAYMENTS} - addBankAccountRoute={bankAccountRoute} shouldHidePaymentOptions={!shouldShowPayButton} shouldShowApproveButton={shouldShowApproveButton} shouldDisableApproveButton={shouldDisableApproveButton} @@ -927,7 +923,6 @@ function MoneyReportHeader({ confirmPayment(payment)} enablePaymentsRoute={ROUTES.ENABLE_PAYMENTS} - addBankAccountRoute={bankAccountRoute} isDisabled={isOffline} source={CONST.KYC_WALL_SOURCE.REPORT} chatReportID={chatReport?.reportID} diff --git a/src/components/MoneyRequestConfirmationList.tsx b/src/components/MoneyRequestConfirmationList.tsx index f4b62b8eecb9..2d58ba1690b6 100755 --- a/src/components/MoneyRequestConfirmationList.tsx +++ b/src/components/MoneyRequestConfirmationList.tsx @@ -56,7 +56,6 @@ import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type {Route} from '@src/ROUTES'; import type * as OnyxTypes from '@src/types/onyx'; import type {Attendee, Participant} from '@src/types/onyx/IOU'; import type {PaymentMethodType} from '@src/types/onyx/OriginalMessage'; @@ -125,9 +124,6 @@ type MoneyRequestConfirmationListProps = { /** Number of expenses to be created */ expensesNumber?: number; - /** Depending on expense report or personal IOU report, respective bank account route */ - bankAccountRoute?: Route; - /** The policyID of the request */ policyID?: string; @@ -209,7 +205,6 @@ function MoneyRequestConfirmationList({ selectedParticipants: selectedParticipantsProp, payeePersonalDetails: payeePersonalDetailsProp, isReadOnly = false, - bankAccountRoute = '', policyID, reportID = '', receiptPath = '', @@ -994,7 +989,7 @@ function MoneyRequestConfirmationList({ pressOnEnter onPress={confirm} enablePaymentsRoute={ROUTES.IOU_SEND_ENABLE_PAYMENTS} - addBankAccountRoute={bankAccountRoute} + chatReportID={reportID} shouldShowPersonalBankAccountOption currency={iouCurrencyCode} policyID={policyID} @@ -1064,7 +1059,6 @@ function MoneyRequestConfirmationList({ isReadOnly, iouType, confirm, - bankAccountRoute, iouCurrencyCode, policyID, isConfirmed, @@ -1080,6 +1074,7 @@ function MoneyRequestConfirmationList({ shouldShowProductTrainingTooltip, renderProductTrainingTooltip, isConfirming, + reportID, ]); const listFooterContent = ( @@ -1175,7 +1170,6 @@ export default memo( deepEqual(prevProps.selectedParticipants, nextProps.selectedParticipants) && deepEqual(prevProps.payeePersonalDetails, nextProps.payeePersonalDetails) && prevProps.isReadOnly === nextProps.isReadOnly && - prevProps.bankAccountRoute === nextProps.bankAccountRoute && prevProps.policyID === nextProps.policyID && prevProps.reportID === nextProps.reportID && prevProps.receiptPath === nextProps.receiptPath && diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx index 95d9a3c65c43..231808f6fe3c 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx @@ -38,7 +38,6 @@ import {getConnectedIntegration} from '@libs/PolicyUtils'; import {getReportPreviewAction} from '@libs/ReportPreviewActionUtils'; import { areAllRequestsBeingSmartScanned as areAllRequestsBeingSmartScannedReportUtils, - getBankAccountRoute, getDisplayNameForParticipant, getInvoicePayerName, getMoneyReportPreviewName, @@ -283,8 +282,6 @@ function MoneyRequestReportPreviewContent({ managerID, ]); - const bankAccountRoute = getBankAccountRoute(chatReport); - /* Show subtitle if at least one of the expenses is not being smart scanned, and either: - There is more than one expense – in this case, the "X expenses, Y scanning" subtitle is shown; @@ -527,7 +524,6 @@ function MoneyRequestReportPreviewContent({ onPaymentOptionsHide={onPaymentOptionsHide} confirmApproval={confirmApproval} enablePaymentsRoute={ROUTES.ENABLE_PAYMENTS} - addBankAccountRoute={bankAccountRoute} shouldHidePaymentOptions={!shouldShowPayButton} kycWallAnchorAlignment={{ horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT, diff --git a/src/components/SettlementButton/index.tsx b/src/components/SettlementButton/index.tsx index 871cf29b7b90..e89c582ffc66 100644 --- a/src/components/SettlementButton/index.tsx +++ b/src/components/SettlementButton/index.tsx @@ -21,7 +21,6 @@ import type SettlementButtonProps from './types'; function SettlementButton({ addDebitCardRoute = ROUTES.IOU_SEND_ADD_DEBIT_CARD, - addBankAccountRoute = '', kycWallAnchorAlignment = { horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT, // button is at left, so horizontal anchor is at LEFT vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.TOP, // we assume that popover menu opens below the button, anchor is at TOP @@ -69,7 +68,6 @@ function SettlementButton({ const {isAccountLocked, showLockedAccountModal} = useContext(LockedAccountContext); const paymentButtonOptions = usePaymentOptions({ - addBankAccountRoute, currency, iouReport, chatReportID, @@ -100,7 +98,6 @@ function SettlementButton({ onPress(paymentType)} enablePaymentsRoute={enablePaymentsRoute} - addBankAccountRoute={addBankAccountRoute} addDebitCardRoute={addDebitCardRoute} isDisabled={isOffline} source={CONST.KYC_WALL_SOURCE.REPORT} diff --git a/src/components/SettlementButton/types.ts b/src/components/SettlementButton/types.ts index 9fe5758ea048..527c99004063 100644 --- a/src/components/SettlementButton/types.ts +++ b/src/components/SettlementButton/types.ts @@ -62,9 +62,6 @@ type SettlementButtonProps = { /** The size of button size */ buttonSize?: ButtonSizeValue; - /** Route for the Add Bank Account screen for a given navigation stack */ - addBankAccountRoute?: Route; - /** Route for the Add Debit Card screen for a given navigation stack */ addDebitCardRoute?: Route; diff --git a/src/hooks/usePaymentOptions.ts b/src/hooks/usePaymentOptions.ts index 40dc90c922d9..7da37ca790c0 100644 --- a/src/hooks/usePaymentOptions.ts +++ b/src/hooks/usePaymentOptions.ts @@ -7,6 +7,7 @@ import {formatPaymentMethods} from '@libs/PaymentUtils'; import getPolicyEmployeeAccountIDs from '@libs/PolicyEmployeeListUtils'; import { doesReportBelongToWorkspace, + getBankAccountRoute, isExpenseReport as isExpenseReportUtil, isIndividualInvoiceRoom as isIndividualInvoiceRoomUtil, isInvoiceReport as isInvoiceReportUtil, @@ -26,7 +27,6 @@ type CurrencyType = TupleToUnion; type UsePaymentOptionsProps = Pick< SettlementButtonProps, - | 'addBankAccountRoute' | 'currency' | 'iouReport' | 'chatReportID' @@ -45,7 +45,6 @@ type UsePaymentOptionsProps = Pick< * It dynamically generates payment or approval options to ensure the user interface reflects the correct actions possible for the user's current situation. */ function usePaymentOptions({ - addBankAccountRoute = '', currency = CONST.CURRENCY.USD, iouReport, chatReportID = '', @@ -174,7 +173,10 @@ function usePaymentOptions({ { text: translate('workspace.invoices.paymentMethods.addBankAccount'), icon: Expensicons.Bank, - onSelected: () => Navigation.navigate(addBankAccountRoute), + onSelected: () => { + const bankAccountRoute = getBankAccountRoute(chatReport); + Navigation.navigate(bankAccountRoute); + }, }, ], }); @@ -190,7 +192,10 @@ function usePaymentOptions({ { text: translate('workspace.invoices.paymentMethods.addBankAccount'), icon: Expensicons.Bank, - onSelected: () => Navigation.navigate(addBankAccountRoute), + onSelected: () => { + const bankAccountRoute = getBankAccountRoute(chatReport); + Navigation.navigate(bankAccountRoute); + }, }, { text: translate('iou.payElsewhere', {formattedAmount: ''}), diff --git a/src/pages/iou/MoneyRequestAmountForm.tsx b/src/pages/iou/MoneyRequestAmountForm.tsx index 4caa4ad7e707..69ce003284cc 100644 --- a/src/pages/iou/MoneyRequestAmountForm.tsx +++ b/src/pages/iou/MoneyRequestAmountForm.tsx @@ -22,7 +22,6 @@ import Navigation from '@libs/Navigation/Navigation'; import variables from '@styles/variables'; import type {BaseTextInputRef} from '@src/components/TextInput/BaseTextInput/types'; import CONST from '@src/CONST'; -import type {Route} from '@src/ROUTES'; import ROUTES from '@src/ROUTES'; import type {SelectedTabRequest} from '@src/types/onyx'; import type {PaymentMethodType} from '@src/types/onyx/OriginalMessage'; @@ -51,9 +50,6 @@ type MoneyRequestAmountFormProps = { /** The policyID of the request */ policyID?: string; - /** Depending on expense report or personal IOU report, respective bank account route */ - bankAccountRoute?: Route; - /** Whether the currency symbol is pressable */ isCurrencyPressable?: boolean; @@ -68,6 +64,9 @@ type MoneyRequestAmountFormProps = { /** Whether the user input should be kept or not */ shouldKeepUserInput?: boolean; + + /** The chatReportID of the request */ + chatReportID?: string; }; const isAmountInvalid = (amount: string) => !amount.length || parseFloat(amount) < 0.01; @@ -88,11 +87,11 @@ function MoneyRequestAmountForm( skipConfirmation = false, iouType = CONST.IOU.TYPE.SUBMIT, policyID = '', - bankAccountRoute = '', onCurrencyButtonPress, onSubmitButtonPress, selectedTab = CONST.TAB_REQUEST.MANUAL, shouldKeepUserInput = false, + chatReportID, }: MoneyRequestAmountFormProps, forwardedRef: ForwardedRef, ) { @@ -309,7 +308,6 @@ function MoneyRequestAmountForm( pressOnEnter onPress={submitAndNavigateToNextPage} enablePaymentsRoute={ROUTES.IOU_SEND_ENABLE_PAYMENTS} - addBankAccountRoute={bankAccountRoute} addDebitCardRoute={ROUTES.IOU_SEND_ADD_DEBIT_CARD} currency={currency ?? CONST.CURRENCY.USD} policyID={policyID} @@ -325,6 +323,7 @@ function MoneyRequestAmountForm( }} shouldShowPersonalBankAccountOption enterKeyEventListenerPriority={1} + chatReportID={chatReportID} /> ) : (