@adyen/react-native/lib/commonjs/components/AdyenCheckout.js

Wraps Adyen Checkout Drop-In and Components for iOS and Android for convenient use with React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.AdyenCheckout = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _core = require("../core");
var _useAdyenCheckout = require("../hooks/useAdyenCheckout");
var _getWrapper = require("../modules/base/getWrapper");
var _SessionHelperModule = require("../modules/session/SessionHelperModule");
var _utils = require("./utils");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
/**
 * Props for AdyenCheckout
 */

const AdyenCheckout = ({
  config,
  paymentMethods,
  session,
  onSubmit,
  onError,
  onAdditionalDetails,
  onComplete,
  children
}) => {
  const subscriptions = (0, _react.useRef)([]);
  const onCompleteRef = (0, _react.useRef)(onComplete);
  const onErrorRef = (0, _react.useRef)(onError);
  const [sessionContext, setSessionContext] = (0, _react.useState)(undefined);
  const currentPaymentMethods = (0, _react.useMemo)(() => {
    return paymentMethods ?? sessionContext?.paymentMethods;
  }, [paymentMethods, sessionContext]);
  function removeEventListeners() {
    subscriptions.current.forEach(s => s.remove());
  }
  (0, _react.useEffect)(() => {
    onCompleteRef.current = onComplete;
  }, [onComplete]);
  (0, _react.useEffect)(() => {
    onErrorRef.current = onError;
  }, [onError]);
  (0, _react.useEffect)(() => {
    _SessionHelperModule.SessionHelper.removeAllListeners();
    const completeHandler = result => onCompleteRef.current?.(result, _SessionHelperModule.SessionHelper);
    const errorHandler = error => onErrorRef.current?.(error, _SessionHelperModule.SessionHelper);
    _SessionHelperModule.SessionHelper.assignCompletionHandler(completeHandler);
    _SessionHelperModule.SessionHelper.assignErrorHandler(errorHandler);
    return () => {
      removeEventListeners();
      _SessionHelperModule.SessionHelper.removeAllListeners();
      _SessionHelperModule.SessionHelper.hide(true);
    };
  }, []);
  (0, _react.useEffect)(() => {
    if (session && !sessionContext) {
      _SessionHelperModule.SessionHelper.createSession(session, config).then(sessionResponse => setSessionContext(sessionResponse)).catch(error => {
        const errorDTO = {
          message: String(error),
          errorCode: _core.ErrorCode.sessionError
        };
        onErrorRef.current?.(errorDTO, _SessionHelperModule.SessionHelper);
      });
    }
  }, [session, sessionContext, config, setSessionContext]);
  const startEventListeners = (0, _react.useCallback)(nativeComponent => {
    removeEventListeners();
    const eventEmitter = new _reactNative.NativeEventEmitter(nativeComponent.eventEmitterTarget);
    subscriptions.current = [];

    /** Subscribe to an event if supported by native module */
    function subscribeIfSupported(event, handler) {
      if (nativeComponent.isSupported(event)) {
        subscriptions.current.push(eventEmitter.addListener(event, handler));
      }
    }
    function submitPayment(data, extra) {
      const payload = {
        ...data,
        returnUrl: data.returnUrl ?? config.returnUrl
      };
      onSubmit?.(payload, nativeComponent, extra);
    }

    // Core events
    subscribeIfSupported(_core.Event.onSubmit, response => submitPayment(response.paymentData, response.extra));
    subscribeIfSupported(_core.Event.onError, error => onError?.(error, nativeComponent));
    subscribeIfSupported(_core.Event.onComplete, data => onComplete?.(data, nativeComponent));
    subscribeIfSupported(_core.Event.onAdditionalDetails, data => onAdditionalDetails?.(data, nativeComponent));

    // Stored payment method removal
    const onDisableStoredPaymentMethodCallback = config.dropin?.onDisableStoredPaymentMethod;
    if (onDisableStoredPaymentMethodCallback) {
      const nativeModule = nativeComponent;
      subscribeIfSupported(_core.Event.onDisableStoredPaymentMethod, data => onDisableStoredPaymentMethodCallback(data, () => nativeModule.removeStored(true), () => nativeModule.removeStored(false)));
    }

    // Address lookup
    const onUpdateAddressCallback = config.card?.onUpdateAddress;
    const onConfirmAddressCallback = config.card?.onConfirmAddress;
    if (onUpdateAddressCallback && onConfirmAddressCallback) {
      const nativeModule = nativeComponent;
      subscribeIfSupported(_core.Event.onAddressUpdate, async prompt => onUpdateAddressCallback(prompt, nativeModule));
      subscribeIfSupported(_core.Event.onAddressConfirm, address => onConfirmAddressCallback(address, nativeModule));
    }

    // Partial payments
    const onBalanceCheckCallback = config.partialPayment?.onBalanceCheck;
    const onOrderRequestCallback = config.partialPayment?.onOrderRequest;
    const onOrderCancelCallback = config.partialPayment?.onOrderCancel;
    if (onBalanceCheckCallback && onOrderRequestCallback && onOrderCancelCallback) {
      const component = nativeComponent;
      subscribeIfSupported(_core.Event.onCheckBalance, async paymentData => onBalanceCheckCallback(paymentData, balance => component.provideBalance(true, balance, undefined), error => component.provideBalance(false, undefined, error)));
      subscribeIfSupported(_core.Event.onRequestOrder, () => {
        onOrderRequestCallback(order => component.provideOrder(true, order, undefined), error => component.provideOrder(false, undefined, error));
      });
      subscribeIfSupported(_core.Event.onCancelOrder, ({
        order,
        shouldUpdatePaymentMethods
      }) => onOrderCancelCallback(order, shouldUpdatePaymentMethods, component));
    }

    // BIN lookup and value
    const onBinLookupCallback = config.card?.onBinLookup;
    if (onBinLookupCallback) {
      subscribeIfSupported(_core.Event.onBinLookup, onBinLookupCallback);
    }
    const onBinValueCallback = config.card?.onBinValue;
    if (onBinValueCallback) {
      subscribeIfSupported(_core.Event.onBinValue, onBinValueCallback);
    }
  }, [onSubmit, onAdditionalDetails, onComplete, onError, config]);
  const start = (0, _react.useCallback)(typeName => {
    const validPaymentMethods = (0, _utils.checkPaymentMethodsResponse)(currentPaymentMethods);
    const {
      nativeComponent,
      paymentMethod
    } = (0, _getWrapper.getWrapper)(typeName, validPaymentMethods);
    (0, _utils.checkConfiguration)(config);
    startEventListeners(nativeComponent);
    if (paymentMethod) {
      const singlePaymentMethods = {
        paymentMethods: [paymentMethod]
      };
      const singlePaymentConfig = {
        ...config,
        dropin: {
          skipListWhenSinglePaymentMethod: true
        }
      };
      nativeComponent.open(singlePaymentMethods, singlePaymentConfig);
    } else {
      nativeComponent.open(validPaymentMethods, config);
    }
  }, [config, currentPaymentMethods, startEventListeners]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_useAdyenCheckout.AdyenCheckoutContext.Provider, {
    value: {
      start,
      config,
      paymentMethods: currentPaymentMethods,
      isReady: currentPaymentMethods !== undefined
    },
    children: children
  });
};
exports.AdyenCheckout = AdyenCheckout;
//# sourceMappingURL=AdyenCheckout.js.map