diff --git a/src/libs/PaymentUtils.ts b/src/libs/PaymentUtils.ts index b9b6c384b4f2..cda2520f38b7 100644 --- a/src/libs/PaymentUtils.ts +++ b/src/libs/PaymentUtils.ts @@ -30,7 +30,7 @@ function hasExpensifyPaymentMethod(fundList: Record, bankAccountLi function getPaymentMethodDescription(accountType: AccountType, account: BankAccount['accountData'] | Fund['accountData'] | ACHAccount, bankCurrency?: string): string { if (account) { if (accountType === CONST.PAYMENT_METHODS.PERSONAL_BANK_ACCOUNT && 'accountNumber' in account) { - return `${bankCurrency} ${CONST.DOT_SEPARATOR} ${translateLocal('paymentMethodList.accountLastFour')} ${account.accountNumber?.slice(-4)}`; + return `${bankCurrency ? `${bankCurrency} ${CONST.DOT_SEPARATOR} ` : ''}${translateLocal('paymentMethodList.accountLastFour')} ${account.accountNumber?.slice(-4)}`; } if (accountType === CONST.PAYMENT_METHODS.BUSINESS_BANK_ACCOUNT && 'accountNumber' in account) { return `${translateLocal('paymentMethodList.accountLastFour')} ${account.accountNumber?.slice(-4)}`; diff --git a/src/pages/workspace/invoices/WorkspaceInvoiceVBASection.tsx b/src/pages/workspace/invoices/WorkspaceInvoiceVBASection.tsx index 9e2526cfa384..74b27d0223f7 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoiceVBASection.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoiceVBASection.tsx @@ -16,12 +16,12 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import getClickedTargetLocation from '@libs/getClickedTargetLocation'; -import * as PaymentUtils from '@libs/PaymentUtils'; +import {formatPaymentMethods, getPaymentMethodDescription} from '@libs/PaymentUtils'; import PaymentMethodList from '@pages/settings/Wallet/PaymentMethodList'; import variables from '@styles/variables'; -import * as BankAccounts from '@userActions/BankAccounts'; -import * as Modal from '@userActions/Modal'; -import * as PaymentMethods from '@userActions/PaymentMethods'; +import {deletePaymentBankAccount, openPersonalBankAccountSetupView} from '@userActions/BankAccounts'; +import {close as closeModal} from '@userActions/Modal'; +import {setInvoicingTransferBankAccount} from '@userActions/PaymentMethods'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {AccountData} from '@src/types/onyx'; @@ -57,7 +57,7 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) // Determines whether or not the modal popup is mounted from the bottom of the screen instead of the side mount on Web or Desktop screens const isPopoverBottomMount = anchorPosition.anchorPositionTop === 0 || shouldUseNarrowLayout; const shouldShowMakeDefaultButton = !paymentMethod.isSelectedPaymentMethodDefault; - const transferBankAccountID = policy?.invoice?.bankAccount?.transferBankAccountID ?? -1; + const transferBankAccountID = policy?.invoice?.bankAccount?.transferBankAccountID ?? CONST.DEFAULT_NUMBER_ID; /** * Set position of the payment menu @@ -88,6 +88,7 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) icon?: FormattedSelectedPaymentMethodIcon, isDefault?: boolean, methodID?: string | number, + description?: string, ) => { if (shouldShowAddPaymentMenu) { setShouldShowAddPaymentMenu(false); @@ -109,7 +110,7 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) formattedSelectedPaymentMethod = { title: account?.addressName ?? '', icon, - description: PaymentUtils.getPaymentMethodDescription(accountType, account), + description: description ?? getPaymentMethodDescription(accountType, account), type: CONST.PAYMENT_METHODS.PERSONAL_BANK_ACCOUNT, }; } @@ -146,17 +147,17 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) const deletePaymentMethod = useCallback(() => { const bankAccountID = paymentMethod.selectedPaymentMethod.bankAccountID; if (paymentMethod.selectedPaymentMethodType === CONST.PAYMENT_METHODS.PERSONAL_BANK_ACCOUNT && bankAccountID) { - BankAccounts.deletePaymentBankAccount(bankAccountID); + deletePaymentBankAccount(bankAccountID); } }, [paymentMethod.selectedPaymentMethod.bankAccountID, paymentMethod.selectedPaymentMethodType]); const makeDefaultPaymentMethod = useCallback(() => { // Find the previous default payment method so we can revert if the MakeDefaultPaymentMethod command errors - const paymentMethods = PaymentUtils.formatPaymentMethods(bankAccountList ?? {}, {}, styles); + const paymentMethods = formatPaymentMethods(bankAccountList ?? {}, {}, styles); const previousPaymentMethod = paymentMethods.find((method) => !!method.isDefault); const currentPaymentMethod = paymentMethods.find((method) => method.methodID === paymentMethod.methodID); if (paymentMethod.selectedPaymentMethodType === CONST.PAYMENT_METHODS.PERSONAL_BANK_ACCOUNT) { - PaymentMethods.setInvoicingTransferBankAccount(currentPaymentMethod?.methodID ?? CONST.DEFAULT_NUMBER_ID, policyID, previousPaymentMethod?.methodID ?? CONST.DEFAULT_NUMBER_ID); + setInvoicingTransferBankAccount(currentPaymentMethod?.methodID ?? CONST.DEFAULT_NUMBER_ID, policyID, previousPaymentMethod?.methodID ?? CONST.DEFAULT_NUMBER_ID); } }, [bankAccountList, styles, paymentMethod.selectedPaymentMethodType, paymentMethod.methodID, policyID]); @@ -166,7 +167,7 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) const addPaymentMethodTypePressed = (paymentType: string) => { hideAddPaymentMenu(); if (paymentType === CONST.PAYMENT_METHODS.PERSONAL_BANK_ACCOUNT || paymentType === CONST.PAYMENT_METHODS.BUSINESS_BANK_ACCOUNT) { - BankAccounts.openPersonalBankAccountSetupView(undefined, policyID, 'invoice', isUserValidated); + openPersonalBankAccountSetupView(undefined, policyID, 'invoice', isUserValidated); return; } @@ -232,7 +233,7 @@ function WorkspaceInvoiceVBASection({policyID}: WorkspaceInvoiceVBASectionProps) Modal.close(() => setShowConfirmDeleteModal(true))} + onPress={() => closeModal(() => setShowConfirmDeleteModal(true))} wrapperStyle={[styles.pv3, styles.ph5, !shouldUseNarrowLayout ? styles.sidebarPopover : {}]} />