woocommerce/plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-billing-address-block/frontend.tsx

81 lines
2.0 KiB
TypeScript

/**
* External dependencies
*/
import classnames from 'classnames';
import { withFilteredAttributes } from '@woocommerce/shared-hocs';
import { FormStep } from '@woocommerce/base-components/cart-checkout';
import { useCheckoutAddress } from '@woocommerce/base-context/hooks';
import { useSelect } from '@wordpress/data';
import { CHECKOUT_STORE_KEY } from '@woocommerce/block-data';
/**
* Internal dependencies
*/
import Block from './block';
import attributes from './attributes';
import { useCheckoutBlockContext } from '../../context';
import {
getBillingAddresssBlockTitle,
getBillingAddresssBlockDescription,
} from './utils';
const FrontendBlock = ( {
title,
description,
showStepNumber,
children,
className,
}: {
title: string;
description: string;
showStepNumber: boolean;
children: JSX.Element;
className?: string;
} ): JSX.Element | null => {
const checkoutIsProcessing = useSelect( ( select ) =>
select( CHECKOUT_STORE_KEY ).isProcessing()
);
const {
requireCompanyField,
requirePhoneField,
showApartmentField,
showCompanyField,
showPhoneField,
} = useCheckoutBlockContext();
const { showBillingFields, forcedBillingAddress, useBillingAsShipping } =
useCheckoutAddress();
if ( ! showBillingFields && ! useBillingAsShipping ) {
return null;
}
title = getBillingAddresssBlockTitle( title, forcedBillingAddress );
description = getBillingAddresssBlockDescription(
description,
forcedBillingAddress
);
return (
<FormStep
id="billing-fields"
disabled={ checkoutIsProcessing }
className={ classnames(
'wc-block-checkout__billing-fields',
className
) }
title={ title }
description={ description }
showStepNumber={ showStepNumber }
>
<Block
requireCompanyField={ requireCompanyField }
showApartmentField={ showApartmentField }
showCompanyField={ showCompanyField }
showPhoneField={ showPhoneField }
requirePhoneField={ requirePhoneField }
/>
{ children }
</FormStep>
);
};
export default withFilteredAttributes( attributes )( FrontendBlock );