[TS migration] Migrate 'PaymentUtils.js' lib to TypeScript

src/components/Icon/BankIcons.js → src/components/Icon/BankIcons.ts

@@ -1,4 +1,5 @@
-import _ from 'underscore';
+import {SvgProps} from 'react-native-svg';
+import {FC} from 'react';
 import * as Expensicons from './Expensicons';
 import AmericanExpress from '../../../assets/images/bankicons/american-express.svg';
 import BankOfAmerica from '../../../assets/images/bankicons/bank-of-america.svg';
@@ -21,14 +22,16 @@ import USBank from '../../../assets/images/bankicons/us-bank.svg';
 import USAA from '../../../assets/images/bankicons/usaa.svg';
 import variables from '../../styles/variables';
 
+type BankIcon = {
+    icon: FC<SvgProps>;
+    iconSize: number;
+};
+
 /**
  * Returns matching asset icon for bankName
- * @param {String} bankName
- * @param {Boolean} isCard
- * @returns {Object}
  */
 
-function getAssetIcon(bankName, isCard) {
+function getAssetIcon(bankName: string, isCard: boolean): FC<SvgProps> {
     if (bankName.includes('americanexpress')) {
         return AmericanExpress;
     }
@@ -106,22 +109,20 @@ function getAssetIcon(bankName, isCard) {
 
 /**
  * Returns Bank Icon Object that matches to existing bank icons or default icons
- * @param {String} bankName
- * @param {Boolean} [isCard = false]
- * @returns {Object} Object includes props icon, iconSize only if applicable
  */
 
-export default function getBankIcon(bankName, isCard) {
-    const bankIcon = {
+export default function getBankIcon(bankName: string, isCard = false) {
+    const bankIcon: BankIcon = {
         icon: isCard ? Expensicons.CreditCard : GenericBank,
+        iconSize: 0,
     };
 
     if (bankName) {
         bankIcon.icon = getAssetIcon(bankName.toLowerCase(), isCard);
     }
 
     // For default Credit Card icon the icon size should not be set.
-    if (!_.contains([Expensicons.CreditCard], bankIcon.icon)) {
+    if (![Expensicons.CreditCard].includes(bankIcon.icon)) {
         bankIcon.iconSize = variables.iconSizeExtraLarge;
     }
 

src/libs/PaymentUtils.ts

@@ -0,0 +1,88 @@
+import {SvgProps} from 'react-native-svg';
+import {FC} from 'react';
+// eslint-disable-next-line import/no-named-default
+import {default as BankAccountModel} from './models/BankAccount';
+import getBankIcon from '../components/Icon/BankIcons';
+import CONST from '../CONST';
+import * as Localize from './Localize';
+import Fund from '../types/onyx/Fund';
+import BankAccount from '../types/onyx/BankAccount';
+
+type AccountType = 'debitCard' | 'bankAccount';
+
+type PaymentMethod = {
+    description: string;
+    icon: FC<SvgProps>;
+    iconSize: number;
+} & BankAccount &
+    Fund;
+
+/**
+ * Check to see if user has either a debit card or personal bank account added
+ */
+function hasExpensifyPaymentMethod(fundList: Record<string, Fund>, bankAccountList: Record<string, BankAccount>): boolean {
+    const validBankAccount = Object.values(bankAccountList).some((bankAccountJSON) => {
+        const bankAccount = new BankAccountModel(bankAccountJSON);
+        return bankAccount.isDefaultCredit();
+    });
+
+    // Hide any billing cards that are not P2P debit cards for now because you cannot make them your default method, or delete them
+    const validDebitCard = Object.values(fundList).some((card) => card?.accountData?.additionalData?.isP2PDebitCard ?? false);
+
+    return validBankAccount || validDebitCard;
+}
+
+function getPaymentMethodDescription(accountType: AccountType, account: BankAccount['accountData'] & Fund['accountData']): string {
+    if (account) {
+        if (accountType === CONST.PAYMENT_METHODS.BANK_ACCOUNT && account?.accountNumber) {
+            return `${Localize.translateLocal('paymentMethodList.accountLastFour')} ${account?.accountNumber?.slice(-4)}`;
+        }
+        if (accountType === CONST.PAYMENT_METHODS.DEBIT_CARD) {
+            return `${Localize.translateLocal('paymentMethodList.cardLastFour')} ${account?.cardNumber?.slice(-4)}`;
+        }
+    }
+    return '';
+}
+
+/**
+ * Get the PaymentMethods list
+ */
+function formatPaymentMethods(bankAccountList: Record<string, BankAccount>, fundList: Record<string, Fund>) {
+    const combinedPaymentMethods: PaymentMethod[] = [];
+
+    Object.values(bankAccountList).forEach((bankAccount) => {
+        // Add all bank accounts besides the wallet
+        if (bankAccount?.accountData?.type === CONST.BANK_ACCOUNT_TYPES.WALLET) {
+            return;
+        }
+
+        const {icon, iconSize} = getBankIcon(bankAccount?.accountData?.additionalData?.bankName ?? '', false);
+        combinedPaymentMethods.push({
+            ...bankAccount,
+            description: getPaymentMethodDescription(bankAccount?.accountType as AccountType, bankAccount.accountData),
+            icon,
+            iconSize,
+        });
+    });
+
+    Object.values(fundList).forEach((card) => {
+        const {icon, iconSize} = getBankIcon(card?.accountData?.bank ?? '', true);
+        combinedPaymentMethods.push({
+            ...card,
+            description: getPaymentMethodDescription(card?.accountType as AccountType, card.accountData),
+            icon,
+            iconSize,
+        });
+    });
+
+    return combinedPaymentMethods;
+}
+
+function calculateWalletTransferBalanceFee(currentBalance: number, methodType: string): number {
+    const transferMethodTypeFeeStructure =
+        methodType === CONST.WALLET.TRANSFER_METHOD_TYPE.INSTANT ? CONST.WALLET.TRANSFER_METHOD_TYPE_FEE.INSTANT : CONST.WALLET.TRANSFER_METHOD_TYPE_FEE.ACH;
+    const calculateFee = Math.ceil(currentBalance * (transferMethodTypeFeeStructure.RATE / 100));
+    return Math.max(calculateFee, transferMethodTypeFeeStructure.MINIMUM_FEE);
+}
+
+export {hasExpensifyPaymentMethod, getPaymentMethodDescription, formatPaymentMethods, calculateWalletTransferBalanceFee};

src/types/onyx/Fund.ts

@@ -18,6 +18,7 @@ type AccountData = {
     created?: string;
     currency?: string;
     fundID?: number;
+    bank?: string;
 };
 
 type Fund = {