diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/order-summary-item.js b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/order-summary-item.js
index d245a08e07c..2114c3d056d 100644
--- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/order-summary-item.js
+++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/order-summary-item.js
@@ -13,7 +13,7 @@ import {
import PropTypes from 'prop-types';
import Dinero from 'dinero.js';
import { getSetting } from '@woocommerce/settings';
-import { useCallback, useMemo } from '@wordpress/element';
+import { useMemo } from '@wordpress/element';
import { useStoreCart } from '@woocommerce/base-context/hooks';
/**
@@ -24,21 +24,23 @@ import ProductImage from '../product-image';
import ProductLowStockBadge from '../product-low-stock-badge';
import ProductMetadata from '../product-metadata';
+const productPriceValidation = ( value ) => mustContain( value, '' );
+
const OrderSummaryItem = ( { cartItem } ) => {
const {
images,
- low_stock_remaining: lowStockRemaining = null,
- show_backorder_badge: showBackorderBadge = false,
+ low_stock_remaining: lowStockRemaining,
+ show_backorder_badge: showBackorderBadge,
name: initialName,
permalink,
prices,
quantity,
short_description: shortDescription,
description: fullDescription,
- item_data: itemData = [],
+ item_data: itemData,
variation,
totals,
- extensions = {},
+ extensions,
} = cartItem;
// Prepare props to pass to the __experimentalApplyCheckoutFilter filter.
@@ -46,11 +48,6 @@ const OrderSummaryItem = ( { cartItem } ) => {
// eslint-disable-next-line no-unused-vars
const { receiveCart, ...cart } = useStoreCart();
- const productPriceValidation = useCallback(
- ( value ) => mustContain( value, '' ),
- []
- );
-
const arg = useMemo(
() => ( {
context: 'summary',
diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/test/index.js b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/test/index.js
index 6c0cba4379a..352eb722b9d 100644
--- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/test/index.js
+++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/order-summary/test/index.js
@@ -12,7 +12,7 @@ import OrderSummary from '../index';
jest.mock( '@woocommerce/base-context', () => ( {
...jest.requireActual( '@woocommerce/base-context' ),
useContainerWidthContext: () => ( {
- isLarge: false,
+ isLarge: true,
hasContainerWidth: true,
} ),
} ) );
diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/discount/index.js b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/discount/index.js
index e4a3b8a45ff..969c95352ba 100644
--- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/discount/index.js
+++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/discount/index.js
@@ -16,6 +16,10 @@ import { getSetting } from '@woocommerce/settings';
*/
import './style.scss';
+const filteredCartCouponsFilterArg = {
+ context: 'summary',
+};
+
const TotalsDiscount = ( {
cartCoupons = [],
currency,
@@ -42,9 +46,7 @@ const TotalsDiscount = ( {
: discountValue;
const filteredCartCoupons = __experimentalApplyCheckoutFilter( {
- arg: {
- context: 'summary',
- },
+ arg: filteredCartCouponsFilterArg,
filterName: 'coupons',
defaultValue: cartCoupons,
} );
diff --git a/plugins/woocommerce-blocks/assets/js/base/components/product-name/index.tsx b/plugins/woocommerce-blocks/assets/js/base/components/product-name/index.tsx
index 7f982585644..bed6ad8ce67 100644
--- a/plugins/woocommerce-blocks/assets/js/base/components/product-name/index.tsx
+++ b/plugins/woocommerce-blocks/assets/js/base/components/product-name/index.tsx
@@ -21,10 +21,10 @@ export default ( {
permalink = '',
...props
}: {
- className: string;
- disabled: boolean;
+ className?: string;
+ disabled?: boolean;
name: string;
- permalink: string;
+ permalink?: string;
} ): JSX.Element => {
const classes = classnames( 'wc-block-components-product-name', className );
return disabled ? (
diff --git a/plugins/woocommerce-blocks/assets/js/base/context/providers/store-snackbar-notices/components/snackbar-notices-container.js b/plugins/woocommerce-blocks/assets/js/base/context/providers/store-snackbar-notices/components/snackbar-notices-container.js
index 2444eb02445..b78ac2e39d5 100644
--- a/plugins/woocommerce-blocks/assets/js/base/context/providers/store-snackbar-notices/components/snackbar-notices-container.js
+++ b/plugins/woocommerce-blocks/assets/js/base/context/providers/store-snackbar-notices/components/snackbar-notices-container.js
@@ -5,6 +5,8 @@ import { SnackbarList } from 'wordpress-components';
import classnames from 'classnames';
import { __experimentalApplyCheckoutFilter } from '@woocommerce/blocks-checkout';
+const EMPTY_SNACKBAR_NOTICES = {};
+
const SnackbarNoticesContainer = ( {
className,
notices,
@@ -19,10 +21,13 @@ const SnackbarNoticesContainer = ( {
( notice ) => notice.type === 'snackbar'
);
- const noticeVisibility = snackbarNotices.reduce( ( acc, { content } ) => {
- acc[ content ] = true;
- return acc;
- }, {} );
+ const noticeVisibility =
+ snackbarNotices.length > 0
+ ? snackbarNotices.reduce( ( acc, { content } ) => {
+ acc[ content ] = true;
+ return acc;
+ }, {} )
+ : EMPTY_SNACKBAR_NOTICES;
const filteredNotices = __experimentalApplyCheckoutFilter( {
filterName: 'snackbarNoticeVisibility',
diff --git a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/cart-line-item-row.tsx b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/cart-line-item-row.tsx
index 4340a95df08..2cf2248dda2 100644
--- a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/cart-line-item-row.tsx
+++ b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/full-cart/cart-line-item-row.tsx
@@ -27,7 +27,7 @@ import {
mustContain,
} from '@woocommerce/blocks-checkout';
import Dinero from 'dinero.js';
-import { useCallback, useMemo } from '@wordpress/element';
+import { useMemo } from '@wordpress/element';
import type { CartItem } from '@woocommerce/type-defs/cart';
import { objectHasProp } from '@woocommerce/types';
import { getSetting } from '@woocommerce/settings';
@@ -46,6 +46,8 @@ const getAmountFromRawPrice = (
return priceObject.convertPrecision( currency.minorUnit ).getAmount();
};
+const productPriceValidation = ( value ) => mustContain( value, '' );
+
/**
* Cart line item table row component.
*
@@ -99,7 +101,7 @@ const CartLineItemRow = ( {
line_subtotal: '0',
line_subtotal_tax: '0',
},
- extensions = {},
+ extensions,
} = lineItem;
const {
@@ -110,11 +112,6 @@ const CartLineItemRow = ( {
} = useStoreCartItemQuantity( lineItem );
const { dispatchStoreEvent } = useStoreEvents();
- const productPriceValidation = useCallback(
- ( value ) => mustContain( value, '' ),
- []
- );
-
// Prepare props to pass to the __experimentalApplyCheckoutFilter filter.
// We need to pluck out receiveCart.
// eslint-disable-next-line no-unused-vars
@@ -308,4 +305,5 @@ const CartLineItemRow = ( {
);
};
+
export default CartLineItemRow;
diff --git a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/test/__snapshots__/block.js.snap b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/test/__snapshots__/block.js.snap
index 7285f5f26a6..452f531e9de 100644
--- a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/test/__snapshots__/block.js.snap
+++ b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/cart/test/__snapshots__/block.js.snap
@@ -427,57 +427,6 @@ exports[`Testing cart Contains a Taxes section if Core options are set to show i
-
-
-
-
-
- { children }
-
+ { isOpen && (
+
+ { children }
+
+ ) }
);
};
diff --git a/plugins/woocommerce-blocks/packages/checkout/registry/index.ts b/plugins/woocommerce-blocks/packages/checkout/registry/index.ts
index 64da6711762..d60b5150160 100644
--- a/plugins/woocommerce-blocks/packages/checkout/registry/index.ts
+++ b/plugins/woocommerce-blocks/packages/checkout/registry/index.ts
@@ -90,7 +90,7 @@ const getCheckoutFilters = ( filterName: string ): CheckoutFilterFunction[] => {
export const __experimentalApplyCheckoutFilter = < T >( {
filterName,
defaultValue,
- extensions = {},
+ extensions = null,
arg = null,
validation = returnTrue,
}: {
@@ -99,7 +99,7 @@ export const __experimentalApplyCheckoutFilter = < T >( {
/** Default value to filter. */
defaultValue: T;
/** Values extend to REST API response. */
- extensions?: Record< string, unknown >;
+ extensions?: Record< string, unknown > | null;
/** Object containing arguments for the filter function. */
arg?: CheckoutFilterArguments;
/** Function that needs to return true when the filtered value is passed in order for the filter to be applied. */
@@ -111,7 +111,7 @@ export const __experimentalApplyCheckoutFilter = < T >( {
let value = defaultValue;
filters.forEach( ( filter ) => {
try {
- const newValue = filter( value, extensions, arg );
+ const newValue = filter( value, extensions || {}, arg );
if ( typeof newValue !== typeof value ) {
throw new Error(
sprintf(