klarna draft

Author: serhii-tkachenko

packages/bigcommerce-payments-integration/src/bigcommerce-payments-alternative-methods/bigcommerce-payments-alternative-methods-payment-strategy.ts

@@ -37,6 +37,27 @@ import BigCommercePaymentsAlternativeMethodsPaymentInitializeOptions, {
 const POLLING_INTERVAL = 3000;
 const MAX_POLLING_TIME = 300000;
 
+export interface RedirectActionBody {
+    body: {
+        additional_action_required: {
+            type: 'offsite_redirect';
+            data: {
+                redirect_url: string;
+            };
+        };
+    };
+}
+
+export interface RedirectError {
+    body: {
+        additional_action_required: {
+            data: {
+                redirect_url: string;
+            };
+        };
+    };
+}
+
 export default class BigCommercePaymentsAlternativeMethodsPaymentStrategy
     implements PaymentStrategy
 {
@@ -56,14 +77,20 @@ export default class BigCommercePaymentsAlternativeMethodsPaymentStrategy
         private loadingIndicator: LoadingIndicator,
         private pollingInterval: number = POLLING_INTERVAL,
         private maxPollingIntervalTime: number = MAX_POLLING_TIME,
-    ) {}
+    ) {
+        console.log('BigCommercePaymentsAlternativeMethodsPaymentStrategy constructor test');
+    }
 
     async initialize(
         options: PaymentInitializeOptions &
             WithBigCommercePaymentsAlternativeMethodsPaymentInitializeOptions,
     ): Promise<void> {
         const { gatewayId, methodId, bigcommerce_payments_apms } = options;
 
+        if (methodId === 'klarna') {
+            return;
+        }
+
         this.bigCommercePaymentsAlternativeMethods = bigcommerce_payments_apms;
 
         if (!methodId) {
@@ -128,25 +155,61 @@ export default class BigCommercePaymentsAlternativeMethodsPaymentStrategy
 
         const { methodId, gatewayId } = payment;
 
-        if (!this.orderId) {
-            throw new PaymentMethodInvalidError();
-        }
+        if (methodId === 'klarna') {
+            try {
+                const paymentData = {
+                    formattedPayload: {
+                        vault_payment_instrument: null,
+                        set_as_default_stored_instrument: null,
+                        device_info: null,
+                        method_id: methodId,
+                    },
+                };
+
+                await this.paymentIntegrationService.submitOrder(order, options);
+                await this.paymentIntegrationService.submitPayment({
+                    methodId,
+                    gatewayId,
+                    paymentData,
+                });
+            } catch (error: unknown) {
+                if (this.isRedirectError(error)) {
+                    const redirectUrl = error.body.additional_action_required.data.redirect_url;
 
-        if (this.isPollingEnabled && methodId === 'ideal') {
-            await new Promise((resolve, reject) => {
-                void this.initializePollingMechanism(methodId, resolve, reject, gatewayId);
-            });
-        }
+                    return new Promise((_, reject) => {
+                        window.location.replace(redirectUrl);
 
-        if (!this.isNonInstantPaymentMethod(methodId)) {
-            await this.paymentIntegrationService.submitOrder(order, options);
-        }
+                        this.toggleLoadingIndicator(false);
 
-        await this.bigCommercePaymentsIntegrationService.submitPayment(
-            methodId,
-            this.orderId,
-            gatewayId,
-        );
+                        reject();
+                    });
+                }
+
+                this.handleError(error);
+
+                return Promise.reject(error);
+            }
+        } else {
+            if (!this.orderId) {
+                throw new PaymentMethodInvalidError();
+            }
+
+            if (this.isPollingEnabled && methodId === 'ideal') {
+                await new Promise((resolve, reject) => {
+                    void this.initializePollingMechanism(methodId, resolve, reject, gatewayId);
+                });
+            }
+
+            if (!this.isNonInstantPaymentMethod(methodId)) {
+                await this.paymentIntegrationService.submitOrder(order, options);
+            }
+
+            await this.bigCommercePaymentsIntegrationService.submitPayment(
+                methodId,
+                this.orderId,
+                gatewayId,
+            );
+        }
     }
 
     finalize(): Promise<void> {
@@ -445,4 +508,18 @@ export default class BigCommercePaymentsAlternativeMethodsPaymentStrategy
 
         return this.paypalApms;
     }
+
+    private isRedirectError(error: unknown): error is RedirectError {
+        if (typeof error !== 'object' || error === null) {
+            return false;
+        }
+
+        const { body }: Partial<RedirectActionBody> = error;
+
+        if (!body) {
+            return false;
+        }
+
+        return !!body.additional_action_required?.data.redirect_url;
+    }
 }

packages/bigcommerce-payments-integration/src/bigcommerce-payments-alternative-methods/create-bigcommerce-payments-alternative-methods-button-strategy.ts

@@ -16,5 +16,5 @@ const createBigCommercePaymentsAlternativeMethodsButtonStrategy: CheckoutButtonS
     );
 
 export default toResolvableModule(createBigCommercePaymentsAlternativeMethodsButtonStrategy, [
-    { id: 'bigcommerce_payments_apms' },
+    { gateway: 'bigcommerce_payments_apms' },
 ]);

packages/bigcommerce-payments-integration/src/bigcommerce-payments-alternative-methods/create-bigcommerce-payments-alternative-methods-payment-strategy.ts

@@ -12,16 +12,21 @@ import BigCommercePaymentsAlternativeMethodsPaymentStrategy from './bigcommerce-
 
 const createBigCommercePaymentsAlternativeMethodsPaymentStrategy: PaymentStrategyFactory<
     BigCommercePaymentsAlternativeMethodsPaymentStrategy
-> = (paymentIntegrationService) =>
-    new BigCommercePaymentsAlternativeMethodsPaymentStrategy(
+> = (paymentIntegrationService) => {
+    console.log('createBigCommercePaymentsAlternativeMethodsPaymentStrategy');
+
+    return new BigCommercePaymentsAlternativeMethodsPaymentStrategy(
         paymentIntegrationService,
         createBigCommercePaymentsIntegrationService(paymentIntegrationService),
         createBigCommercePaymentsSdk(),
         new LoadingIndicator({
             containerStyles: LOADING_INDICATOR_STYLES,
         }),
     );
+}
+
 
 export default toResolvableModule(createBigCommercePaymentsAlternativeMethodsPaymentStrategy, [
-    { gateway: 'bigcommerce_payments_apms' },
+    // { gateway: 'bigcommerce_payments_apms' },
+    { gateway: 'bigcommerce_payments_apms', id: 'klarna' },
 ]);

packages/payment-integration-api/src/to-resolvable-module.ts

@@ -4,5 +4,7 @@ export default function toResolvableModule<TModule, TIdentifier>(
     module: TModule,
     resolveIds: TIdentifier[],
 ): ResolvableModule<TModule, TIdentifier> {
+    console.log('resolveIds', resolveIds);
+
     return Object.assign(module, { resolveIds });
 }