[CP Staging] [NO QA]: Add bank urls to Company Card flow

src/CONST.ts

@@ -2635,6 +2635,7 @@ const CONST = {
         },
         BANK_CONNECTIONS: {
             WELLS_FARGO: 'wellsfargo',
+            BANK_OF_AMERICA: 'bankofamerica',
             CHASE: 'chase',
             BREX: 'brex',
             CAPITAL_ONE: 'capitalone',

src/libs/actions/getCompanyCardBankConnection/index.tsx

@@ -1,4 +1,5 @@
 import {getApiRoot} from '@libs/ApiUtils';
+import getPolicyDomainName from '@libs/getPolicyDomainName';
 import * as NetworkStore from '@libs/Network/NetworkStore';
 import CONST from '@src/CONST';
 
@@ -10,22 +11,20 @@ type CompanyCardBankConnection = {
     isNewDot: string;
 };
 
-// TODO remove this when BE will support bank UI callbacks
-const bankUrl = 'https://secure.chase.com/web/auth/#/logon/logon/chaseOnline?redirect_url=';
-
-export default function getCompanyCardBankConnection(bankName?: string, domainName?: string, scrapeMinDate?: string) {
+export default function getCompanyCardBankConnection(policyID?: string, bankName?: string, scrapeMinDate?: string) {
     const bankConnection = Object.keys(CONST.COMPANY_CARDS.BANKS).find((key) => CONST.COMPANY_CARDS.BANKS[key as keyof typeof CONST.COMPANY_CARDS.BANKS] === bankName);
 
-    // TODO remove this when BE will support bank UI callbacks
-    if (!domainName) {
-        return bankUrl;
-    }
-
-    if (!bankName || !bankConnection) {
+    if (!bankName || !bankConnection || !policyID) {
         return null;
     }
     const authToken = NetworkStore.getAuthToken();
-    const params: CompanyCardBankConnection = {authToken: authToken ?? '', isNewDot: 'true', domainName: domainName ?? '', isCorporate: 'true', scrapeMinDate: scrapeMinDate ?? ''};
+    const params: CompanyCardBankConnection = {
+        authToken: authToken ?? '',
+        isNewDot: 'true',
+        domainName: getPolicyDomainName(policyID),
+        isCorporate: 'true',
+        scrapeMinDate: scrapeMinDate ?? '',
+    };
     const commandURL = getApiRoot({
         shouldSkipWebProxy: true,
         command: '',

src/libs/getPolicyDomainName.ts

@@ -0,0 +1,3 @@
+export default function getPolicyDomainName(policyID: string): string {
+    return `expensify-policy${policyID}.exfy`;
+}

src/pages/workspace/companyCards/addNew/AddNewCardPage.tsx

@@ -30,7 +30,7 @@ function AddNewCardPage({policy}: WithPolicyAndFullscreenLoadingProps) {
             case CONST.COMPANY_CARDS.STEP.CARD_TYPE:
                 return <CardTypeStep />;
             case CONST.COMPANY_CARDS.STEP.BANK_CONNECTION:
-                return <BankConnection />;
+                return <BankConnection policyID={policyID} />;
             case CONST.COMPANY_CARDS.STEP.CARD_INSTRUCTIONS:
                 return <CardInstructionsStep policyID={policyID} />;
             case CONST.COMPANY_CARDS.STEP.CARD_NAME:

src/pages/workspace/companyCards/addNew/BankConnection/index.native.tsx

@@ -13,15 +13,19 @@ import getCompanyCardBankConnection from '@userActions/getCompanyCardBankConnect
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
-function BankConnection() {
+type BankConnectionStepProps = {
+    policyID?: string;
+};
+
+function BankConnection({policyID}: BankConnectionStepProps) {
     const {translate} = useLocalize();
     const webViewRef = useRef<WebView>(null);
     const [isWebViewOpen, setWebViewOpen] = useState(false);
     const [session] = useOnyx(ONYXKEYS.SESSION);
     const authToken = session?.authToken ?? null;
     const [addNewCard] = useOnyx(ONYXKEYS.ADD_NEW_COMPANY_CARD);
     const bankName: ValueOf<typeof CONST.COMPANY_CARDS.BANKS> | undefined = addNewCard?.data?.selectedBank;
-    const url = getCompanyCardBankConnection(bankName);
+    const url = getCompanyCardBankConnection(policyID, bankName);
 
     const renderLoading = () => <FullScreenLoadingIndicator />;
 

src/pages/workspace/companyCards/addNew/BankConnection/index.tsx

@@ -19,14 +19,18 @@ import openBankConnection from './openBankConnection';
 
 let customWindow: Window | null = null;
 
-function BankConnection() {
+type BankConnectionStepProps = {
+    policyID?: string;
+};
+
+function BankConnection({policyID}: BankConnectionStepProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
     const [addNewCard] = useOnyx(ONYXKEYS.ADD_NEW_COMPANY_CARD);
     const bankName: ValueOf<typeof CONST.COMPANY_CARDS.BANKS> | undefined = addNewCard?.data?.selectedBank;
     const currentUrl = getCurrentUrl();
     const isBankConnectionCompleteRoute = currentUrl.includes(ROUTES.BANK_CONNECTION_COMPLETE);
-    const url = getCompanyCardBankConnection(bankName);
+    const url = getCompanyCardBankConnection(policyID, bankName);
 
     const onOpenBankConnectionFlow = useCallback(() => {
         if (!url) {