@automattic/wpcom-checkout
Version:
Functions and components used by WordPress.com checkout.
140 lines • 5.31 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.usePaymentRequestOptions = usePaymentRequestOptions;
exports.useStripePaymentRequest = useStripePaymentRequest;
const tslib_1 = require("tslib");
const shopping_cart_1 = require("@automattic/shopping-cart");
const react_i18n_1 = require("@wordpress/react-i18n");
const debug_1 = tslib_1.__importDefault(require("debug"));
const react_1 = require("react");
const checkout_labels_1 = require("../checkout-labels");
const use_stable_callback_1 = require("../use-stable-callback");
const debug = (0, debug_1.default)('wpcom-checkout:web-pay-utils');
const PAYMENT_REQUEST_OPTIONS = {
requestPayerName: true,
requestPayerPhone: false,
requestPayerEmail: false,
requestShipping: false,
};
function usePaymentRequestOptions(stripeConfiguration, cartKey) {
const { responseCart } = (0, shopping_cart_1.useShoppingCart)(cartKey);
const country = getProcessorCountryFromStripeConfiguration(stripeConfiguration);
const currency = responseCart.currency;
const { __ } = (0, react_i18n_1.useI18n)();
const paymentRequestOptions = (0, react_1.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,
};
function useStripePaymentRequest({ paymentRequestOptions, onSubmit, stripe, }) {
const [paymentRequestState, setPaymentRequestState] = (0, react_1.useState)(initialPaymentRequestState);
// We have to memoize this to prevent re-creating the paymentRequest
const callback = (0, use_stable_callback_1.useStableCallback)((paymentMethodResponse) => {
completePaymentMethodTransaction({
onSubmit,
...paymentMethodResponse,
});
});
(0, react_1.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: (0, checkout_labels_1.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