Adds KYC Wall trigger for Transfer Balance action

src/libs/API.js

@@ -1175,7 +1175,7 @@ function CreatePolicyRoom(parameters) {
  * @param {String} [parameters.fundID]
  * @returns {Promise}
  */
-function Wallet_TransferBalance(parameters) {
+function TransferWalletBalance(parameters) {
     const commandName = 'TransferWalletBalance';
     if (!parameters.bankAccountID && !parameters.fundID) {
         throw new Error('Must pass either bankAccountID or fundID to TransferWalletBalance');
@@ -1244,7 +1244,7 @@ export {
     ValidateEmail,
     Wallet_Activate,
     Wallet_GetOnfidoSDKToken,
-    Wallet_TransferBalance,
+    TransferWalletBalance,
     GetLocalCurrency,
     GetCurrencyList,
     Policy_Create,

src/libs/PaymentUtils.js

@@ -51,7 +51,7 @@ function formatPaymentMethods(bankAccountList, cardList, payPalMeUsername = '',
             iconSize,
             key: `bankAccount-${bankAccount.bankAccountID}`,
             accountType: CONST.PAYMENT_METHODS.BANK_ACCOUNT,
-            accountData: _.extend(bankAccount, {icon}),
+            accountData: _.extend({}, bankAccount, {icon}),
             isDefault,
         });
     });
@@ -70,7 +70,7 @@ function formatPaymentMethods(bankAccountList, cardList, payPalMeUsername = '',
             iconSize,
             key: `card-${card.cardNumber}`,
             accountType: CONST.PAYMENT_METHODS.DEBIT_CARD,
-            accountData: _.extend(card, {icon}),
+            accountData: _.extend({}, card, {icon}),
             isDefault,
         });
     });

src/pages/ReimbursementAccount/EnableStep.js

@@ -30,14 +30,14 @@ const propTypes = {
     isLoadingPaymentMethods: PropTypes.bool,
 
     /** Array of bank account objects */
-    bankAccountList: PropTypes.arrayOf(bankAccountPropTypes),
+    bankAccountList: PropTypes.objectOf(bankAccountPropTypes),
 
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
     isLoadingPaymentMethods: true,
-    bankAccountList: [],
+    bankAccountList: {},
 };
 
 class EnableStep extends React.Component {

src/pages/settings/Payments/PaymentMethodList.js

@@ -58,8 +58,8 @@ const propTypes = {
 
 const defaultProps = {
     payPalMeUsername: '',
-    bankAccountList: [],
-    cardList: [],
+    bankAccountList: {},
+    cardList: {},
     userWallet: {
         walletLinkedAccountID: 0,
         walletLinkedAccountType: '',
@@ -91,6 +91,7 @@ class PaymentMethodList extends Component {
         // If we have not added any payment methods, show a default empty state
         if (_.isEmpty(combinedPaymentMethods)) {
             combinedPaymentMethods.push({
+                key: 'addFirstPaymentMethodHelpText',
                 text: this.props.translate('paymentMethodList.addFirstPaymentMethod'),
             });
         }
@@ -125,7 +126,6 @@ class PaymentMethodList extends Component {
                     title={item.title}
                     description={item.description}
                     icon={item.icon}
-                    key={item.key}
                     disabled={item.disabled}
                     iconFill={item.iconFill}
                     iconHeight={item.iconSize}
@@ -150,6 +150,7 @@ class PaymentMethodList extends Component {
             <FlatList
                 data={this.createPaymentMethodList()}
                 renderItem={this.renderItem}
+                keyExtractor={item => item.key}
             />
         );
     }

src/pages/settings/Payments/TransferBalancePage.js

@@ -30,7 +30,7 @@ const propTypes = {
     userWallet: userWalletPropTypes.userWallet,
 
     /** Array of bank account objects */
-    bankAccountList: PropTypes.arrayOf(PropTypes.shape({
+    bankAccountList: PropTypes.objectOf(PropTypes.shape({
         /** The name of the institution (bank of america, etc) */
         addressName: PropTypes.string,
 
@@ -45,7 +45,7 @@ const propTypes = {
     })),
 
     /** Array of card objects */
-    cardList: PropTypes.arrayOf(PropTypes.shape({
+    cardList: PropTypes.objectOf(PropTypes.shape({
         /** The name of the institution (bank of america, etc) */
         cardName: PropTypes.string,
 
@@ -64,8 +64,8 @@ const propTypes = {
 
 const defaultProps = {
     userWallet: {},
-    bankAccountList: [],
-    cardList: [],
+    bankAccountList: {},
+    cardList: {},
     walletTransfer: {},
 };
 
@@ -97,6 +97,8 @@ class TransferBalancePage extends React.Component {
         ];
 
         this.saveTransferAmountAndBalance = this.saveTransferAmountAndBalance.bind(this);
+        this.getSelectedPaymentMethodAccount = this.getSelectedPaymentMethodAccount.bind(this);
+
         const selectedAccount = this.getSelectedPaymentMethodAccount();
         PaymentMethods.saveWalletTransferAccountAndResetData(selectedAccount ? selectedAccount.id : '');
     }
@@ -106,12 +108,7 @@ class TransferBalancePage extends React.Component {
      * @returns {Object|undefined}
      */
     getSelectedPaymentMethodAccount() {
-        const paymentMethods = PaymentUtils.formatPaymentMethods(
-            this.props.bankAccountList,
-            this.props.cardList,
-            this.props.userWallet,
-        );
-
+        const paymentMethods = PaymentUtils.formatPaymentMethods(this.props.bankAccountList, this.props.cardList, '', this.props.userWallet);
         const accountID = this.props.walletTransfer.selectedAccountID || lodashGet(this.props, 'userWallet.walletLinkedAccountID', '');
         return _.find(paymentMethods, method => method.methodID === accountID);
     }

src/pages/workspace/WorkspaceResetBankAccountModal.js

@@ -19,14 +19,14 @@ const propTypes = {
     reimbursementAccount: reimbursementAccountPropTypes,
 
     /** List of bank accounts */
-    bankAccountList: PropTypes.arrayOf(bankAccountPropTypes),
+    bankAccountList: PropTypes.objectOf(bankAccountPropTypes),
 
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
     reimbursementAccount: {},
-    bankAccountList: [],
+    bankAccountList: {},
 };
 
 const WorkspaceResetBankAccountModal = (props) => {