45 lines
1.2 KiB
JavaScript
45 lines
1.2 KiB
JavaScript
/**
|
|
* External dependencies
|
|
*/
|
|
import {
|
|
useCheckoutData,
|
|
usePaymentEvents,
|
|
useExpressPaymentMethods,
|
|
} from '@woocommerce/base-hooks';
|
|
import { cloneElement } from '@wordpress/element';
|
|
|
|
const ExpressPaymentMethods = () => {
|
|
const [ checkoutData ] = useCheckoutData();
|
|
const { dispatch, select } = usePaymentEvents();
|
|
// not implementing isInitialized here because it's utilized further
|
|
// up in the tree for express payment methods. We won't even get here if
|
|
// there's no payment methods after initialization.
|
|
const { paymentMethods } = useExpressPaymentMethods();
|
|
const paymentMethodSlugs = Object.keys( paymentMethods );
|
|
const content =
|
|
paymentMethodSlugs.length > 0 ? (
|
|
paymentMethodSlugs.map( ( slug ) => {
|
|
const expressPaymentMethod =
|
|
paymentMethods[ slug ].activeContent;
|
|
const paymentEvents = { dispatch, select };
|
|
return (
|
|
<li key={ slug } id={ `express-payment-method-${ slug }` }>
|
|
{ cloneElement( expressPaymentMethod, {
|
|
checkoutData,
|
|
paymentEvents,
|
|
} ) }
|
|
</li>
|
|
);
|
|
} )
|
|
) : (
|
|
<li key="noneRegistered">No registered Payment Methods</li>
|
|
);
|
|
return (
|
|
<ul className="wc-component__express-payment-event-buttons">
|
|
{ content }
|
|
</ul>
|
|
);
|
|
};
|
|
|
|
export default ExpressPaymentMethods;
|