UNPKG

@shopgate/engage

Version:
5 lines 2.31 kB
import React,{useMemo,useCallback}from'react';import PropTypes from'prop-types';import{FormBuilder}from'@shopgate/engage/components';import{useRegistration}from"../../hooks";import Section from"../../../checkout/components/Checkout/CheckoutSection";import{ELEMENT_ID_BILLING_CONTACT}from"../../constants";import generateFormConfig from"./RegistrationFormBilling.config";import{form,section}from"./RegistrationContent.style";/** * The RegistrationFormBilling component. * @param {Object} props The component props * @returns {JSX.Element} */var RegistrationFormBilling=function RegistrationFormBilling(_ref){var isGuest=_ref.isGuest;var _useRegistration=useRegistration(isGuest),supportedCountries=_useRegistration.supportedCountries,countrySortOrder=_useRegistration.countrySortOrder,userLocation=_useRegistration.userLocation,defaultBillingFormState=_useRegistration.defaultBillingFormState,billingFormValidationErrors=_useRegistration.billingFormValidationErrors,updateBillingForm=_useRegistration.updateBillingForm,numberOfAddressLines=_useRegistration.numberOfAddressLines,orderReserveOnly=_useRegistration.orderReserveOnly,isBillingAddressSelectionEnabled=_useRegistration.isBillingAddressSelectionEnabled;var formConfig=useMemo(function(){return generateFormConfig({supportedCountries:supportedCountries,countrySortOrder:countrySortOrder,userLocation:userLocation,numberOfAddressLines:numberOfAddressLines,isGuest:isGuest,isReserveOnly:orderReserveOnly});},[countrySortOrder,isGuest,numberOfAddressLines,orderReserveOnly,supportedCountries,userLocation]);var title=useMemo(function(){if(isGuest&&orderReserveOnly){return'registration.headlines.billing_address_reserve';}return'registration.headlines.billing_address';},[isGuest,orderReserveOnly]);var handleUpdate=useCallback(function(values){updateBillingForm(values);},[updateBillingForm]);if(!isBillingAddressSelectionEnabled){return null;}return React.createElement(Section,{title:title,className:section,hasForm:true,id:ELEMENT_ID_BILLING_CONTACT},React.createElement(FormBuilder,{className:form,name:"RegistrationBilling",config:formConfig,defaults:defaultBillingFormState,validationErrors:billingFormValidationErrors,handleUpdate:handleUpdate}));};RegistrationFormBilling.defaultProps={isGuest:false};export default RegistrationFormBilling;