[DO NOT MERGE]fix(checkout): PI-2391 cardinal 3ds for cybersource googlepay

packages/cardinal-integration/src/cardinal-three-d-secure-flow-v2.ts

@@ -7,6 +7,7 @@ import {
     isVaultedInstrument,
     OrderPaymentRequestBody,
     OrderRequestBody,
+    Payment,
     PaymentIntegrationSelectors,
     PaymentIntegrationService,
     PaymentMethod,
@@ -32,6 +33,7 @@ export default class CardinalThreeDSecureFlowV2 {
         payload: OrderRequestBody,
         options?: PaymentRequestOptions,
         hostedForm?: HostedForm,
+        paymentBody?: Payment,
     ): Promise<void> {
         const { getCardInstrument } = this._paymentIntegrationService.getState();
         const { payment = { methodId: '' } } = payload;
@@ -53,7 +55,11 @@ export default class CardinalThreeDSecureFlowV2 {
                 }
 
                 try {
-                    return await this._submitPayment(payment, { xid }, hostedForm);
+                    if (paymentBody) {
+                        await this._paymentIntegrationService.submitPayment(paymentBody);
+                    } else {
+                        return await this._submitPayment(payment, { xid }, hostedForm);
+                    }
                 } catch (err) {
                     if (
                         isRequestError(err) &&
@@ -112,12 +118,14 @@ export default class CardinalThreeDSecureFlowV2 {
         getCardInstrument: PaymentIntegrationSelectors['getCardInstrument'],
         hostedForm?: HostedForm,
     ): string {
+        console.log({ paymentData });
+
         const instrument =
             isVaultedInstrument(paymentData) && getCardInstrument(paymentData.instrumentId);
         const ccNumber = isCreditCardInstrument(paymentData) && paymentData.ccNumber;
         const hostedFormBin = hostedForm ? hostedForm.getBin() : ccNumber;
         const bin = instrument ? instrument.iin : hostedFormBin;
 
-        return bin || '';
+        return bin || '520000';
     }
 }

packages/google-pay-integration/src/factories/payment/create-google-pay-cybersource-payment-strategy.ts

@@ -1,6 +1,12 @@
 import { createFormPoster } from '@bigcommerce/form-poster';
 import { createRequestSender } from '@bigcommerce/request-sender';
+import { getScriptLoader } from '@bigcommerce/script-loader';
 
+import {
+    CardinalClient,
+    CardinalScriptLoader,
+    CardinalThreeDSecureFlowV2,
+} from '@bigcommerce/checkout-sdk/cardinal-integration';
 import {
     PaymentStrategyFactory,
     toResolvableModule,
@@ -22,6 +28,10 @@ const createGooglePayCybersourcePaymentStrategy: PaymentStrategyFactory<
             createRequestSender(),
             createFormPoster(),
         ),
+        new CardinalThreeDSecureFlowV2(
+            paymentIntegrationService,
+            new CardinalClient(new CardinalScriptLoader(getScriptLoader())),
+        ),
     );
 
 export default toResolvableModule(createGooglePayCybersourcePaymentStrategy, [

packages/google-pay-integration/src/google-pay-payment-strategy.ts

@@ -1,5 +1,6 @@
 import { round } from 'lodash';
 
+import { CardinalThreeDSecureFlowV2 } from '@bigcommerce/checkout-sdk/cardinal-integration';
 import {
     guard,
     InvalidArgumentError,
@@ -38,6 +39,7 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
     constructor(
         protected _paymentIntegrationService: PaymentIntegrationService,
         protected _googlePayPaymentProcessor: GooglePayPaymentProcessor,
+        private _threeDSecureFlow?: CardinalThreeDSecureFlowV2,
     ) {}
 
     async initialize(
@@ -71,26 +73,37 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
         );
 
         this._addPaymentButton(walletButton, callbacks);
+
+        if (this._threeDSecureFlow /* && paymentMethod.config.is3dsEnabled */) {
+            await this._threeDSecureFlow.prepare(paymentMethod);
+        }
     }
 
-    async execute({ payment }: OrderRequestBody): Promise<void> {
-        if (!payment?.methodId) {
+    async execute(payload: OrderRequestBody): Promise<void> {
+        // const paymentMethod = this._paymentIntegrationService
+        //     .getState()
+        //     .getPaymentMethodOrThrow<GooglePayInitializationData>(this._getMethodId());
+        if (!payload.payment?.methodId) {
             throw new PaymentArgumentInvalidError(['payment']);
         }
 
-        await this._paymentIntegrationService.submitOrder();
-
-        const nonce = await this._googlePayPaymentProcessor.getNonce(payment.methodId);
+        const nonce = await this._googlePayPaymentProcessor.getNonce(payload.payment.methodId);
         const extraData = await this._googlePayPaymentProcessor.extraPaymentData();
 
-        try {
-            await this._paymentIntegrationService.submitPayment({
-                ...payment,
-                paymentData: { nonce, ...extraData },
-            });
-        } catch (error) {
-            await this._googlePayPaymentProcessor.processAdditionalAction(error);
+        if (this._threeDSecureFlow /* && paymentMethod.config.is3dsEnabled */) {
+            return this._threeDSecureFlow.start(
+                this._executeInner.bind(this),
+                payload,
+                undefined,
+                undefined,
+                {
+                    ...payload.payment,
+                    paymentData: { nonce, ...extraData },
+                },
+            );
         }
+
+        return this._executeInner(payload);
     }
 
     finalize(): Promise<void> {
@@ -109,6 +122,26 @@ export default class GooglePayPaymentStrategy implements PaymentStrategy {
         return Promise.resolve();
     }
 
+    protected async _executeInner({ payment }: OrderRequestBody): Promise<void> {
+        if (!payment?.methodId) {
+            throw new PaymentArgumentInvalidError(['payment']);
+        }
+
+        await this._paymentIntegrationService.submitOrder();
+
+        const nonce = await this._googlePayPaymentProcessor.getNonce(payment.methodId);
+        const extraData = await this._googlePayPaymentProcessor.extraPaymentData();
+
+        try {
+            await this._paymentIntegrationService.submitPayment({
+                ...payment,
+                paymentData: { nonce, ...extraData },
+            });
+        } catch (error) {
+            await this._googlePayPaymentProcessor.processAdditionalAction(error);
+        }
+    }
+
     protected _addPaymentButton(
         walletButton: string,
         callbacks: Omit<GooglePayPaymentInitializeOptions, 'walletButton'>,