Upgrade wp-prettier to 2.6.2 and reformat the codebase (https://github.com/woocommerce/woocommerce-blocks/pull/6566)
* Remove mixed tabs and spaces in tsconfig.json * Update formatting in json files * Upgrade wp-prettier to 2.6.2
This commit is contained in:
Michael P. Pfeiffer
GitHub
parent
0dfc1ad58b
commit
521f93619b
|
|
@ -1,5 +1,3 @@
|
|||
|
||||
|
||||
{
|
||||
"default": true,
|
||||
"MD003": { "style": "atx" },
|
||||
|
|
@ -9,7 +7,7 @@
|
|||
"MD025": false,
|
||||
"MD029": false,
|
||||
"MD033": false,
|
||||
"MD046": {"style": "fenced"},
|
||||
"MD046": { "style": "fenced" },
|
||||
"no-hard-tabs": false,
|
||||
"whitespace": false
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,9 +37,8 @@ const Block = ( { className, showFormElements } ) => {
|
|||
className,
|
||||
'wc-block-components-product-add-to-cart',
|
||||
{
|
||||
'wc-block-components-product-add-to-cart--placeholder': isEmpty(
|
||||
product
|
||||
),
|
||||
'wc-block-components-product-add-to-cart--placeholder':
|
||||
isEmpty( product ),
|
||||
}
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -32,11 +32,8 @@ const AttributeSelectControl = ( {
|
|||
'woo-gutenberg-products-block'
|
||||
),
|
||||
} ) => {
|
||||
const {
|
||||
getValidationError,
|
||||
setValidationErrors,
|
||||
clearValidationError,
|
||||
} = useValidationContext();
|
||||
const { getValidationError, setValidationErrors, clearValidationError } =
|
||||
useValidationContext();
|
||||
const errorId = attributeName;
|
||||
const error = getValidationError( errorId ) || {};
|
||||
|
||||
|
|
@ -60,10 +57,10 @@ const AttributeSelectControl = ( {
|
|||
] );
|
||||
|
||||
// Remove validation errors when unmounted.
|
||||
useEffect( () => () => void clearValidationError( errorId ), [
|
||||
errorId,
|
||||
clearValidationError,
|
||||
] );
|
||||
useEffect(
|
||||
() => () => void clearValidationError( errorId ),
|
||||
[ errorId, clearValidationError ]
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="wc-block-components-product-add-to-cart-attribute-picker__container">
|
||||
|
|
|
|||
|
|
@ -45,7 +45,8 @@ const AddToCartButton = () => {
|
|||
}
|
||||
return true;
|
||||
};
|
||||
const unsubscribeProcessing = eventRegistration.onAddToCartAfterProcessingWithSuccess(
|
||||
const unsubscribeProcessing =
|
||||
eventRegistration.onAddToCartAfterProcessingWithSuccess(
|
||||
onSuccess,
|
||||
0
|
||||
);
|
||||
|
|
|
|||
|
|
@ -52,7 +52,8 @@ const Block = ( props ) => {
|
|||
'wp-block-button',
|
||||
'wc-block-components-product-button',
|
||||
{
|
||||
[ `${ parentClassName }__product-add-to-cart` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-add-to-cart` ]:
|
||||
parentClassName,
|
||||
}
|
||||
) }
|
||||
>
|
||||
|
|
|
|||
|
|
@ -49,7 +49,8 @@ const Block = ( props: Props ): JSX.Element | null => {
|
|||
'wc-block-components-product-category-list',
|
||||
colorProps.className,
|
||||
{
|
||||
[ `${ parentClassName }__product-category-list` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-category-list` ]:
|
||||
parentClassName,
|
||||
}
|
||||
) }
|
||||
style={ { ...colorProps.style, ...typographyProps.style } }
|
||||
|
|
|
|||
|
|
@ -60,7 +60,8 @@ export const Block = ( props ) => {
|
|||
className,
|
||||
'wc-block-components-product-image',
|
||||
{
|
||||
[ `${ parentClassName }__product-image` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-image` ]:
|
||||
parentClassName,
|
||||
},
|
||||
borderProps.className
|
||||
) }
|
||||
|
|
|
|||
|
|
@ -23,12 +23,8 @@ import withProductSelector from '../shared/with-product-selector';
|
|||
import { BLOCK_TITLE, BLOCK_ICON } from './constants';
|
||||
|
||||
const Edit = ( { attributes, setAttributes } ) => {
|
||||
const {
|
||||
showProductLink,
|
||||
imageSizing,
|
||||
showSaleBadge,
|
||||
saleBadgeAlign,
|
||||
} = attributes;
|
||||
const { showProductLink, imageSizing, showSaleBadge, saleBadgeAlign } =
|
||||
attributes;
|
||||
|
||||
const blockProps = useBlockProps();
|
||||
|
||||
|
|
|
|||
|
|
@ -46,8 +46,7 @@ const productWithImages = {
|
|||
id: 56,
|
||||
src: 'logo-1.jpg',
|
||||
thumbnail: 'logo-1-324x324.jpg',
|
||||
srcset:
|
||||
'logo-1.jpg 800w, logo-1-300x300.jpg 300w, logo-1-150x150.jpg 150w, logo-1-768x767.jpg 768w, logo-1-324x324.jpg 324w, logo-1-416x415.jpg 416w, logo-1-100x100.jpg 100w',
|
||||
srcset: 'logo-1.jpg 800w, logo-1-300x300.jpg 300w, logo-1-150x150.jpg 150w, logo-1-768x767.jpg 768w, logo-1-324x324.jpg 324w, logo-1-416x415.jpg 416w, logo-1-100x100.jpg 100w',
|
||||
sizes: '(max-width: 800px) 100vw, 800px',
|
||||
name: 'logo-1.jpg',
|
||||
alt: '',
|
||||
|
|
@ -56,8 +55,7 @@ const productWithImages = {
|
|||
id: 55,
|
||||
src: 'beanie-with-logo-1.jpg',
|
||||
thumbnail: 'beanie-with-logo-1-324x324.jpg',
|
||||
srcset:
|
||||
'beanie-with-logo-1.jpg 800w, beanie-with-logo-1-300x300.jpg 300w, beanie-with-logo-1-150x150.jpg 150w, beanie-with-logo-1-768x768.jpg 768w, beanie-with-logo-1-324x324.jpg 324w, beanie-with-logo-1-416x416.jpg 416w, beanie-with-logo-1-100x100.jpg 100w',
|
||||
srcset: 'beanie-with-logo-1.jpg 800w, beanie-with-logo-1-300x300.jpg 300w, beanie-with-logo-1-150x150.jpg 150w, beanie-with-logo-1-768x768.jpg 768w, beanie-with-logo-1-324x324.jpg 324w, beanie-with-logo-1-416x416.jpg 416w, beanie-with-logo-1-100x100.jpg 100w',
|
||||
sizes: '(max-width: 800px) 100vw, 800px',
|
||||
name: 'beanie-with-logo-1.jpg',
|
||||
alt: '',
|
||||
|
|
|
|||
|
|
@ -79,7 +79,8 @@ const Block = ( props ) => {
|
|||
// This is the regular or original price when the `price` value is a sale price.
|
||||
regularPrice={ prices.regular_price }
|
||||
regularPriceClassName={ classnames( {
|
||||
[ `${ parentClassName }__product-price__regular` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-price__regular` ]:
|
||||
parentClassName,
|
||||
} ) }
|
||||
/>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -48,11 +48,16 @@ const Block = ( props ) => {
|
|||
colorProps.className,
|
||||
'wc-block-components-product-stock-indicator',
|
||||
{
|
||||
[ `${ parentClassName }__stock-indicator` ]: parentClassName,
|
||||
'wc-block-components-product-stock-indicator--in-stock': inStock,
|
||||
'wc-block-components-product-stock-indicator--out-of-stock': ! inStock,
|
||||
'wc-block-components-product-stock-indicator--low-stock': !! lowStock,
|
||||
'wc-block-components-product-stock-indicator--available-on-backorder': !! isBackordered,
|
||||
[ `${ parentClassName }__stock-indicator` ]:
|
||||
parentClassName,
|
||||
'wc-block-components-product-stock-indicator--in-stock':
|
||||
inStock,
|
||||
'wc-block-components-product-stock-indicator--out-of-stock':
|
||||
! inStock,
|
||||
'wc-block-components-product-stock-indicator--low-stock':
|
||||
!! lowStock,
|
||||
'wc-block-components-product-stock-indicator--available-on-backorder':
|
||||
!! isBackordered,
|
||||
}
|
||||
) }
|
||||
style={ { ...colorProps.style, ...typographyProps.style } }
|
||||
|
|
|
|||
|
|
@ -43,7 +43,8 @@ const Block = ( props ) => {
|
|||
className,
|
||||
`wc-block-components-product-summary`,
|
||||
{
|
||||
[ `${ parentClassName }__product-summary` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-summary` ]:
|
||||
parentClassName,
|
||||
}
|
||||
) }
|
||||
/>
|
||||
|
|
@ -65,7 +66,8 @@ const Block = ( props ) => {
|
|||
colorProps.className,
|
||||
`wc-block-components-product-summary`,
|
||||
{
|
||||
[ `${ parentClassName }__product-summary` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-summary` ]:
|
||||
parentClassName,
|
||||
}
|
||||
) }
|
||||
source={ source }
|
||||
|
|
|
|||
|
|
@ -45,7 +45,8 @@ const Block = ( props ) => {
|
|||
colorProps.className,
|
||||
'wc-block-components-product-tag-list',
|
||||
{
|
||||
[ `${ parentClassName }__product-tag-list` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-tag-list` ]:
|
||||
parentClassName,
|
||||
}
|
||||
) }
|
||||
style={ { ...colorProps.style, ...typographyProps.style } }
|
||||
|
|
|
|||
|
|
@ -33,7 +33,8 @@ interface TagNameProps extends HTMLAttributes< HTMLOrSVGElement > {
|
|||
const TagName = ( {
|
||||
children,
|
||||
headingLevel,
|
||||
elementType: ElementType = `h${ headingLevel }` as keyof JSX.IntrinsicElements,
|
||||
elementType:
|
||||
ElementType = `h${ headingLevel }` as keyof JSX.IntrinsicElements,
|
||||
...props
|
||||
}: TagNameProps ): JSX.Element => {
|
||||
return <ElementType { ...props }>{ children }</ElementType>;
|
||||
|
|
@ -77,7 +78,8 @@ export const Block = ( props: Props ): JSX.Element => {
|
|||
colorProps.className,
|
||||
'wc-block-components-product-title',
|
||||
{
|
||||
[ `${ parentClassName }__product-title` ]: parentClassName,
|
||||
[ `${ parentClassName }__product-title` ]:
|
||||
parentClassName,
|
||||
[ `wc-block-components-product-title--align-${ align }` ]:
|
||||
align && isFeaturePluginBuild(),
|
||||
}
|
||||
|
|
|
|||
|
|
@ -78,20 +78,17 @@ interface AddressFormProps {
|
|||
*/
|
||||
const AddressForm = ( {
|
||||
id = '',
|
||||
fields = ( Object.keys(
|
||||
fields = Object.keys(
|
||||
defaultAddressFields
|
||||
) as unknown ) as ( keyof AddressFields )[],
|
||||
) as unknown as ( keyof AddressFields )[],
|
||||
fieldConfig = {} as Record< keyof AddressFields, Partial< AddressField > >,
|
||||
instanceId,
|
||||
onChange,
|
||||
type = 'shipping',
|
||||
values,
|
||||
}: AddressFormProps ): JSX.Element => {
|
||||
const {
|
||||
getValidationError,
|
||||
setValidationErrors,
|
||||
clearValidationError,
|
||||
} = useValidationContext();
|
||||
const { getValidationError, setValidationErrors, clearValidationError } =
|
||||
useValidationContext();
|
||||
|
||||
const currentFields = useShallowEqual( fields );
|
||||
|
||||
|
|
|
|||
|
|
@ -81,11 +81,8 @@ const inputAddress = async ( {
|
|||
|
||||
describe( 'AddressForm Component', () => {
|
||||
const WrappedAddressForm = ( { type } ) => {
|
||||
const {
|
||||
defaultAddressFields,
|
||||
setShippingAddress,
|
||||
shippingAddress,
|
||||
} = useCheckoutAddress();
|
||||
const { defaultAddressFields, setShippingAddress, shippingAddress } =
|
||||
useCheckoutAddress();
|
||||
|
||||
return (
|
||||
<AddressForm
|
||||
|
|
|
|||
|
|
@ -64,7 +64,8 @@ const FormStep = ( {
|
|||
className,
|
||||
'wc-block-components-checkout-step',
|
||||
{
|
||||
'wc-block-components-checkout-step--with-step-number': showStepNumber,
|
||||
'wc-block-components-checkout-step--with-step-number':
|
||||
showStepNumber,
|
||||
'wc-block-components-checkout-step--disabled': disabled,
|
||||
}
|
||||
) }
|
||||
|
|
|
|||
|
|
@ -25,10 +25,8 @@ const ShippingCalculatorAddress = ( {
|
|||
addressFields,
|
||||
}: ShippingCalculatorAddressProps ): JSX.Element => {
|
||||
const [ address, setAddress ] = useState( initialAddress );
|
||||
const {
|
||||
hasValidationErrors,
|
||||
showAllValidationErrors,
|
||||
} = useValidationContext();
|
||||
const { hasValidationErrors, showAllValidationErrors } =
|
||||
useValidationContext();
|
||||
|
||||
const validateSubmit = () => {
|
||||
showAllValidationErrors();
|
||||
|
|
|
|||
|
|
@ -62,12 +62,8 @@ const PackageRates = ( {
|
|||
);
|
||||
}
|
||||
|
||||
const {
|
||||
label,
|
||||
secondaryLabel,
|
||||
description,
|
||||
secondaryDescription,
|
||||
} = renderOption( rates[ 0 ] );
|
||||
const { label, secondaryLabel, description, secondaryDescription } =
|
||||
renderOption( rates[ 0 ] );
|
||||
|
||||
return (
|
||||
<RadioControlOptionLayout
|
||||
|
|
|
|||
|
|
@ -21,8 +21,7 @@ const NZD: Currency = {
|
|||
};
|
||||
|
||||
export default {
|
||||
title:
|
||||
'WooCommerce Blocks/@base-components/cart-checkout/totals/FooterItem',
|
||||
title: 'WooCommerce Blocks/@base-components/cart-checkout/totals/FooterItem',
|
||||
component: FooterItem,
|
||||
args: {
|
||||
currency: NZD,
|
||||
|
|
|
|||
|
|
@ -131,9 +131,8 @@ export const TotalsShipping = ( {
|
|||
isCheckout = false,
|
||||
className,
|
||||
}: TotalShippingProps ): ReactElement => {
|
||||
const [ isShippingCalculatorOpen, setIsShippingCalculatorOpen ] = useState(
|
||||
false
|
||||
);
|
||||
const [ isShippingCalculatorOpen, setIsShippingCalculatorOpen ] =
|
||||
useState( false );
|
||||
const {
|
||||
shippingAddress,
|
||||
cartHasCalculatedShipping,
|
||||
|
|
|
|||
|
|
@ -55,11 +55,8 @@ const Combobox = ( {
|
|||
instanceId = '0',
|
||||
autoComplete = 'off',
|
||||
}: ComboboxProps ): JSX.Element => {
|
||||
const {
|
||||
getValidationError,
|
||||
setValidationErrors,
|
||||
clearValidationError,
|
||||
} = useValidationContext();
|
||||
const { getValidationError, setValidationErrors, clearValidationError } =
|
||||
useValidationContext();
|
||||
|
||||
const controlRef = useRef< HTMLDivElement >( null );
|
||||
const controlId = id || 'control-' + instanceId;
|
||||
|
|
@ -126,7 +123,8 @@ const Combobox = ( {
|
|||
}
|
||||
|
||||
// Try to match.
|
||||
const normalizedFilterValue = filterValue.toLocaleUpperCase();
|
||||
const normalizedFilterValue =
|
||||
filterValue.toLocaleUpperCase();
|
||||
const foundOption = options.find(
|
||||
( option ) =>
|
||||
option.label
|
||||
|
|
|
|||
|
|
@ -64,7 +64,8 @@ export const CountryInput = ( {
|
|||
autoComplete={ autoComplete }
|
||||
value={ value }
|
||||
onChange={ ( event ) => {
|
||||
const textValue = event.target.value.toLocaleUpperCase();
|
||||
const textValue =
|
||||
event.target.value.toLocaleUpperCase();
|
||||
const foundOption = options.find(
|
||||
( option ) =>
|
||||
( textValue.length !== 2 &&
|
||||
|
|
|
|||
|
|
@ -44,10 +44,8 @@ const Template: Story< CountryInputWithCountriesProps > = ( args ) => {
|
|||
const [ selectedCountry, selectCountry ] = useState< CountryCode | '' >(
|
||||
''
|
||||
);
|
||||
const {
|
||||
clearValidationError,
|
||||
showValidationError,
|
||||
} = useValidationContext();
|
||||
const { clearValidationError, showValidationError } =
|
||||
useValidationContext();
|
||||
|
||||
useEffect( () => {
|
||||
showValidationError( 'country' );
|
||||
|
|
|
|||
|
|
@ -46,9 +46,12 @@ const Drawer = ( {
|
|||
overlayClassName={ classNames(
|
||||
'wc-block-components-drawer__screen-overlay',
|
||||
{
|
||||
'wc-block-components-drawer__screen-overlay--is-hidden': ! isOpen,
|
||||
'wc-block-components-drawer__screen-overlay--with-slide-in': slideIn,
|
||||
'wc-block-components-drawer__screen-overlay--with-slide-out': slideOut,
|
||||
'wc-block-components-drawer__screen-overlay--is-hidden':
|
||||
! isOpen,
|
||||
'wc-block-components-drawer__screen-overlay--with-slide-in':
|
||||
slideIn,
|
||||
'wc-block-components-drawer__screen-overlay--with-slide-out':
|
||||
slideOut,
|
||||
}
|
||||
) }
|
||||
closeButtonLabel={ __(
|
||||
|
|
|
|||
|
|
@ -6,30 +6,36 @@ import type { NumberFormatValues } from 'react-number-format';
|
|||
/**
|
||||
Check if that the value is minor than the max price and greater than 0.
|
||||
*/
|
||||
export const isValidMaxValue = ( {
|
||||
export const isValidMaxValue =
|
||||
( {
|
||||
maxConstraint,
|
||||
minorUnit,
|
||||
}: {
|
||||
}: {
|
||||
maxConstraint: number;
|
||||
minorUnit: number;
|
||||
} ) => ( { floatValue }: NumberFormatValues ): boolean => {
|
||||
} ) =>
|
||||
( { floatValue }: NumberFormatValues ): boolean => {
|
||||
const maxPrice = maxConstraint / 10 ** minorUnit;
|
||||
|
||||
return floatValue !== undefined && floatValue <= maxPrice && floatValue > 0;
|
||||
};
|
||||
return (
|
||||
floatValue !== undefined && floatValue <= maxPrice && floatValue > 0
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
Check if that the value is minor than the max price and greater than 0.
|
||||
*/
|
||||
export const isValidMinValue = ( {
|
||||
export const isValidMinValue =
|
||||
( {
|
||||
minConstraint,
|
||||
currentMaxValue,
|
||||
minorUnit,
|
||||
}: {
|
||||
}: {
|
||||
minConstraint: number;
|
||||
currentMaxValue: number;
|
||||
minorUnit: number;
|
||||
} ) => ( { floatValue }: NumberFormatValues ): boolean => {
|
||||
} ) =>
|
||||
( { floatValue }: NumberFormatValues ): boolean => {
|
||||
const minPrice = minConstraint / 10 ** minorUnit;
|
||||
const currentMaxPrice = currentMaxValue / 10 ** minorUnit;
|
||||
|
||||
|
|
@ -38,4 +44,4 @@ export const isValidMinValue = ( {
|
|||
floatValue >= minPrice &&
|
||||
floatValue < currentMaxPrice
|
||||
);
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -142,9 +142,8 @@ const ProductList = ( {
|
|||
currentPage,
|
||||
} )
|
||||
);
|
||||
const { products, totalProducts, productsLoading } = useStoreProducts(
|
||||
queryState
|
||||
);
|
||||
const { products, totalProducts, productsLoading } =
|
||||
useStoreProducts( queryState );
|
||||
const { parentClassName, parentName } = useInnerBlockLayoutContext();
|
||||
const totalQuery = extractPaginationAndSortAttributes( queryState );
|
||||
const { dispatchStoreEvent } = useStoreEvents();
|
||||
|
|
|
|||
|
|
@ -37,9 +37,7 @@ export type TotalQuery = Pick< Query, 'catalog_visibility' >;
|
|||
|
||||
export type GenerateQuery = ( props: GenerateQueryProps ) => Query;
|
||||
|
||||
export type GetSortArgs = (
|
||||
orderName: string
|
||||
) =>
|
||||
export type GetSortArgs = ( orderName: string ) =>
|
||||
| {
|
||||
orderby: string;
|
||||
order: string;
|
||||
|
|
|
|||
|
|
@ -54,7 +54,8 @@ const RadioControlAccordion = ( {
|
|||
className={ classnames(
|
||||
'wc-block-components-radio-control-accordion-content',
|
||||
{
|
||||
'wc-block-components-radio-control-accordion-content-hide': ! checked,
|
||||
'wc-block-components-radio-control-accordion-content-hide':
|
||||
! checked,
|
||||
}
|
||||
) }
|
||||
>
|
||||
|
|
|
|||
|
|
@ -15,13 +15,8 @@ const Option = ( {
|
|||
onChange,
|
||||
option,
|
||||
}: RadioControlOptionProps ): JSX.Element => {
|
||||
const {
|
||||
value,
|
||||
label,
|
||||
description,
|
||||
secondaryLabel,
|
||||
secondaryDescription,
|
||||
} = option;
|
||||
const { value, label, description, secondaryLabel, secondaryDescription } =
|
||||
option;
|
||||
const onChangeValue = ( event: React.ChangeEvent< HTMLInputElement > ) =>
|
||||
onChange( event.target.value );
|
||||
|
||||
|
|
@ -30,7 +25,8 @@ const Option = ( {
|
|||
className={ classnames(
|
||||
'wc-block-components-radio-control__option',
|
||||
{
|
||||
'wc-block-components-radio-control__option-checked': checked,
|
||||
'wc-block-components-radio-control__option-checked':
|
||||
checked,
|
||||
}
|
||||
) }
|
||||
htmlFor={ `${ name }-${ value }` }
|
||||
|
|
@ -47,7 +43,8 @@ const Option = ( {
|
|||
[ `${ name }-${ value }__label` ]: label,
|
||||
[ `${ name }-${ value }__secondary-label` ]: secondaryLabel,
|
||||
[ `${ name }-${ value }__description` ]: description,
|
||||
[ `${ name }-${ value }__secondary-description` ]: secondaryDescription,
|
||||
[ `${ name }-${ value }__secondary-description` ]:
|
||||
secondaryDescription,
|
||||
} ) }
|
||||
/>
|
||||
<OptionLayout
|
||||
|
|
|
|||
|
|
@ -168,7 +168,8 @@ const ReviewListItem = ( { attributes, review = {} } ) => {
|
|||
'wc-block-components-review-list-item__item',
|
||||
{
|
||||
'is-loading': isLoading,
|
||||
'wc-block-components-review-list-item__item--has-image': showReviewImage,
|
||||
'wc-block-components-review-list-item__item--has-image':
|
||||
showReviewImage,
|
||||
}
|
||||
) }
|
||||
aria-hidden={ isLoading }
|
||||
|
|
|
|||
|
|
@ -4,13 +4,12 @@
|
|||
import { actions } from './reducer';
|
||||
import type { ActionType, ActionCallbackType } from './types';
|
||||
|
||||
export const emitterCallback = (
|
||||
type: string,
|
||||
observerDispatch: React.Dispatch< ActionType >
|
||||
) => ( callback: ActionCallbackType, priority = 10 ): ( () => void ) => {
|
||||
export const emitterCallback =
|
||||
( type: string, observerDispatch: React.Dispatch< ActionType > ) =>
|
||||
( callback: ActionCallbackType, priority = 10 ): ( () => void ) => {
|
||||
const action = actions.addEventCallback( type, callback, priority );
|
||||
observerDispatch( action );
|
||||
return () => {
|
||||
observerDispatch( actions.removeEventCallback( type, action.id ) );
|
||||
};
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -95,10 +95,8 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { setItemQuantity, quantity } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { setItemQuantity, quantity } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( quantity ).toBe( 1 );
|
||||
|
||||
|
|
@ -106,10 +104,8 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
setItemQuantity( 2 );
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { quantity: newQuantity } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { quantity: newQuantity } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( newQuantity ).toBe( 2 );
|
||||
} );
|
||||
|
|
@ -126,8 +122,7 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { removeItem } = renderer.root.findByType( 'div' ).props;
|
||||
const { removeItem } = renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
act( () => {
|
||||
removeItem();
|
||||
|
|
@ -148,8 +143,7 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { setItemQuantity } = renderer.root.findByType( 'div' ).props;
|
||||
const { setItemQuantity } = renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
act( () => {
|
||||
setItemQuantity( 2 );
|
||||
|
|
@ -182,10 +176,8 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { cartItemQuantityErrors } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { cartItemQuantityErrors } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( cartItemQuantityErrors ).toEqual( mockCartErrors );
|
||||
} );
|
||||
|
|
@ -210,8 +202,7 @@ describe( 'useStoreCartItemQuantity', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { isPendingDelete } = renderer.root.findByType( 'div' ).props;
|
||||
const { isPendingDelete } = renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( isPendingDelete ).toBe( true );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -189,14 +189,10 @@ describe( 'useStoreCart', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { results, receiveCart } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const {
|
||||
receiveCart: defaultReceiveCart,
|
||||
...remaining
|
||||
} = defaultCartData;
|
||||
const { results, receiveCart } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
const { receiveCart: defaultReceiveCart, ...remaining } =
|
||||
defaultCartData;
|
||||
expect( results ).toEqual( remaining );
|
||||
expect( receiveCart ).toEqual( defaultReceiveCart );
|
||||
} );
|
||||
|
|
@ -212,10 +208,8 @@ describe( 'useStoreCart', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { results, receiveCart } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { results, receiveCart } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( results ).toEqual( mockStoreCartData );
|
||||
expect( receiveCart ).toBeUndefined();
|
||||
|
|
@ -244,10 +238,8 @@ describe( 'useStoreCart', () => {
|
|||
);
|
||||
} );
|
||||
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { results, receiveCart } = renderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { results, receiveCart } =
|
||||
renderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
|
||||
expect( results ).toEqual( previewCartData );
|
||||
expect( receiveCart ).toEqual( receiveCartMock );
|
||||
|
|
|
|||
|
|
@ -51,10 +51,8 @@ export const useStoreCartItemQuantity = (
|
|||
verifiedCartItem.key = cartItem.key;
|
||||
verifiedCartItem.quantity = cartItem.quantity;
|
||||
}
|
||||
const {
|
||||
key: cartItemKey = '',
|
||||
quantity: cartItemQuantity = 1,
|
||||
} = verifiedCartItem;
|
||||
const { key: cartItemKey = '', quantity: cartItemQuantity = 1 } =
|
||||
verifiedCartItem;
|
||||
const { cartErrors } = useStoreCart();
|
||||
const { dispatchActions } = useCheckoutContext();
|
||||
|
||||
|
|
@ -62,9 +60,8 @@ export const useStoreCartItemQuantity = (
|
|||
const [ quantity, setQuantity ] = useState< number >( cartItemQuantity );
|
||||
const [ debouncedQuantity ] = useDebounce< number >( quantity, 400 );
|
||||
const previousDebouncedQuantity = usePrevious( debouncedQuantity );
|
||||
const { removeItemFromCart, changeCartItemQuantity } = useDispatch(
|
||||
storeKey
|
||||
);
|
||||
const { removeItemFromCart, changeCartItemQuantity } =
|
||||
useDispatch( storeKey );
|
||||
|
||||
// Update local state when server updates.
|
||||
useEffect( () => setQuantity( cartItemQuantity ), [ cartItemQuantity ] );
|
||||
|
|
|
|||
|
|
@ -179,9 +179,8 @@ export const useStoreCart = (
|
|||
const cartData = store.getCartData();
|
||||
const cartErrors = store.getCartErrors();
|
||||
const cartTotals = store.getCartTotals();
|
||||
const cartIsLoading = ! store.hasFinishedResolution(
|
||||
'getCartData'
|
||||
);
|
||||
const cartIsLoading =
|
||||
! store.hasFinishedResolution( 'getCartData' );
|
||||
|
||||
const isLoadingRates = store.isCustomerDataUpdating();
|
||||
const { receiveCart } = dispatch( storeKey );
|
||||
|
|
|
|||
|
|
@ -38,10 +38,8 @@ class TestErrorBoundary extends ReactComponent {
|
|||
describe( 'useCollection', () => {
|
||||
let registry, mocks, renderer;
|
||||
const getProps = ( testRenderer ) => {
|
||||
//eslint-disable-next-line testing-library/await-async-query
|
||||
const { results, isLoading } = testRenderer.root.findByType(
|
||||
'div'
|
||||
).props;
|
||||
const { results, isLoading } =
|
||||
testRenderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
return {
|
||||
results,
|
||||
isLoading,
|
||||
|
|
@ -56,7 +54,9 @@ describe( 'useCollection', () => {
|
|||
</RegistryProvider>
|
||||
);
|
||||
|
||||
const getTestComponent = () => ( { options } ) => {
|
||||
const getTestComponent =
|
||||
() =>
|
||||
( { options } ) => {
|
||||
const items = useCollection( options );
|
||||
return <div { ...items } />;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -57,14 +57,10 @@ export const useCollectionData = ( {
|
|||
context = `${ context }-collection-data`;
|
||||
|
||||
const [ collectionDataQueryState ] = useQueryStateByContext( context );
|
||||
const [
|
||||
calculateAttributesQueryState,
|
||||
setCalculateAttributesQueryState,
|
||||
] = useQueryStateByKey( 'calculate_attribute_counts', [], context );
|
||||
const [
|
||||
calculatePriceRangeQueryState,
|
||||
setCalculatePriceRangeQueryState,
|
||||
] = useQueryStateByKey( 'calculate_price_range', null, context );
|
||||
const [ calculateAttributesQueryState, setCalculateAttributesQueryState ] =
|
||||
useQueryStateByKey( 'calculate_attribute_counts', [], context );
|
||||
const [ calculatePriceRangeQueryState, setCalculatePriceRangeQueryState ] =
|
||||
useQueryStateByKey( 'calculate_price_range', null, context );
|
||||
const [
|
||||
calculateStockStatusQueryState,
|
||||
setCalculateStockStatusQueryState,
|
||||
|
|
|
|||
|
|
@ -64,11 +64,8 @@ export const usePaymentMethodInterface = (): PaymentMethodInterface => {
|
|||
selectShippingRate,
|
||||
needsShipping,
|
||||
} = useShippingData();
|
||||
const {
|
||||
billingAddress,
|
||||
shippingAddress,
|
||||
setShippingAddress,
|
||||
} = useCustomerDataContext();
|
||||
const { billingAddress, shippingAddress, setShippingAddress } =
|
||||
useCustomerDataContext();
|
||||
const { cartItems, cartFees, cartTotals, extensions } = useStoreCart();
|
||||
const { appliedCoupons } = useStoreCartCoupons();
|
||||
const { noticeContexts, responseTypes } = useEmitResponse();
|
||||
|
|
@ -98,8 +95,7 @@ export const usePaymentMethodInterface = (): PaymentMethodInterface => {
|
|||
{
|
||||
alternative: '',
|
||||
plugin: 'woocommerce-gutenberg-products-block',
|
||||
link:
|
||||
'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/4228',
|
||||
link: 'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/4228',
|
||||
}
|
||||
);
|
||||
setExpressPaymentError( errorMessage );
|
||||
|
|
|
|||
|
|
@ -23,11 +23,11 @@ export const useSelectShippingRate = (): SelectShippingRateType => {
|
|||
const throwError = useThrowError();
|
||||
const { dispatchCheckoutEvent } = useStoreEvents();
|
||||
|
||||
const { selectShippingRate: dispatchSelectShippingRate } = ( useDispatch(
|
||||
const { selectShippingRate: dispatchSelectShippingRate } = useDispatch(
|
||||
storeKey
|
||||
) as {
|
||||
selectShippingRate: unknown;
|
||||
} ) as {
|
||||
} as {
|
||||
selectShippingRate: (
|
||||
newShippingRateId: string,
|
||||
packageId: string | number
|
||||
|
|
|
|||
|
|
@ -43,9 +43,8 @@ export const useShippingData = (): ShippingData => {
|
|||
// set selected rates on ref so it's always current.
|
||||
const selectedRates = useRef< Record< string, unknown > >( {} );
|
||||
useEffect( () => {
|
||||
const derivedSelectedRates = deriveSelectedShippingRates(
|
||||
shippingRates
|
||||
);
|
||||
const derivedSelectedRates =
|
||||
deriveSelectedShippingRates( shippingRates );
|
||||
if (
|
||||
isObject( derivedSelectedRates ) &&
|
||||
! isShallowEqual( selectedRates.current, derivedSelectedRates )
|
||||
|
|
|
|||
|
|
@ -18,11 +18,8 @@ jest.mock( '@woocommerce/block-data', () => ( {
|
|||
describe( 'useStoreProducts', () => {
|
||||
let registry, mocks, renderer;
|
||||
const getProps = ( testRenderer ) => {
|
||||
const {
|
||||
products,
|
||||
totalProducts,
|
||||
productsLoading,
|
||||
} = testRenderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
const { products, totalProducts, productsLoading } =
|
||||
testRenderer.root.findByType( 'div' ).props; //eslint-disable-line testing-library/await-async-query
|
||||
return {
|
||||
products,
|
||||
totalProducts,
|
||||
|
|
@ -36,7 +33,9 @@ describe( 'useStoreProducts', () => {
|
|||
</RegistryProvider>
|
||||
);
|
||||
|
||||
const getTestComponent = () => ( { query } ) => {
|
||||
const getTestComponent =
|
||||
() =>
|
||||
( { query } ) => {
|
||||
const items = useStoreProducts( query );
|
||||
return <div { ...items } />;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -37,10 +37,8 @@ interface CheckoutAddress {
|
|||
*/
|
||||
export const useCheckoutAddress = (): CheckoutAddress => {
|
||||
const { needsShipping } = useShippingData();
|
||||
const {
|
||||
useShippingAsBilling,
|
||||
setUseShippingAsBilling,
|
||||
} = useCheckoutContext();
|
||||
const { useShippingAsBilling, setUseShippingAsBilling } =
|
||||
useCheckoutContext();
|
||||
const {
|
||||
billingAddress,
|
||||
setBillingAddress,
|
||||
|
|
|
|||
|
|
@ -25,10 +25,8 @@ export const useCheckoutSubmit = () => {
|
|||
hasError,
|
||||
} = useCheckoutContext();
|
||||
const { paymentMethods = {} } = usePaymentMethods();
|
||||
const {
|
||||
activePaymentMethod,
|
||||
currentStatus: paymentStatus,
|
||||
} = usePaymentMethodDataContext();
|
||||
const { activePaymentMethod, currentStatus: paymentStatus } =
|
||||
usePaymentMethodDataContext();
|
||||
const paymentMethod = paymentMethods[ activePaymentMethod ] || {};
|
||||
const waitingForProcessing =
|
||||
isProcessing || isAfterProcessing || isBeforeProcessing;
|
||||
|
|
|
|||
|
|
@ -46,12 +46,12 @@ export const useValidation = (): ValidationData => {
|
|||
( errorsObject: Record< string, ValidationContextError > ) =>
|
||||
setValidationErrors(
|
||||
Object.fromEntries(
|
||||
Object.entries(
|
||||
errorsObject
|
||||
).map( ( [ validationErrorId, error ] ) => [
|
||||
Object.entries( errorsObject ).map(
|
||||
( [ validationErrorId, error ] ) => [
|
||||
`${ prefix }-${ validationErrorId }`,
|
||||
error,
|
||||
] )
|
||||
]
|
||||
)
|
||||
)
|
||||
),
|
||||
[ setValidationErrors ]
|
||||
|
|
|
|||
|
|
@ -101,24 +101,22 @@ export const AddToCartFormStateContextProvider = ( {
|
|||
const currentObservers = useShallowEqual( observers );
|
||||
const { createErrorNotice } = useDispatch( 'core/notices' );
|
||||
const { setValidationErrors } = useValidationContext();
|
||||
const {
|
||||
isSuccessResponse,
|
||||
isErrorResponse,
|
||||
isFailResponse,
|
||||
} = useEmitResponse();
|
||||
const { isSuccessResponse, isErrorResponse, isFailResponse } =
|
||||
useEmitResponse();
|
||||
|
||||
/**
|
||||
* @type {AddToCartFormEventRegistration}
|
||||
*/
|
||||
const eventRegistration = useMemo(
|
||||
() => ( {
|
||||
onAddToCartAfterProcessingWithSuccess: emitterObservers(
|
||||
observerDispatch
|
||||
).onAddToCartAfterProcessingWithSuccess,
|
||||
onAddToCartAfterProcessingWithError: emitterObservers(
|
||||
observerDispatch
|
||||
).onAddToCartAfterProcessingWithError,
|
||||
onAddToCartBeforeProcessing: emitterObservers( observerDispatch )
|
||||
onAddToCartAfterProcessingWithSuccess:
|
||||
emitterObservers( observerDispatch )
|
||||
.onAddToCartAfterProcessingWithSuccess,
|
||||
onAddToCartAfterProcessingWithError:
|
||||
emitterObservers( observerDispatch )
|
||||
.onAddToCartAfterProcessingWithError,
|
||||
onAddToCartBeforeProcessing:
|
||||
emitterObservers( observerDispatch )
|
||||
.onAddToCartBeforeProcessing,
|
||||
} ),
|
||||
[ observerDispatch ]
|
||||
|
|
|
|||
|
|
@ -30,10 +30,8 @@ const FormSubmit = () => {
|
|||
isProcessing,
|
||||
requestParams,
|
||||
} = useAddToCartFormContext();
|
||||
const {
|
||||
hasValidationErrors,
|
||||
showAllValidationErrors,
|
||||
} = useValidationContext();
|
||||
const { hasValidationErrors, showAllValidationErrors } =
|
||||
useValidationContext();
|
||||
const { createErrorNotice, removeNotice } = useDispatch( 'core/notices' );
|
||||
const { receiveCart } = useStoreCart();
|
||||
const [ isSubmitting, setIsSubmitting ] = useState( false );
|
||||
|
|
@ -51,7 +49,8 @@ const FormSubmit = () => {
|
|||
|
||||
// Subscribe to emitter before processing.
|
||||
useEffect( () => {
|
||||
const unsubscribeProcessing = eventRegistration.onAddToCartBeforeProcessing(
|
||||
const unsubscribeProcessing =
|
||||
eventRegistration.onAddToCartBeforeProcessing(
|
||||
checkValidationContext,
|
||||
0
|
||||
);
|
||||
|
|
|
|||
|
|
@ -81,17 +81,10 @@ export const CheckoutStateProvider = ( {
|
|||
|
||||
const { dispatchCheckoutEvent } = useStoreEvents();
|
||||
const isCalculating = checkoutState.calculatingCount > 0;
|
||||
const {
|
||||
isSuccessResponse,
|
||||
isErrorResponse,
|
||||
isFailResponse,
|
||||
shouldRetry,
|
||||
} = useEmitResponse();
|
||||
const {
|
||||
checkoutNotices,
|
||||
paymentNotices,
|
||||
expressPaymentNotices,
|
||||
} = useCheckoutNotices();
|
||||
const { isSuccessResponse, isErrorResponse, isFailResponse, shouldRetry } =
|
||||
useEmitResponse();
|
||||
const { checkoutNotices, paymentNotices, expressPaymentNotices } =
|
||||
useCheckoutNotices();
|
||||
|
||||
const [ observers, observerDispatch ] = useReducer( emitReducer, {} );
|
||||
const currentObservers = useRef( observers );
|
||||
|
|
@ -147,9 +140,8 @@ export const CheckoutStateProvider = ( {
|
|||
setExtensionData: ( extensionData ) =>
|
||||
void dispatch( actions.setExtensionData( extensionData ) ),
|
||||
setAfterProcessing: ( response ) => {
|
||||
const paymentResult = getPaymentResultFromCheckoutResponse(
|
||||
response
|
||||
);
|
||||
const paymentResult =
|
||||
getPaymentResultFromCheckoutResponse( response );
|
||||
dispatch(
|
||||
actions.setRedirectUrl( paymentResult?.redirectUrl || '' )
|
||||
);
|
||||
|
|
@ -244,9 +236,8 @@ export const CheckoutStateProvider = ( {
|
|||
EMIT_TYPES.CHECKOUT_AFTER_PROCESSING_WITH_ERROR,
|
||||
data
|
||||
).then( ( observerResponses ) => {
|
||||
const errorResponse = handleErrorResponse(
|
||||
observerResponses
|
||||
);
|
||||
const errorResponse =
|
||||
handleErrorResponse( observerResponses );
|
||||
if ( errorResponse !== null ) {
|
||||
// irrecoverable error so set complete
|
||||
if ( ! shouldRetry( errorResponse ) ) {
|
||||
|
|
|
|||
|
|
@ -33,9 +33,8 @@ export const getPaymentResultFromCheckoutResponse = (
|
|||
) {
|
||||
response.payment_result.payment_details.forEach(
|
||||
( { key, value }: { key: string; value: string } ) => {
|
||||
paymentResult.paymentDetails[ key ] = decodeEntities(
|
||||
value
|
||||
);
|
||||
paymentResult.paymentDetails[ key ] =
|
||||
decodeEntities( value );
|
||||
}
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,8 @@ export enum ACTION {
|
|||
}
|
||||
|
||||
// Note - if fields are added/shape is changed, you may want to update PRISTINE reducer clause to preserve your new field.
|
||||
export const DEFAULT_PAYMENT_DATA_CONTEXT_STATE: PaymentMethodDataContextState = {
|
||||
export const DEFAULT_PAYMENT_DATA_CONTEXT_STATE: PaymentMethodDataContextState =
|
||||
{
|
||||
currentStatus: STATUS.PRISTINE,
|
||||
shouldSavePaymentMethod: false,
|
||||
activePaymentMethod: '',
|
||||
|
|
@ -34,7 +35,7 @@ export const DEFAULT_PAYMENT_DATA_CONTEXT_STATE: PaymentMethodDataContextState =
|
|||
errorMessage: '',
|
||||
paymentMethods: {},
|
||||
expressPaymentMethods: {},
|
||||
};
|
||||
};
|
||||
|
||||
export const DEFAULT_PAYMENT_METHOD_DATA: PaymentMethodDataContextType = {
|
||||
setPaymentStatus: () => ( {
|
||||
|
|
|
|||
|
|
@ -70,9 +70,8 @@ export const PaymentMethodDataProvider = ( {
|
|||
} = useCheckoutContext();
|
||||
const { isEditor, getPreviewData } = useEditorContext();
|
||||
const { setValidationErrors } = useValidationContext();
|
||||
const { createErrorNotice: addErrorNotice, removeNotice } = useDispatch(
|
||||
'core/notices'
|
||||
);
|
||||
const { createErrorNotice: addErrorNotice, removeNotice } =
|
||||
useDispatch( 'core/notices' );
|
||||
const {
|
||||
isSuccessResponse,
|
||||
isErrorResponse,
|
||||
|
|
@ -93,10 +92,8 @@ export const PaymentMethodDataProvider = ( {
|
|||
DEFAULT_PAYMENT_DATA_CONTEXT_STATE
|
||||
);
|
||||
|
||||
const {
|
||||
dispatchActions,
|
||||
setPaymentStatus,
|
||||
} = usePaymentMethodDataDispatchers( dispatch );
|
||||
const { dispatchActions, setPaymentStatus } =
|
||||
usePaymentMethodDataDispatchers( dispatch );
|
||||
|
||||
const paymentMethodsInitialized = usePaymentMethods(
|
||||
dispatchActions.setRegisteredPaymentMethods
|
||||
|
|
|
|||
|
|
@ -230,10 +230,8 @@ describe( 'Testing Payment Method Data Context Provider with saved cards turned
|
|||
|
||||
it( 'resets saved payment method data after starting and closing an express payment method', async () => {
|
||||
const TriggerActiveExpressPaymentMethod = () => {
|
||||
const {
|
||||
activePaymentMethod,
|
||||
paymentMethodData,
|
||||
} = usePaymentMethodDataContext();
|
||||
const { activePaymentMethod, paymentMethodData } =
|
||||
usePaymentMethodDataContext();
|
||||
return (
|
||||
<>
|
||||
<CheckoutExpressPayment />
|
||||
|
|
|
|||
|
|
@ -216,13 +216,14 @@ const usePaymentMethodRegistration = (
|
|||
export const usePaymentMethods = (
|
||||
dispatcher: PaymentMethodsDispatcherType
|
||||
): boolean => {
|
||||
const standardMethods: PaymentMethods = getPaymentMethods() as PaymentMethods;
|
||||
const standardMethods: PaymentMethods =
|
||||
getPaymentMethods() as PaymentMethods;
|
||||
const { noticeContexts } = useEmitResponse();
|
||||
// Ensure all methods are present in order.
|
||||
// Some payment methods may not be present in paymentGatewaySortOrder if they
|
||||
// depend on state, e.g. COD can depend on shipping method.
|
||||
const displayOrder = new Set( [
|
||||
...( getSetting( 'paymentGatewaySortOrder', [] ) as [ ] ),
|
||||
...( getSetting( 'paymentGatewaySortOrder', [] ) as [] ),
|
||||
...Object.keys( standardMethods ),
|
||||
] );
|
||||
return usePaymentMethodRegistration(
|
||||
|
|
@ -243,7 +244,8 @@ export const usePaymentMethods = (
|
|||
export const useExpressPaymentMethods = (
|
||||
dispatcher: PaymentMethodsDispatcherType
|
||||
): boolean => {
|
||||
const expressMethods: ExpressPaymentMethods = getExpressPaymentMethods() as ExpressPaymentMethods;
|
||||
const expressMethods: ExpressPaymentMethods =
|
||||
getExpressPaymentMethods() as ExpressPaymentMethods;
|
||||
const { noticeContexts } = useEmitResponse();
|
||||
return usePaymentMethodRegistration(
|
||||
dispatcher,
|
||||
|
|
|
|||
|
|
@ -61,13 +61,13 @@ export const ShippingDataProvider = ( { children } ) => {
|
|||
const currentObservers = useRef( observers );
|
||||
const eventObservers = useMemo(
|
||||
() => ( {
|
||||
onShippingRateSuccess: emitterObservers( observerDispatch )
|
||||
.onSuccess,
|
||||
onShippingRateSuccess:
|
||||
emitterObservers( observerDispatch ).onSuccess,
|
||||
onShippingRateFail: emitterObservers( observerDispatch ).onFail,
|
||||
onShippingRateSelectSuccess: emitterObservers( observerDispatch )
|
||||
.onSelectSuccess,
|
||||
onShippingRateSelectFail: emitterObservers( observerDispatch )
|
||||
.onSelectFail,
|
||||
onShippingRateSelectSuccess:
|
||||
emitterObservers( observerDispatch ).onSelectSuccess,
|
||||
onShippingRateSelectFail:
|
||||
emitterObservers( observerDispatch ).onSelectFail,
|
||||
} ),
|
||||
[ observerDispatch ]
|
||||
);
|
||||
|
|
|
|||
|
|
@ -92,13 +92,8 @@ const withReviews = ( OriginalComponent ) => {
|
|||
}
|
||||
|
||||
getArgs( reviewsToSkip ) {
|
||||
const {
|
||||
categoryIds,
|
||||
order,
|
||||
orderby,
|
||||
productId,
|
||||
reviewsToDisplay,
|
||||
} = this.props;
|
||||
const { categoryIds, order, orderby, productId, reviewsToDisplay } =
|
||||
this.props;
|
||||
const args = {
|
||||
order,
|
||||
orderby,
|
||||
|
|
@ -214,9 +209,8 @@ const withReviews = ( OriginalComponent ) => {
|
|||
}
|
||||
}
|
||||
|
||||
const {
|
||||
displayName = OriginalComponent.name || 'Component',
|
||||
} = OriginalComponent;
|
||||
const { displayName = OriginalComponent.name || 'Component' } =
|
||||
OriginalComponent;
|
||||
WrappedComponent.displayName = `WithReviews( ${ displayName } )`;
|
||||
|
||||
return WrappedComponent;
|
||||
|
|
|
|||
|
|
@ -11,10 +11,8 @@ import { usePositionRelativeToViewport } from '../use-position-relative-to-viewp
|
|||
describe( 'usePositionRelativeToViewport', () => {
|
||||
function setup() {
|
||||
const TestComponent = () => {
|
||||
const [
|
||||
referenceElement,
|
||||
positionRelativeToViewport,
|
||||
] = usePositionRelativeToViewport();
|
||||
const [ referenceElement, positionRelativeToViewport ] =
|
||||
usePositionRelativeToViewport();
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
|
|||
|
|
@ -25,8 +25,8 @@ describe( 'usePrevious', () => {
|
|||
renderer = TestRenderer.create( <TestComponent testValue={ 1 } /> );
|
||||
} );
|
||||
const testValue = renderer.root.findByType( 'div' ).props.testValue;
|
||||
const testPreviousValue = renderer.root.findByType( 'div' ).props
|
||||
.previousValue;
|
||||
const testPreviousValue =
|
||||
renderer.root.findByType( 'div' ).props.previousValue;
|
||||
|
||||
expect( testValue ).toBe( 1 );
|
||||
expect( testPreviousValue ).toBe( undefined );
|
||||
|
|
@ -43,8 +43,8 @@ describe( 'usePrevious', () => {
|
|||
renderer.update( <TestComponent testValue={ 2 } /> );
|
||||
} );
|
||||
testValue = renderer.root.findByType( 'div' ).props.testValue;
|
||||
testPreviousValue = renderer.root.findByType( 'div' ).props
|
||||
.previousValue;
|
||||
testPreviousValue =
|
||||
renderer.root.findByType( 'div' ).props.previousValue;
|
||||
expect( testValue ).toBe( 2 );
|
||||
expect( testPreviousValue ).toBe( 1 );
|
||||
|
||||
|
|
@ -52,8 +52,8 @@ describe( 'usePrevious', () => {
|
|||
renderer.update( <TestComponent testValue={ 3 } /> );
|
||||
} );
|
||||
testValue = renderer.root.findByType( 'div' ).props.testValue;
|
||||
testPreviousValue = renderer.root.findByType( 'div' ).props
|
||||
.previousValue;
|
||||
testPreviousValue =
|
||||
renderer.root.findByType( 'div' ).props.previousValue;
|
||||
expect( testValue ).toBe( 3 );
|
||||
expect( testPreviousValue ).toBe( 2 );
|
||||
} );
|
||||
|
|
@ -73,8 +73,8 @@ describe( 'usePrevious', () => {
|
|||
);
|
||||
} );
|
||||
testValue = renderer.root.findByType( 'div' ).props.testValue;
|
||||
testPreviousValue = renderer.root.findByType( 'div' ).props
|
||||
.previousValue;
|
||||
testPreviousValue =
|
||||
renderer.root.findByType( 'div' ).props.previousValue;
|
||||
expect( testValue ).toBe( 'abc' );
|
||||
expect( testPreviousValue ).toBe( 1 );
|
||||
|
||||
|
|
@ -84,8 +84,8 @@ describe( 'usePrevious', () => {
|
|||
);
|
||||
} );
|
||||
testValue = renderer.root.findByType( 'div' ).props.testValue;
|
||||
testPreviousValue = renderer.root.findByType( 'div' ).props
|
||||
.previousValue;
|
||||
testPreviousValue =
|
||||
renderer.root.findByType( 'div' ).props.previousValue;
|
||||
expect( testValue ).toBe( 3 );
|
||||
expect( testPreviousValue ).toBe( 1 );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -43,10 +43,8 @@ const style = {
|
|||
* ```
|
||||
*/
|
||||
export const usePositionRelativeToViewport = () => {
|
||||
const [
|
||||
positionRelativeToViewport,
|
||||
setPositionRelativeToViewport,
|
||||
] = useState( '' );
|
||||
const [ positionRelativeToViewport, setPositionRelativeToViewport ] =
|
||||
useState( '' );
|
||||
const referenceElementRef = useRef( null );
|
||||
const intersectionObserver = useRef(
|
||||
new IntersectionObserver(
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@ import { getCanMakePayment } from './payment-method-config-helper';
|
|||
import { assertConfigHasProperties, assertValidElement } from './assertions';
|
||||
|
||||
export default class ExpressPaymentMethodConfig
|
||||
implements ExpressPaymentMethodConfigInstance {
|
||||
implements ExpressPaymentMethodConfigInstance
|
||||
{
|
||||
public name: string;
|
||||
public content: ReactNode;
|
||||
public edit: ReactNode;
|
||||
|
|
|
|||
|
|
@ -11,12 +11,14 @@ export type NamespacedCanMakePaymentExtensionsCallbacks = Record<
|
|||
string,
|
||||
CanMakePaymentExtensionCallbacks
|
||||
>;
|
||||
export type ExtensionNamespace = keyof NamespacedCanMakePaymentExtensionsCallbacks;
|
||||
export type ExtensionNamespace =
|
||||
keyof NamespacedCanMakePaymentExtensionsCallbacks;
|
||||
export type PaymentMethodName = keyof CanMakePaymentExtensionCallbacks;
|
||||
|
||||
// Keeps callbacks registered by extensions for different payment methods
|
||||
// eslint-disable-next-line prefer-const
|
||||
export const canMakePaymentExtensionsCallbacks: NamespacedCanMakePaymentExtensionsCallbacks = {};
|
||||
export const canMakePaymentExtensionsCallbacks: NamespacedCanMakePaymentExtensionsCallbacks =
|
||||
{};
|
||||
|
||||
export const extensionsConfig = {
|
||||
canMakePayment: canMakePaymentExtensionsCallbacks,
|
||||
|
|
|
|||
|
|
@ -17,23 +17,27 @@ import {
|
|||
} from './extensions-config';
|
||||
|
||||
// Filter out payment methods by supported features and cart requirement.
|
||||
export const canMakePaymentWithFeaturesCheck = (
|
||||
export const canMakePaymentWithFeaturesCheck =
|
||||
(
|
||||
canMakePayment: CanMakePaymentCallback,
|
||||
features: string[]
|
||||
): CanMakePaymentCallback => ( canPayArgument ) => {
|
||||
): CanMakePaymentCallback =>
|
||||
( canPayArgument ) => {
|
||||
const requirements = canPayArgument?.paymentRequirements || [];
|
||||
const featuresSupportRequirements = requirements.every( ( requirement ) =>
|
||||
features.includes( requirement )
|
||||
const featuresSupportRequirements = requirements.every(
|
||||
( requirement ) => features.includes( requirement )
|
||||
);
|
||||
return featuresSupportRequirements && canMakePayment( canPayArgument );
|
||||
};
|
||||
};
|
||||
|
||||
// Filter out payment methods by callbacks registered by extensions.
|
||||
export const canMakePaymentWithExtensions = (
|
||||
export const canMakePaymentWithExtensions =
|
||||
(
|
||||
canMakePayment: CanMakePaymentCallback,
|
||||
extensionsCallbacks: NamespacedCanMakePaymentExtensionsCallbacks,
|
||||
paymentMethodName: PaymentMethodName
|
||||
): CanMakePaymentCallback => ( canPayArgument ) => {
|
||||
): CanMakePaymentCallback =>
|
||||
( canPayArgument ) => {
|
||||
// Validate whether the payment method is available based on its own criteria first.
|
||||
let canPay = canMakePayment( canPayArgument );
|
||||
|
||||
|
|
@ -51,9 +55,12 @@ export const canMakePaymentWithExtensions = (
|
|||
}
|
||||
);
|
||||
|
||||
canPay = Object.keys( namespacedCallbacks ).every( ( namespace ) => {
|
||||
canPay = Object.keys( namespacedCallbacks ).every(
|
||||
( namespace ) => {
|
||||
try {
|
||||
return namespacedCallbacks[ namespace ]( canPayArgument );
|
||||
return namespacedCallbacks[ namespace ](
|
||||
canPayArgument
|
||||
);
|
||||
} catch ( err ) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(
|
||||
|
|
@ -64,11 +71,12 @@ export const canMakePaymentWithExtensions = (
|
|||
// this ensures that the error is ignored when computing the whole result.
|
||||
return true;
|
||||
}
|
||||
} );
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
return canPay;
|
||||
};
|
||||
};
|
||||
|
||||
export const getCanMakePayment = (
|
||||
canMakePayment: CanMakePaymentCallback,
|
||||
|
|
@ -77,10 +85,12 @@ export const getCanMakePayment = (
|
|||
): CanMakePaymentCallback => {
|
||||
const canPay = canMakePaymentWithFeaturesCheck( canMakePayment, features );
|
||||
// Loop through all callbacks to check if there are any registered for this payment method.
|
||||
return ( Object.values( extensionsConfig.canMakePayment ) as Record<
|
||||
return (
|
||||
Object.values( extensionsConfig.canMakePayment ) as Record<
|
||||
PaymentMethodName,
|
||||
CanMakePaymentCallback
|
||||
>[] ).some( ( callbacks ) => paymentMethodName in callbacks )
|
||||
>[]
|
||||
).some( ( callbacks ) => paymentMethodName in callbacks )
|
||||
? canMakePaymentWithExtensions(
|
||||
canPay,
|
||||
extensionsConfig.canMakePayment,
|
||||
|
|
|
|||
|
|
@ -26,7 +26,8 @@ const NullComponent = () => {
|
|||
};
|
||||
|
||||
export default class PaymentMethodConfig
|
||||
implements PaymentMethodConfigInstance {
|
||||
implements PaymentMethodConfigInstance
|
||||
{
|
||||
public name: string;
|
||||
public content: ReactNode;
|
||||
public edit: ReactNode;
|
||||
|
|
@ -142,8 +143,7 @@ export default class PaymentMethodConfig
|
|||
{
|
||||
alternative: 'Pass showSavedCards and showSaveOption',
|
||||
plugin: 'woocommerce-gutenberg-products-block',
|
||||
link:
|
||||
'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3686',
|
||||
link: 'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3686',
|
||||
}
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,8 +38,7 @@ export const registerPaymentMethod = (
|
|||
deprecated( 'Passing a callback to registerPaymentMethod()', {
|
||||
alternative: 'a config options object',
|
||||
plugin: 'woocommerce-gutenberg-products-block',
|
||||
link:
|
||||
'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3404',
|
||||
link: 'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3404',
|
||||
} );
|
||||
} else {
|
||||
paymentMethodConfig = new PaymentMethodConfig( options );
|
||||
|
|
@ -65,8 +64,7 @@ export const registerExpressPaymentMethod = (
|
|||
deprecated( 'Passing a callback to registerExpressPaymentMethod()', {
|
||||
alternative: 'a config options object',
|
||||
plugin: 'woocommerce-gutenberg-products-block',
|
||||
link:
|
||||
'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3404',
|
||||
link: 'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/3404',
|
||||
} );
|
||||
} else {
|
||||
paymentMethodConfig = new ExpressPaymentMethodConfig( options );
|
||||
|
|
|
|||
|
|
@ -153,7 +153,8 @@ describe( 'payment-method-config-helper', () => {
|
|||
describe( 'canMakePaymentWithExtensions', () => {
|
||||
it( "Returns false without executing the registered callbacks, if the payment method's canMakePayment callback returns false.", () => {
|
||||
const canMakePayment = () => false;
|
||||
const canMakePaymentWithExtensionsResult = helpers.canMakePaymentWithExtensions(
|
||||
const canMakePaymentWithExtensionsResult =
|
||||
helpers.canMakePaymentWithExtensions(
|
||||
canMakePayment,
|
||||
canMakePaymentExtensionsCallbacks,
|
||||
'cod'
|
||||
|
|
|
|||
|
|
@ -101,7 +101,8 @@ const ActiveAttributeFilters = ( {
|
|||
|
||||
// Remove only the slug from the URL.
|
||||
return removeArgsFromFilterUrl( {
|
||||
[ `filter_${ attributeObject.name }` ]: slug,
|
||||
[ `filter_${ attributeObject.name }` ]:
|
||||
slug,
|
||||
} );
|
||||
}
|
||||
removeAttributeFilterBySlug(
|
||||
|
|
|
|||
|
|
@ -125,9 +125,8 @@ const ActiveFiltersBlock = ( {
|
|||
} );
|
||||
}, [ productAttributes, blockAttributes.displayStyle ] );
|
||||
|
||||
const [ productRatings, setProductRatings ] = useQueryStateByKey(
|
||||
'ratings'
|
||||
);
|
||||
const [ productRatings, setProductRatings ] =
|
||||
useQueryStateByKey( 'ratings' );
|
||||
|
||||
/**
|
||||
* Parse the filter URL to set the active rating fitlers.
|
||||
|
|
|
|||
|
|
@ -81,9 +81,8 @@ const AttributeFilterBlock = ( {
|
|||
isString
|
||||
);
|
||||
|
||||
const [ hasSetPhpFilterDefaults, setHasSetPhpFilterDefaults ] = useState(
|
||||
false
|
||||
);
|
||||
const [ hasSetPhpFilterDefaults, setHasSetPhpFilterDefaults ] =
|
||||
useState( false );
|
||||
|
||||
const attributeObject =
|
||||
blockAttributes.isPreview && ! blockAttributes.attributeId
|
||||
|
|
@ -103,15 +102,11 @@ const AttributeFilterBlock = ( {
|
|||
const borderProps = useBorderProps( blockAttributes );
|
||||
|
||||
const [ queryState ] = useQueryStateByContext();
|
||||
const [
|
||||
productAttributesQuery,
|
||||
setProductAttributesQuery,
|
||||
] = useQueryStateByKey( 'attributes', [] );
|
||||
const [ productAttributesQuery, setProductAttributesQuery ] =
|
||||
useQueryStateByKey( 'attributes', [] );
|
||||
|
||||
const {
|
||||
results: attributeTerms,
|
||||
isLoading: attributeTermsLoading,
|
||||
} = useCollection( {
|
||||
const { results: attributeTerms, isLoading: attributeTermsLoading } =
|
||||
useCollection( {
|
||||
namespace: '/wc/store/v1',
|
||||
resourceName: 'products/attributes/terms',
|
||||
resourceValues: [ attributeObject?.id || 0 ],
|
||||
|
|
@ -121,10 +116,8 @@ const AttributeFilterBlock = ( {
|
|||
const filterAvailableTerms =
|
||||
blockAttributes.displayStyle !== 'dropdown' &&
|
||||
blockAttributes.queryType === 'and';
|
||||
const {
|
||||
results: filteredCounts,
|
||||
isLoading: filteredCountsLoading,
|
||||
} = useCollectionData( {
|
||||
const { results: filteredCounts, isLoading: filteredCountsLoading } =
|
||||
useCollectionData( {
|
||||
queryAttribute: {
|
||||
taxonomy: attributeObject?.taxonomy,
|
||||
queryType: blockAttributes.queryType,
|
||||
|
|
|
|||
|
|
@ -98,8 +98,7 @@ const ExpressPaymentMethods = () => {
|
|||
{
|
||||
alternative: 'onError',
|
||||
plugin: 'woocommerce-gutenberg-products-block',
|
||||
link:
|
||||
'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/4228',
|
||||
link: 'https://github.com/woocommerce/woocommerce-gutenberg-products-block/pull/4228',
|
||||
}
|
||||
);
|
||||
if ( errorMessage ) {
|
||||
|
|
@ -132,7 +131,8 @@ const ExpressPaymentMethods = () => {
|
|||
onClick: onExpressPaymentClick( id ),
|
||||
onClose: onExpressPaymentClose,
|
||||
onError: onExpressPaymentError,
|
||||
setExpressPaymentError: deprecatedSetExpressPaymentError,
|
||||
setExpressPaymentError:
|
||||
deprecatedSetExpressPaymentError,
|
||||
} ) }
|
||||
</li>
|
||||
) : null;
|
||||
|
|
|
|||
|
|
@ -27,10 +27,8 @@ import PaymentMethodErrorBoundary from './payment-method-error-boundary';
|
|||
*/
|
||||
const PaymentMethodCard = ( { children, showSaveOption } ) => {
|
||||
const { isEditor } = useEditorContext();
|
||||
const {
|
||||
shouldSavePayment,
|
||||
setShouldSavePayment,
|
||||
} = usePaymentMethodDataContext();
|
||||
const { shouldSavePayment, setShouldSavePayment } =
|
||||
usePaymentMethodDataContext();
|
||||
const { customerId } = useCheckoutContext();
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -34,10 +34,8 @@ const PaymentMethodOptions = () => {
|
|||
customerPaymentMethods,
|
||||
} = usePaymentMethodDataContext();
|
||||
const { paymentMethods } = usePaymentMethods();
|
||||
const {
|
||||
activePaymentMethod,
|
||||
...paymentMethodInterface
|
||||
} = usePaymentMethodInterface();
|
||||
const { activePaymentMethod, ...paymentMethodInterface } =
|
||||
usePaymentMethodInterface();
|
||||
const { noticeContexts } = useEmitResponse();
|
||||
const { removeNotice } = useDispatch( 'core/notices' );
|
||||
const { dispatchCheckoutEvent } = useStoreEvents();
|
||||
|
|
|
|||
|
|
@ -32,7 +32,9 @@ jest.mock( '../saved-payment-method-options', () => ( { onChange } ) => {
|
|||
|
||||
jest.mock(
|
||||
'@woocommerce/base-components/radio-control-accordion',
|
||||
() => ( { onChange } ) => (
|
||||
() =>
|
||||
( { onChange } ) =>
|
||||
(
|
||||
<>
|
||||
<span>Payment method options</span>
|
||||
<button onClick={ () => onChange( 'credit-card' ) }>
|
||||
|
|
@ -103,10 +105,8 @@ describe( 'PaymentMethods', () => {
|
|||
|
||||
test( 'selecting new payment method', async () => {
|
||||
const ShowActivePaymentMethod = () => {
|
||||
const {
|
||||
activePaymentMethod,
|
||||
activeSavedToken,
|
||||
} = usePaymentMethodDataContext();
|
||||
const { activePaymentMethod, activeSavedToken } =
|
||||
usePaymentMethodDataContext();
|
||||
return (
|
||||
<>
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -42,16 +42,14 @@ export const useForcedLayout = ( {
|
|||
const currentRegisteredBlocks = useRef( registeredBlocks );
|
||||
const currentDefaultTemplate = useRef( defaultTemplate );
|
||||
|
||||
const { insertBlock, replaceInnerBlocks } = useDispatch(
|
||||
'core/block-editor'
|
||||
);
|
||||
const { insertBlock, replaceInnerBlocks } =
|
||||
useDispatch( 'core/block-editor' );
|
||||
|
||||
const { innerBlocks, registeredBlockTypes } = useSelect(
|
||||
( select ) => {
|
||||
return {
|
||||
innerBlocks: select( 'core/block-editor' ).getBlocks(
|
||||
clientId
|
||||
),
|
||||
innerBlocks:
|
||||
select( 'core/block-editor' ).getBlocks( clientId ),
|
||||
registeredBlockTypes: currentRegisteredBlocks.current.map(
|
||||
( blockName ) => getBlockType( blockName )
|
||||
),
|
||||
|
|
@ -110,7 +108,8 @@ export const useForcedLayout = ( {
|
|||
}
|
||||
|
||||
// Is the forced block part of the default template, find it's original position.
|
||||
const defaultTemplatePosition = currentDefaultTemplate.current.findIndex(
|
||||
const defaultTemplatePosition =
|
||||
currentDefaultTemplate.current.findIndex(
|
||||
( [ blockName ] ) => blockName === block.name
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -29,11 +29,8 @@ export const useViewSwitcher = (
|
|||
const initialView = views[ 0 ];
|
||||
const [ currentView, setCurrentView ] = useState( initialView );
|
||||
const { selectBlock } = useDispatch( 'core/block-editor' );
|
||||
const {
|
||||
getBlock,
|
||||
getSelectedBlockClientId,
|
||||
getBlockParentsByBlockName,
|
||||
} = select( blockEditorStore );
|
||||
const { getBlock, getSelectedBlockClientId, getBlockParentsByBlockName } =
|
||||
select( blockEditorStore );
|
||||
const selectedBlockClientId = getSelectedBlockClientId();
|
||||
|
||||
useEffect( () => {
|
||||
|
|
|
|||
|
|
@ -114,12 +114,8 @@ const CartLineItemRow = forwardRef< HTMLTableRowElement, CartLineItemRowProps >(
|
|||
extensions,
|
||||
} = lineItem;
|
||||
|
||||
const {
|
||||
quantity,
|
||||
setItemQuantity,
|
||||
removeItem,
|
||||
isPendingDelete,
|
||||
} = useStoreCartItemQuantity( lineItem );
|
||||
const { quantity, setItemQuantity, removeItem, isPendingDelete } =
|
||||
useStoreCartItemQuantity( lineItem );
|
||||
const { dispatchStoreEvent } = useStoreEvents();
|
||||
|
||||
// Prepare props to pass to the __experimentalApplyCheckoutFilter filter.
|
||||
|
|
@ -150,9 +146,8 @@ const CartLineItemRow = forwardRef< HTMLTableRowElement, CartLineItemRowProps >(
|
|||
amount: parseInt( prices.raw_prices.price, 10 ),
|
||||
precision: prices.raw_prices.precision,
|
||||
} );
|
||||
const saleAmountSingle = regularAmountSingle.subtract(
|
||||
purchaseAmountSingle
|
||||
);
|
||||
const saleAmountSingle =
|
||||
regularAmountSingle.subtract( purchaseAmountSingle );
|
||||
const saleAmount = saleAmountSingle.multiply( quantity );
|
||||
const totalsCurrency = getCurrencyFromPriceResponse( totals );
|
||||
let lineSubtotal = parseInt( totals.line_subtotal, 10 );
|
||||
|
|
|
|||
|
|
@ -56,7 +56,8 @@ export const Edit = ( {
|
|||
const hasExpressPaymentMethods = Object.keys( paymentMethods ).length > 0;
|
||||
const blockProps = useBlockProps( {
|
||||
className: classnames( {
|
||||
'wp-block-woocommerce-cart-express-payment-block--has-express-payment-methods': hasExpressPaymentMethods,
|
||||
'wp-block-woocommerce-cart-express-payment-block--has-express-payment-methods':
|
||||
hasExpressPaymentMethods,
|
||||
} ),
|
||||
} );
|
||||
const { className } = attributes;
|
||||
|
|
|
|||
|
|
@ -52,7 +52,8 @@ export const Edit = ( {
|
|||
checked={ isShippingCalculatorEnabled }
|
||||
onChange={ () =>
|
||||
setAttributes( {
|
||||
isShippingCalculatorEnabled: ! isShippingCalculatorEnabled,
|
||||
isShippingCalculatorEnabled:
|
||||
! isShippingCalculatorEnabled,
|
||||
} )
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -56,7 +56,8 @@ export const Edit = ( {
|
|||
checked={ showRateAfterTaxName }
|
||||
onChange={ () =>
|
||||
setAttributes( {
|
||||
showRateAfterTaxName: ! showRateAfterTaxName,
|
||||
showRateAfterTaxName:
|
||||
! showRateAfterTaxName,
|
||||
} )
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ const browseStoreTemplate = SHOP_URL
|
|||
]
|
||||
: null;
|
||||
|
||||
const defaultTemplate = ( [
|
||||
const defaultTemplate = [
|
||||
[
|
||||
'core/image',
|
||||
{
|
||||
|
|
@ -79,7 +79,7 @@ const defaultTemplate = ( [
|
|||
rows: 1,
|
||||
},
|
||||
],
|
||||
].filter( Boolean ) as unknown ) as TemplateArray;
|
||||
].filter( Boolean ) as unknown as TemplateArray;
|
||||
|
||||
export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => {
|
||||
const blockProps = useBlockProps();
|
||||
|
|
|
|||
|
|
@ -27,10 +27,8 @@ const Block = ( {
|
|||
} ): JSX.Element => {
|
||||
const link = getSetting( 'page-' + checkoutPageId, false );
|
||||
const { isCalculating } = useCheckoutContext();
|
||||
const [
|
||||
positionReferenceElement,
|
||||
positionRelativeToViewport,
|
||||
] = usePositionRelativeToViewport();
|
||||
const [ positionReferenceElement, positionRelativeToViewport ] =
|
||||
usePositionRelativeToViewport();
|
||||
const [ showSpinner, setShowSpinner ] = useState( false );
|
||||
|
||||
useEffect( () => {
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@ __webpack_public_path__ = WC_BLOCKS_BUILD_URL;
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.FILLED_CART,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/filled-cart" */
|
||||
'./filled-cart-block/frontend'
|
||||
|
|
@ -26,7 +27,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.EMPTY_CART,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/empty-cart" */
|
||||
'./empty-cart-block/frontend'
|
||||
|
|
@ -36,7 +38,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ITEMS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-items" */
|
||||
'./cart-items-block/frontend'
|
||||
|
|
@ -46,7 +49,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_LINE_ITEMS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-line-items" */
|
||||
'./cart-line-items-block/frontend'
|
||||
|
|
@ -56,7 +60,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_TOTALS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-totals" */
|
||||
'./cart-totals-block/frontend'
|
||||
|
|
@ -66,7 +71,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_EXPRESS_PAYMENT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-express-payment" */
|
||||
'./cart-express-payment-block/frontend'
|
||||
|
|
@ -76,7 +82,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.PROCEED_TO_CHECKOUT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/proceed-to-checkout" */
|
||||
'./proceed-to-checkout-block/frontend'
|
||||
|
|
@ -86,7 +93,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ACCEPTED_PAYMENT_METHODS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-accepted-payment-methods" */
|
||||
'./cart-accepted-payment-methods-block/frontend'
|
||||
|
|
@ -96,7 +104,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/cart-order-summary" */
|
||||
'./cart-order-summary-block/frontend'
|
||||
|
|
@ -106,7 +115,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_HEADING,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-heading" */
|
||||
'./cart-order-summary-heading/frontend'
|
||||
|
|
@ -116,7 +126,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_SUBTOTAL,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-subtotal" */
|
||||
'./cart-order-summary-subtotal/frontend'
|
||||
|
|
@ -126,7 +137,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_FEE,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-fee" */
|
||||
'./cart-order-summary-fee/frontend'
|
||||
|
|
@ -136,7 +148,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_DISCOUNT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-discount" */
|
||||
'./cart-order-summary-discount/frontend'
|
||||
|
|
@ -146,7 +159,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_COUPON_FORM,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-coupon-form" */
|
||||
'./cart-order-summary-coupon-form/frontend'
|
||||
|
|
@ -156,7 +170,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_SHIPPING,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-shipping" */
|
||||
'./cart-order-summary-shipping/frontend'
|
||||
|
|
@ -166,7 +181,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_TAXES,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-taxes" */
|
||||
'./cart-order-summary-taxes/frontend'
|
||||
|
|
@ -176,7 +192,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CART_ORDER_SUMMARY_HEADING,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "cart-blocks/order-summary-heading" */
|
||||
'./cart-order-summary-heading/frontend'
|
||||
|
|
|
|||
|
|
@ -104,14 +104,10 @@ const ScrollOnError = ( {
|
|||
}: {
|
||||
scrollToTop: ( props: Record< string, unknown > ) => void;
|
||||
} ): null => {
|
||||
const {
|
||||
hasError: checkoutHasError,
|
||||
isIdle: checkoutIsIdle,
|
||||
} = useCheckoutContext();
|
||||
const {
|
||||
hasValidationErrors,
|
||||
showAllValidationErrors,
|
||||
} = useValidationContext();
|
||||
const { hasError: checkoutHasError, isIdle: checkoutIsIdle } =
|
||||
useCheckoutContext();
|
||||
const { hasValidationErrors, showAllValidationErrors } =
|
||||
useValidationContext();
|
||||
|
||||
const hasErrorsToDisplay =
|
||||
checkoutIsIdle &&
|
||||
|
|
|
|||
|
|
@ -41,17 +41,17 @@ export const CheckoutBlockContext = createContext< CheckoutBlockContextProps >(
|
|||
}
|
||||
);
|
||||
|
||||
export const CheckoutBlockControlsContext = createContext<
|
||||
CheckoutBlockControlsContextProps
|
||||
>( {
|
||||
export const CheckoutBlockControlsContext =
|
||||
createContext< CheckoutBlockControlsContextProps >( {
|
||||
addressFieldControls: () => null,
|
||||
accountControls: () => null,
|
||||
} );
|
||||
} );
|
||||
|
||||
export const useCheckoutBlockContext = (): CheckoutBlockContextProps => {
|
||||
return useContext( CheckoutBlockContext );
|
||||
};
|
||||
|
||||
export const useCheckoutBlockControlsContext = (): CheckoutBlockControlsContextProps => {
|
||||
export const useCheckoutBlockControlsContext =
|
||||
(): CheckoutBlockControlsContextProps => {
|
||||
return useContext( CheckoutBlockControlsContext );
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -34,7 +34,8 @@ export const FormStepBlock = ( {
|
|||
const { title = '', description = '', showStepNumber = true } = attributes;
|
||||
const blockProps = useBlockProps( {
|
||||
className: classnames( 'wc-block-components-checkout-step', className, {
|
||||
'wc-block-components-checkout-step--with-step-number': showStepNumber,
|
||||
'wc-block-components-checkout-step--with-step-number':
|
||||
showStepNumber,
|
||||
} ),
|
||||
} );
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -39,9 +39,8 @@ export const Edit = ( {
|
|||
showPhoneField,
|
||||
requirePhoneField,
|
||||
} = useCheckoutBlockContext();
|
||||
const {
|
||||
addressFieldControls: Controls,
|
||||
} = useCheckoutBlockControlsContext();
|
||||
const { addressFieldControls: Controls } =
|
||||
useCheckoutBlockControlsContext();
|
||||
const { showBillingFields } = useCheckoutAddress();
|
||||
|
||||
if ( ! showBillingFields ) {
|
||||
|
|
|
|||
|
|
@ -20,11 +20,8 @@ const Block = ( {
|
|||
}: {
|
||||
allowCreateAccount: boolean;
|
||||
} ): JSX.Element => {
|
||||
const {
|
||||
customerId,
|
||||
shouldCreateAccount,
|
||||
setShouldCreateAccount,
|
||||
} = useCheckoutContext();
|
||||
const { customerId, shouldCreateAccount, setShouldCreateAccount } =
|
||||
useCheckoutContext();
|
||||
const { billingAddress, setEmail } = useCheckoutAddress();
|
||||
const { dispatchCheckoutEvent } = useStoreEvents();
|
||||
|
||||
|
|
|
|||
|
|
@ -63,7 +63,8 @@ export const Edit = ( {
|
|||
const blockProps = useBlockProps( {
|
||||
className: classnames(
|
||||
{
|
||||
'wp-block-woocommerce-checkout-express-payment-block--has-express-payment-methods': hasExpressPaymentMethods,
|
||||
'wp-block-woocommerce-checkout-express-payment-block--has-express-payment-methods':
|
||||
hasExpressPaymentMethods,
|
||||
},
|
||||
attributes?.className
|
||||
),
|
||||
|
|
|
|||
|
|
@ -34,11 +34,10 @@ export const Edit = ( {
|
|||
} );
|
||||
const allowedBlocks = getAllowedBlocks( innerBlockAreas.CHECKOUT_FIELDS );
|
||||
|
||||
const {
|
||||
addressFieldControls: Controls,
|
||||
} = useCheckoutBlockControlsContext();
|
||||
const { addressFieldControls: Controls } =
|
||||
useCheckoutBlockControlsContext();
|
||||
|
||||
const defaultTemplate = ( [
|
||||
const defaultTemplate = [
|
||||
[ 'woocommerce/checkout-express-payment-block', {}, [] ],
|
||||
[ 'woocommerce/checkout-contact-information-block', {}, [] ],
|
||||
[ 'woocommerce/checkout-shipping-address-block', {}, [] ],
|
||||
|
|
@ -48,7 +47,7 @@ export const Edit = ( {
|
|||
[ 'woocommerce/checkout-order-note-block', {}, [] ],
|
||||
[ 'woocommerce/checkout-terms-block', {}, [] ],
|
||||
[ 'woocommerce/checkout-actions-block', {}, [] ],
|
||||
].filter( Boolean ) as unknown ) as TemplateArray;
|
||||
].filter( Boolean ) as unknown as TemplateArray;
|
||||
|
||||
useForcedLayout( {
|
||||
clientId,
|
||||
|
|
|
|||
|
|
@ -103,8 +103,7 @@ jest.mock( '@woocommerce/base-context/hooks', () => ( {
|
|||
meta_data: [
|
||||
{
|
||||
key: 'Items',
|
||||
value:
|
||||
'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
value: 'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
},
|
||||
],
|
||||
selected: false,
|
||||
|
|
@ -128,8 +127,7 @@ jest.mock( '@woocommerce/base-context/hooks', () => ( {
|
|||
meta_data: [
|
||||
{
|
||||
key: 'Items',
|
||||
value:
|
||||
'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
value: 'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
},
|
||||
],
|
||||
selected: false,
|
||||
|
|
@ -153,8 +151,7 @@ jest.mock( '@woocommerce/base-context/hooks', () => ( {
|
|||
meta_data: [
|
||||
{
|
||||
key: 'Items',
|
||||
value:
|
||||
'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
value: 'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
},
|
||||
],
|
||||
selected: true,
|
||||
|
|
@ -476,8 +473,7 @@ describe( 'Checkout Order Summary', () => {
|
|||
meta_data: [
|
||||
{
|
||||
key: 'Items',
|
||||
value:
|
||||
'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
value: 'Hoodie - Blue, Yes × 1, Beanie × 1',
|
||||
},
|
||||
],
|
||||
selected: true,
|
||||
|
|
|
|||
|
|
@ -13,9 +13,8 @@ const Block = ( {
|
|||
} ): JSX.Element | null => {
|
||||
const couponsEnabled = getSetting( 'couponsEnabled', true );
|
||||
|
||||
const { applyCoupon, isApplyingCoupon } = useStoreCartCoupons(
|
||||
'wc/checkout'
|
||||
);
|
||||
const { applyCoupon, isApplyingCoupon } =
|
||||
useStoreCartCoupons( 'wc/checkout' );
|
||||
|
||||
if ( ! couponsEnabled ) {
|
||||
return null;
|
||||
|
|
|
|||
|
|
@ -27,9 +27,8 @@ const DiscountSlotFill = (): JSX.Element => {
|
|||
|
||||
const Block = ( { className = '' }: { className?: string } ): JSX.Element => {
|
||||
const { cartTotals, cartCoupons } = useStoreCart();
|
||||
const { removeCoupon, isRemovingCoupon } = useStoreCartCoupons(
|
||||
'wc/checkout'
|
||||
);
|
||||
const { removeCoupon, isRemovingCoupon } =
|
||||
useStoreCartCoupons( 'wc/checkout' );
|
||||
const totalsCurrency = getCurrencyFromPriceResponse( cartTotals );
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -56,7 +56,8 @@ export const Edit = ( {
|
|||
checked={ showRateAfterTaxName }
|
||||
onChange={ () =>
|
||||
setAttributes( {
|
||||
showRateAfterTaxName: ! showRateAfterTaxName,
|
||||
showRateAfterTaxName:
|
||||
! showRateAfterTaxName,
|
||||
} )
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -38,9 +38,8 @@ export const Edit = ( {
|
|||
showPhoneField,
|
||||
requirePhoneField,
|
||||
} = useCheckoutBlockContext();
|
||||
const {
|
||||
addressFieldControls: Controls,
|
||||
} = useCheckoutBlockControlsContext();
|
||||
const { addressFieldControls: Controls } =
|
||||
useCheckoutBlockControlsContext();
|
||||
return (
|
||||
<FormStepBlock
|
||||
setAttributes={ setAttributes }
|
||||
|
|
|
|||
|
|
@ -60,9 +60,8 @@ const Block = (): JSX.Element | null => {
|
|||
return null;
|
||||
}
|
||||
|
||||
const shippingRatesPackageCount = getShippingRatesPackageCount(
|
||||
shippingRates
|
||||
);
|
||||
const shippingRatesPackageCount =
|
||||
getShippingRatesPackageCount( shippingRates );
|
||||
|
||||
if (
|
||||
! isEditor &&
|
||||
|
|
|
|||
|
|
@ -32,11 +32,8 @@ const FrontendBlock = ( {
|
|||
const { isDisabled } = useCheckoutSubmit();
|
||||
|
||||
const validationErrorId = 'terms-and-conditions-' + instanceId;
|
||||
const {
|
||||
getValidationError,
|
||||
setValidationErrors,
|
||||
clearValidationError,
|
||||
} = validation;
|
||||
const { getValidationError, setValidationErrors, clearValidationError } =
|
||||
validation;
|
||||
|
||||
const error = getValidationError( validationErrorId ) || {};
|
||||
const hasError = error.message && ! error.hidden;
|
||||
|
|
|
|||
|
|
@ -91,8 +91,7 @@ describe( 'Edit', () => {
|
|||
const { container } = render(
|
||||
<Edit
|
||||
attributes={ {
|
||||
text:
|
||||
'I agree to the <a href="/terms">terms</a> and <a href="/privacy">privacy</a>',
|
||||
text: 'I agree to the <a href="/terms">terms</a> and <a href="/privacy">privacy</a>',
|
||||
checkbox: true,
|
||||
} }
|
||||
setAttributes={ () => void 0 }
|
||||
|
|
|
|||
|
|
@ -17,7 +17,8 @@ __webpack_public_path__ = WC_BLOCKS_BUILD_URL;
|
|||
// @todo When forcing all blocks at once, they will append based on the order they are registered. Introduce formal sorting param.
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_FIELDS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/fields" */ './checkout-fields-block/frontend'
|
||||
)
|
||||
|
|
@ -26,7 +27,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_EXPRESS_PAYMENT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/express-payment" */ './checkout-express-payment-block/block'
|
||||
)
|
||||
|
|
@ -35,7 +37,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_CONTACT_INFORMATION,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/contact-information" */ './checkout-contact-information-block/frontend'
|
||||
)
|
||||
|
|
@ -44,7 +47,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_SHIPPING_ADDRESS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/shipping-address" */ './checkout-shipping-address-block/frontend'
|
||||
)
|
||||
|
|
@ -53,7 +57,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_BILLING_ADDRESS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/billing-address" */ './checkout-billing-address-block/frontend'
|
||||
)
|
||||
|
|
@ -62,7 +67,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_SHIPPING_METHODS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/shipping-methods" */ './checkout-shipping-methods-block/frontend'
|
||||
)
|
||||
|
|
@ -71,7 +77,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_PAYMENT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/payment" */ './checkout-payment-block/frontend'
|
||||
)
|
||||
|
|
@ -80,7 +87,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_NOTE,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-note" */ './checkout-order-note-block/block'
|
||||
)
|
||||
|
|
@ -89,7 +97,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_TERMS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/terms" */ './checkout-terms-block/frontend'
|
||||
)
|
||||
|
|
@ -98,7 +107,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ACTIONS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/actions" */ './checkout-actions-block/frontend'
|
||||
)
|
||||
|
|
@ -107,7 +117,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_TOTALS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/totals" */ './checkout-totals-block/frontend'
|
||||
)
|
||||
|
|
@ -116,7 +127,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary" */ './checkout-order-summary-block/frontend'
|
||||
)
|
||||
|
|
@ -125,7 +137,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_CART_ITEMS,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-cart-items" */
|
||||
'./checkout-order-summary-cart-items/frontend'
|
||||
|
|
@ -135,7 +148,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_SUBTOTAL,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-subtotal" */
|
||||
'./checkout-order-summary-subtotal/frontend'
|
||||
|
|
@ -145,7 +159,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_FEE,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-fee" */
|
||||
'./checkout-order-summary-fee/frontend'
|
||||
|
|
@ -155,7 +170,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_DISCOUNT,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-discount" */
|
||||
'./checkout-order-summary-discount/frontend'
|
||||
|
|
@ -165,7 +181,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_COUPON_FORM,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-coupon-form" */
|
||||
'./checkout-order-summary-coupon-form/frontend'
|
||||
|
|
@ -175,7 +192,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_SHIPPING,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-shipping" */
|
||||
'./checkout-order-summary-shipping/frontend'
|
||||
|
|
@ -185,7 +203,8 @@ registerCheckoutBlock( {
|
|||
|
||||
registerCheckoutBlock( {
|
||||
metadata: metadata.CHECKOUT_ORDER_SUMMARY_TAXES,
|
||||
component: lazy( () =>
|
||||
component: lazy(
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "checkout-blocks/order-summary-taxes" */
|
||||
'./checkout-order-summary-taxes/frontend'
|
||||
|
|
|
|||
|
|
@ -136,12 +136,10 @@ export const BlockControls = ( {
|
|||
);
|
||||
};
|
||||
|
||||
export const withBlockControls = ( {
|
||||
cropLabel,
|
||||
editLabel,
|
||||
}: BlockControlsConfiguration ) => < T extends EditorBlock< T > >(
|
||||
Component: ComponentType< T >
|
||||
) => ( props: WithBlockControlsProps< T > ) => {
|
||||
export const withBlockControls =
|
||||
( { cropLabel, editLabel }: BlockControlsConfiguration ) =>
|
||||
< T extends EditorBlock< T > >( Component: ComponentType< T > ) =>
|
||||
( props: WithBlockControlsProps< T > ) => {
|
||||
const [ isEditingImage, setIsEditingImage ] = props.useEditingImage;
|
||||
const { attributes, category, name, product, setAttributes } = props;
|
||||
const { contentAlign, editMode, mediaId, mediaSrc } = attributes;
|
||||
|
|
@ -171,4 +169,4 @@ export const withBlockControls = ( {
|
|||
<Component { ...props } />
|
||||
</>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -92,15 +92,17 @@ export const ImageEditor = ( {
|
|||
);
|
||||
};
|
||||
|
||||
export const withImageEditor = < T extends EditorBlock< T > >(
|
||||
Component: ComponentType< T >
|
||||
) => ( props: WithImageEditorProps< T > ) => {
|
||||
export const withImageEditor =
|
||||
< T extends EditorBlock< T > >( Component: ComponentType< T > ) =>
|
||||
( props: WithImageEditorProps< T > ) => {
|
||||
const [ isEditingImage, setIsEditingImage ] = props.useEditingImage;
|
||||
|
||||
const { attributes, backgroundImageSize, name, setAttributes } = props;
|
||||
const { mediaId, mediaSrc } = attributes;
|
||||
const item =
|
||||
name === BLOCK_NAMES.featuredProduct ? props.product : props.category;
|
||||
name === BLOCK_NAMES.featuredProduct
|
||||
? props.product
|
||||
: props.category;
|
||||
|
||||
const { backgroundImageId, backgroundImageSrc } = useBackgroundImage( {
|
||||
item,
|
||||
|
|
@ -123,4 +125,4 @@ export const withImageEditor = < T extends EditorBlock< T > >(
|
|||
}
|
||||
|
||||
return <Component { ...props } />;
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -287,9 +287,9 @@ export const InspectorControls = ( {
|
|||
);
|
||||
};
|
||||
|
||||
export const withInspectorControls = < T extends EditorBlock< T > >(
|
||||
Component: ComponentType< T >
|
||||
) => ( props: WithInspectorControlsProps< T > ) => {
|
||||
export const withInspectorControls =
|
||||
< T extends EditorBlock< T > >( Component: ComponentType< T > ) =>
|
||||
( props: WithInspectorControlsProps< T > ) => {
|
||||
const { attributes, name, setAttributes } = props;
|
||||
const {
|
||||
alt,
|
||||
|
|
@ -307,7 +307,9 @@ export const withInspectorControls = < T extends EditorBlock< T > >(
|
|||
} = attributes;
|
||||
|
||||
const item =
|
||||
name === BLOCK_NAMES.featuredProduct ? props.product : props.category;
|
||||
name === BLOCK_NAMES.featuredProduct
|
||||
? props.product
|
||||
: props.category;
|
||||
|
||||
const { setGradient } = useGradient( {
|
||||
gradientAttribute: 'overlayGradient',
|
||||
|
|
@ -353,4 +355,4 @@ export const withInspectorControls = < T extends EditorBlock< T > >(
|
|||
<Component { ...props } />
|
||||
</>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -61,9 +61,8 @@ export function getBackgroundImageStyles( {
|
|||
...( url && {
|
||||
backgroundImage: `url(${ url })`,
|
||||
} ),
|
||||
backgroundPosition: calculatePercentPositionFromCoordinates(
|
||||
focalPoint
|
||||
),
|
||||
backgroundPosition:
|
||||
calculatePercentPositionFromCoordinates( focalPoint ),
|
||||
...( ! isRepeated && {
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundSize: imageFit === 'cover' ? imageFit : 'auto',
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue