Add conditional wallet terms based on program ID

src/CONST.ts

@@ -992,6 +992,7 @@ const CONST = {
             STATEMENT: 'STATEMENT_NAVIGATE',
             CONCIERGE: 'CONCIERGE_NAVIGATE',
         },
+        MTL_WALLET_PROGRAM_ID : '760',
     },
 
     PLAID: {

src/languages/en.ts

@@ -73,8 +73,10 @@ import type {
     RequestedAmountMessageParams,
     TagSelectionParams,
     TranslationBase,
+    WalletProgramParams,
 } from './types';
 import * as ReportActionsUtils from '../libs/ReportActionsUtils';
+import walletTermsPropTypes from '../pages/EnablePayments/walletTermsPropTypes';
 
 type StateValue = {
     stateISO: string;
@@ -1170,7 +1172,7 @@ export default {
         electronicFundsWithdrawal: 'Electronic funds withdrawal',
         standard: 'Standard',
         shortTermsForm: {
-            expensifyPaymentsAccount: 'The Expensify Wallet is issued by The Bancorp Bank.',
+            expensifyPaymentsAccount: ({ walletProgram }: WalletProgramParams) => `The Expensify Wallet is issued by ${walletProgram}.`,
             perPurchase: 'Per purchase',
             atmWithdrawal: 'ATM withdrawal',
             cashReload: 'Cash reload',

src/languages/types.ts

@@ -194,6 +194,8 @@ type FormattedMaxLengthParams = {formattedMaxLength: string};
 
 type TagSelectionParams = {tagName: string};
 
+type WalletProgramParams = { walletProgram: string };
+
 /* Translation Object types */
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 type TranslationBaseValue = string | string[] | ((...args: any[]) => string);
@@ -307,4 +309,5 @@ export type {
     RemovedTheRequestParams,
     FormattedMaxLengthParams,
     TagSelectionParams,
+    WalletProgramParams,
 };

src/pages/EnablePayments/EnablePaymentsPage.js

@@ -76,7 +76,7 @@ function EnablePaymentsPage({userWallet}) {
                     case CONST.WALLET.STEP.ONFIDO:
                         return <OnfidoStep />;
                     case CONST.WALLET.STEP.TERMS:
-                        return <TermsStep />;
+                        return <TermsStep userWallet={userWallet} />;
                     case CONST.WALLET.STEP.ACTIVATE:
                         return <ActivateStep userWallet={userWallet} />;
                     default:

src/pages/EnablePayments/TermsPage/ShortTermsForm.js

@@ -5,11 +5,21 @@ import Text from '../../../components/Text';
 import * as Localize from '../../../libs/Localize';
 import CONST from '../../../CONST';
 import TextLink from '../../../components/TextLink';
+import userWalletPropTypes from '../userWalletPropTypes';
 
-function ShortTermsForm() {
+const propTypes = {
+    /** The user's wallet */
+    userWallet: userWalletPropTypes,
+};
+
+const defaultProps = {
+    userWallet: {},
+};
+
+function ShortTermsForm(props) {
     return (
         <>
-            <Text style={styles.mb5}>{Localize.translateLocal('termsStep.shortTermsForm.expensifyPaymentsAccount')}</Text>
+            <Text style={styles.mb5}>{Localize.translateLocal('termsStep.shortTermsForm.expensifyPaymentsAccount', { walletProgram: props.userWallet.walletProgramID === CONST.WALLET.MTL_WALLET_PROGRAM_ID ? 'Expensify Payments' : 'The Bancorp Bank'})}</Text>
 
             <View style={[styles.shortTermsBorder, styles.p2, styles.mb6]}>
                 <View style={[styles.shortTermsRow, styles.mb4]}>
@@ -132,6 +142,8 @@ function ShortTermsForm() {
     );
 }
 
+ShortTermsForm.propTypes = propTypes;
+ShortTermsForm.defaultProps = defaultProps;
 ShortTermsForm.displayName = 'ShortTermsForm';
 
 export default ShortTermsForm;

src/pages/EnablePayments/TermsStep.js

@@ -15,15 +15,20 @@ import LongTermsForm from './TermsPage/LongTermsForm';
 import FormAlertWithSubmitButton from '../../components/FormAlertWithSubmitButton';
 import walletTermsPropTypes from './walletTermsPropTypes';
 import * as ErrorUtils from '../../libs/ErrorUtils';
+import userWalletPropTypes from './userWalletPropTypes';
 
 const propTypes = {
+    /** The user's wallet */
+    userWallet: userWalletPropTypes,
+
     /** Comes from Onyx. Information about the terms for the wallet */
     walletTerms: walletTermsPropTypes,
 
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
+    userWallet: {},
     walletTerms: {},
 };
 
@@ -59,7 +64,7 @@ function TermsStep(props) {
                 style={styles.flex1}
                 contentContainerStyle={styles.ph5}
             >
-                <ShortTermsForm />
+                <ShortTermsForm userWallet={userWallet} />
                 <LongTermsForm />
                 <CheckboxWithLabel
                     accessibilityLabel={props.translate('termsStep.haveReadAndAgree')}

src/pages/EnablePayments/userWalletPropTypes.js

@@ -22,4 +22,7 @@ export default PropTypes.shape({
 
     /** Whether we should show the ActivateStep success view after the user finished the KYC flow */
     shouldShowWalletActivationSuccess: PropTypes.bool,
+
+    /** The wallet's programID, used to show the correct terms. */
+    walletProgramID: PropTypes.string,
 });

src/types/onyx/UserWallet.ts

@@ -34,6 +34,9 @@ type UserWallet = {
     /** The type of the linked account (debitCard or bankAccount) */
     walletLinkedAccountType: WalletLinkedAccountType;
 
+    /** The wallet's programID, used to show the correct terms. */
+    walletProgramID?: string;
+
     /** The user's bank account ID */
     bankAccountID?: number;