@automattic/wpcom-checkout/dist/esm/payment-methods/web-pay-utils.js

Functions and components used by WordPress.com checkout.

import { useShoppingCart } from '@automattic/shopping-cart';
import { useI18n } from '@wordpress/react-i18n';
import debugFactory from 'debug';
import { useState, useEffect, useMemo } from 'react';
import { getLabel } from '../checkout-labels';
import { useStableCallback } from '../use-stable-callback';
const debug = debugFactory('wpcom-checkout:web-pay-utils');
const PAYMENT_REQUEST_OPTIONS = {
    requestPayerName: true,
    requestPayerPhone: false,
    requestPayerEmail: false,
    requestShipping: false,
};
export function usePaymentRequestOptions(stripeConfiguration, cartKey) {
    const { responseCart } = useShoppingCart(cartKey);
    const country = getProcessorCountryFromStripeConfiguration(stripeConfiguration);
    const currency = responseCart.currency;
    const { __ } = useI18n();
    const paymentRequestOptions = useMemo(() => {
        debug('generating payment request options');
        if (!currency) {
            return null;
        }
        const total = {
            label: __('Total'),
            amount: responseCart.total_cost_integer,
        };
        return {
            country,
            currency: currency?.toLowerCase(),
            total,
            displayItems: getDisplayItemsForLineItems(responseCart.products),
            ...PAYMENT_REQUEST_OPTIONS,
        };
    }, [country, currency, responseCart.total_cost_integer, responseCart.products, __]);
    debug('returning stripe payment request options', paymentRequestOptions, 'from currency', currency);
    return paymentRequestOptions;
}
const initialPaymentRequestState = {
    paymentRequest: undefined,
    allowedPaymentTypes: {
        applePay: false,
        googlePay: false,
    },
    isLoading: true,
};
export function useStripePaymentRequest({ paymentRequestOptions, onSubmit, stripe, }) {
    const [paymentRequestState, setPaymentRequestState] = useState(initialPaymentRequestState);
    // We have to memoize this to prevent re-creating the paymentRequest
    const callback = useStableCallback((paymentMethodResponse) => {
        completePaymentMethodTransaction({
            onSubmit,
            ...paymentMethodResponse,
        });
    });
    useEffect(() => {
        if (!stripe || !paymentRequestOptions) {
            return;
        }
        let isSubscribed = true;
        debug('creating stripe payment request', paymentRequestOptions);
        const request = stripe.paymentRequest(paymentRequestOptions);
        request
            .canMakePayment()
            .then((result) => {
            if (!isSubscribed) {
                return;
            }
            debug('canMakePayment returned from stripe paymentRequest', result);
            setPaymentRequestState((state) => ({
                ...state,
                allowedPaymentTypes: {
                    applePay: Boolean(result?.applePay),
                    googlePay: Boolean(result?.googlePay),
                },
                isLoading: false,
            }));
        })
            .catch((error) => {
            if (!isSubscribed) {
                return;
            }
            // eslint-disable-next-line no-console
            console.error('Error while creating stripe payment request', error);
            setPaymentRequestState((state) => ({
                ...state,
                allowedPaymentTypes: {
                    applePay: false,
                    googlePay: false,
                },
                isLoading: false,
            }));
        });
        request.on('paymentmethod', callback);
        setPaymentRequestState((state) => ({
            ...state,
            paymentRequest: request,
        }));
        return () => {
            isSubscribed = false;
        };
    }, [stripe, paymentRequestOptions, callback]);
    debug('returning stripe payment request; isLoading:', paymentRequestState.isLoading, 'allowedPaymentTypes:', paymentRequestState.allowedPaymentTypes);
    return paymentRequestState;
}
function getDisplayItemsForLineItems(products) {
    return products.map((product) => ({
        label: getLabel(product),
        amount: product.item_subtotal_integer,
    }));
}
function completePaymentMethodTransaction({ onSubmit, complete, paymentMethod, payerName, }) {
    onSubmit({ paymentMethodToken: paymentMethod.id, name: payerName });
    complete('success');
}
function getProcessorCountryFromStripeConfiguration(stripeConfiguration) {
    let countryCode = 'US';
    if (stripeConfiguration) {
        switch (stripeConfiguration.processor_id) {
            case 'stripe_ie':
                countryCode = 'IE';
                break;
            case 'stripe_au':
                countryCode = 'AU';
                break;
            case 'stripe_ca':
                countryCode = 'CA';
                break;
            default:
                break;
        }
    }
    return countryCode;
}
//# sourceMappingURL=web-pay-utils.js.map