Add paypal button onCancel/onInit/onClick events handlers

[stafyniaksacha]

It seems not possible for now to use onCancel/onInit/onClick/onShippingChange paypal buttons options in swell:

• https://developer.paypal.com/sdk/js/reference/#link-oncancel
• https://developer.paypal.com/sdk/js/reference/#link-oninitonclick

Replacing the payPalButton function of src/payment.js does the tricks, but we can not make PR to add it.

async function payPalButton(request, cart, payMethods, params) {
  const paypal = window.paypal;
  const { paypal: { locale, style, elementId } = {} } = params;
  const { capture_total, currency, guest } = cart;

  const onError = (error) => {
    const errorHandler = get(params, 'paypal.onError');
    if (isFunction(errorHandler)) {
      return errorHandler(error);
    }
    throw new Error(error.message);
  };
  const onSuccess = () => {
    const successHandler = get(params, 'paypal.onSuccess');
    return isFunction(successHandler) && successHandler();
  };
+ const onInit = (data, actions) => {
+   const initHandler = get(params, 'paypal.onInit');
+   return isFunction(initHandler) && initHandler(data, actions);
+ };
+ const onClick = (data, actions) => {
+   const clickHandler = get(params, 'paypal.onClick');
+   return isFunction(clickHandler) && clickHandler(data, actions);
+ };
+ const onCancel = (data, actions) => {
+   const cancelHandler = get(params, 'paypal.onCancel');
+   return isFunction(cancelHandler) && cancelHandler(data, actions);
+ };
+ const onShippingChange = (data, actions) => {
+   const shippingChangeHandler = get(params, 'paypal.onShippingChange');
+   return isFunction(shippingChangeHandler) && shippingChangeHandler(data, actions);
+ };

  if (!(capture_total > 0)) {
    throw new Error(
      'Invalid PayPal button amount. Value should be greater than zero.',
    );
  }

  paypal
    .Buttons(
      {
        locale: locale || 'en_US',
        style: style || {
          layout: 'horizontal',
          height: 45,
          color: 'gold',
          shape: 'rect',
          label: 'paypal',
          tagline: false,
        },
+       onInit,
+       onClick,
+       onCancel,
+       onShippingChange,
        createOrder: (data, actions) =>
          actions.order.create({
            intent: 'AUTHORIZE',
            purchase_units: [
              {
                amount: {
                  value: +capture_total.toFixed(2),
                  currency_code: currency,
                },
              },
            ],
          }),
        onApprove: (data, actions) =>
          actions.order
            .get()
            .then(async (order) => {
              const orderId = order.id;
              const payer = order.payer;
              const shipping = get(order, 'purchase_units[0].shipping');

              const usePayPalEmail = await shouldUsePayPalEmail(
                guest,
                request,
                options,
              );

              return cartApi(request).update({
                ...(usePayPalEmail && {
                  account: {
                    email: payer.email_address,
                  },
                }),
                billing: {
                  method: 'paypal',
                  paypal: { order_id: orderId },
                },
                shipping: {
                  name: shipping.name.full_name,
                  address1: shipping.address.address_line_1,
                  address2: shipping.address.address_line_2,
                  state: shipping.address.admin_area_1,
                  city: shipping.address.admin_area_2,
                  zip: shipping.address.postal_code,
                  country: shipping.address.country_code,
                },
              });
            })
            .then(onSuccess)
            .catch(onError),
      },
      onError,
    )
    .render(elementId || '#paypal-button');
}

Can you add this on the next release?