refactor: change handle order, adds onPaymentMethodsRequest

Adyen · Dec 6, 2023 · 62f4518 · 62f4518
1 parent b5c8862
commit 62f4518
Show file tree

Hide file tree

Showing 7 changed files with 61 additions and 32 deletions.
diff --git a/packages/lib/src/components/ANCV/ANCV.tsx b/packages/lib/src/components/ANCV/ANCV.tsx
@@ -8,8 +8,6 @@ import SRPanelProvider from '../../core/Errors/SRPanelProvider';
 import AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';
 import PayButton from '../internal/PayButton';
 import { ANCVConfiguration } from './types';
-import { PaymentResponseData } from '../../types/global-types';
-
 export class ANCVElement extends UIElement<ANCVConfiguration> {
     public static type = 'ancv';
 
@@ -36,20 +34,6 @@ export class ANCVElement extends UIElement<ANCVConfiguration> {
         }
     };
 
-    /**
-     * Called when the /paymentDetails endpoint returns PartiallyAuthorised. The /paymentDetails happens once the /status
-     * returns PartiallyAuthorised
-     *
-     * @param order
-     */
-    protected handleOrder = ({ order }: PaymentResponseData) => {
-        this.updateParent({ order });
-
-        if (this.props.session && this.props.onOrderCreated) {
-            return this.props.onOrderCreated(order);
-        }
-    };
-
     public createOrder = () => {
         if (!this.isValid) {
             this.showValidation();

diff --git a/packages/lib/src/components/Giftcard/Giftcard.tsx b/packages/lib/src/components/Giftcard/Giftcard.tsx
@@ -4,7 +4,7 @@ import GiftcardComponent from './components/GiftcardComponent';
 import CoreProvider from '../../core/Context/CoreProvider';
 import PayButton from '../internal/PayButton';
 import AdyenCheckoutError from '../../core/Errors/AdyenCheckoutError';
-import { PaymentAmount, PaymentResponseData } from '../../types//global-types';
+import { PaymentAmount } from '../../types//global-types';
 import { GiftCardElementData, GiftCardConfiguration } from './types';
 import { TxVariants } from '../tx-variants';
 
@@ -68,13 +68,6 @@ export class GiftcardElement extends UIElement<GiftCardConfiguration> {
         }
     };
 
-    protected handleOrder = ({ order }: PaymentResponseData) => {
-        this.updateParent({ order });
-        if (this.props.session && this.props.onOrderCreated) {
-            return this.props.onOrderCreated(order);
-        }
-    };
-
     public balanceCheck() {
         return this.onBalanceCheck();
     }

diff --git a/packages/lib/src/components/internal/UIElement/UIElement.tsx b/packages/lib/src/components/internal/UIElement/UIElement.tsx
@@ -14,7 +14,9 @@ import {
     PaymentData,
     RawPaymentResponse,
     PaymentResponseAdvancedFlow,
-    OnPaymentFailedData
+    OnPaymentFailedData,
+    PaymentMethodsResponse,
+    Order
 } from '../../../types/global-types';
 import './UIElement.scss';
 import { CheckoutSessionPaymentResponse } from '../../../core/CheckoutSession/types';
@@ -286,9 +288,16 @@ export abstract class UIElement<P extends UIElementProps = UIElementProps> exten
     }
 
     protected handleOrder = (response: PaymentResponseData): void => {
-        this.updateParent({ order: response.order });
-        // in case we receive an order in any other component then a GiftCard trigger handleFinalResult
-        if (this.props.onPaymentCompleted) this.props.onPaymentCompleted(response, this.elementRef);
+        const { order } = response;
+
+        const updateCorePromise =
+            !this.props.session && this.props.onPaymentMethodsRequest
+                ? this.handleAdvanceFlowPaymentMethodsUpdate(order)
+                : this.core.update({ order });
+
+        updateCorePromise.then(() => {
+            this.props.onOrderCreated?.({ order });
+        });
     };
 
     protected handleSuccessResult = (result: PaymentResponseData) => {
@@ -384,6 +393,28 @@ export abstract class UIElement<P extends UIElementProps = UIElementProps> exten
     protected payButton = (props: PayButtonFunctionProps) => {
         return <PayButton {...props} amount={this.props.amount} secondaryAmount={this.props.secondaryAmount} onClick={this.submit} />;
     };
+
+    private async handleAdvanceFlowPaymentMethodsUpdate(order: Order) {
+        return new Promise<PaymentMethodsResponse>((resolve, reject) => {
+            const data = {
+                order: {
+                    orderData: order.orderData,
+                    pspReference: order.pspReference
+                },
+                amount: this.props.amount,
+                locale: this.core.options.locale
+            };
+            this.props.onPaymentMethodsRequest(resolve, reject, data);
+        })
+            .then(paymentMethodsResponse => {
+                return this.core.update({ paymentMethodsResponse, order, amount: order.remainingAmount });
+            })
+            .catch(error => {
+                this.handleError(
+                    new AdyenCheckoutError('IMPLEMENTATION_ERROR', 'Payment methods be updated after partial payment.', { cause: error })
+                );
+            });
+    }
 }
 
 export default UIElement;
diff --git a/packages/lib/src/components/internal/UIElement/types.ts b/packages/lib/src/components/internal/UIElement/types.ts
@@ -10,7 +10,7 @@ import { CoreConfiguration, ICore } from '../../../core/types';
 export type PayButtonFunctionProps = Omit<PayButtonProps, 'amount'>;
 
 // TODO add onPaymentCompleted
-type CoreCallbacks = Pick<CoreConfiguration, 'onSubmit' | 'onPaymentFailed'>;
+type CoreCallbacks = Pick<CoreConfiguration, 'onSubmit' | 'onPaymentFailed' | 'onOrderCreated' | 'onPaymentMethodsRequest'>;
 
 export type UIElementProps = BaseElementProps &
     CoreCallbacks & {

diff --git a/packages/lib/src/core/config.ts b/packages/lib/src/core/config.ts
@@ -31,7 +31,8 @@ export const GENERIC_OPTIONS = [
     'onBalanceCheck',
     'onOrderRequest',
     'onOrderCreated',
-    'setStatusAutomatically'
+    'setStatusAutomatically',
+    'onPaymentMethodsRequest'
 ];
 
 export default {

diff --git a/packages/lib/src/core/types.ts b/packages/lib/src/core/types.ts
@@ -8,7 +8,8 @@ import {
     OnPaymentCompletedData,
     PaymentData,
     PaymentResponseAdvancedFlow,
-    OnPaymentFailedData
+    OnPaymentFailedData,
+    PaymentMethodsRequestData
 } from '../types/global-types';
 import { AnalyticsOptions } from './Analytics/types';
 import { RiskModuleOptions } from './RiskModule/RiskModule';
@@ -26,14 +27,23 @@ type PromiseReject = typeof Promise.reject;
 
 export interface ICore {
     initialize(): Promise<ICore>;
+
     register(...items: NewableComponent[]): void;
-    update({ order }: { order?: Order }): Promise<ICore>;
+
+    update(options: CoreConfiguration): Promise<ICore>;
+
     remove(component): ICore;
+
     submitDetails(details: any): void;
+
     getCorePropsForComponent(): any;
+
     getComponent(txVariant: string): NewableComponent | undefined;
+
     createFromAction(action: PaymentAction, options: any): any;
+
     storeElementReference(element: UIElement): void;
+
     options: CoreConfiguration;
     paymentMethodsResponse: PaymentMethods;
     session?: Session;
@@ -189,6 +199,8 @@ export interface CoreConfiguration {
 
     onOrderRequest?(resolve: PromiseResolve, reject: PromiseReject, data: PaymentData): Promise<void>;
 
+    onPaymentMethodsRequest?(resolve: (response: PaymentMethodsResponse) => void, reject: () => void, data: PaymentMethodsRequestData): void;
+
     onOrderCancel?(order: Order): void;
 
     /**

diff --git a/packages/lib/src/types/global-types.ts b/packages/lib/src/types/global-types.ts
@@ -342,6 +342,14 @@ export type OnPaymentFailedData =
           resultCode: ResultCode;
       });
 
+//TODO double check these values
+export interface PaymentMethodsRequestData {
+    order: Order;
+    amount: PaymentAmount;
+    locale: string;
+    countryCode?: string;
+}
+
 export interface PaymentResponseAdvancedFlow {
     resultCode: ResultCode;
     action?: PaymentAction;