Handling Multibanco

Multibanco is a payment method which exposes information to your customers which they can then use to complete payments outside of Universal Checkout’s context.

Untitled

Untitled

The information required for completing a payment is availed to the customer via the checkout, but it is also exposed to your via onCheckoutComplete.

Managing payment method information

Once we receive the necessary information from Multibanco, which will allow the customer to complete a payment, the checkout session is deemed to be completed. onCheckoutComplete will thus be called, signalling the end to the user’s interaction with the checkout.

You can use Multibanco’s payment information within your own UI or save it within your application for later use:

type AdyenMultibancoPaymentData = {
  paymentMethodType: PaymentMethodType.ADYEN_MULTIBANCO;
  reference: string;
  expiresAt: string;
  entity: string;
};

const onCheckoutComplete = ({ payment }) => {
  switch (payment.paymentMethodData.paymentMethodType) {
    case PaymentMethodType.ADYEN_MULTIBANCO:
      // Use payment.paymentMethodData within own UI
      // Share payment information with your customer
      break;
    default:
    // show success screen
  }
};

Manual payment flow

When using the manual payment flow by providing paymentHandling: 'MANUAL' as a checkout option, onCheckoutComplete will not be called. In this case, you can use onResumePending to receive the payment information Multibanco provides:

const onResumePending = (paymentMethodData) => {
  switch (paymentMethodData.paymentMethodType) {
    case PaymentMethodType.ADYEN_MULTIBANCO:
      // Use paymentMethodData within own UI
      // Share payment information with your customer
      break;
    default:
    // show success screen
  }
};