/**
* External dependencies
*/
import { CHECKOUT_STORE_KEY, PAYMENT_STORE_KEY } from '@woocommerce/block-data';
import { useSelect } from '@wordpress/data';
* Internal dependencies
import { useCheckoutEventsContext } from '../providers';
import { usePaymentMethods } from './payment-methods/use-payment-methods';
* Returns the submitButtonText, onSubmit interface from the checkout context,
* and an indication of submission status.
export const useCheckoutSubmit = () => {
const {
isCalculating,
isBeforeProcessing,
isProcessing,
isAfterProcessing,
isComplete,
hasError,
} = useSelect( ( select ) => {
const store = select( CHECKOUT_STORE_KEY );
return {
isCalculating: store.isCalculating(),
isBeforeProcessing: store.isBeforeProcessing(),
isProcessing: store.isProcessing(),
isAfterProcessing: store.isAfterProcessing(),
isComplete: store.isComplete(),
hasError: store.hasError(),
};
} );
const { activePaymentMethod, isExpressPaymentMethodActive } = useSelect(
( select ) => {
const store = select( PAYMENT_STORE_KEY );
activePaymentMethod: store.getActivePaymentMethod(),
isExpressPaymentMethodActive:
store.isExpressPaymentMethodActive(),
}
);
const { onSubmit } = useCheckoutEventsContext();
const { paymentMethods = {} } = usePaymentMethods();
const paymentMethod = paymentMethods[ activePaymentMethod ] || {};
const waitingForProcessing =
isProcessing || isAfterProcessing || isBeforeProcessing;
const waitingForRedirect = isComplete && ! hasError;
const paymentMethodButtonLabel = paymentMethod.placeOrderButtonLabel;
paymentMethodButtonLabel,
onSubmit,
isDisabled: isProcessing || isExpressPaymentMethodActive,
waitingForProcessing,
waitingForRedirect,