diff --git a/assets/js/base/components/drawer/index.tsx b/assets/js/base/components/drawer/index.tsx index ff4c3cb0586..d0f5f034e39 100644 --- a/assets/js/base/components/drawer/index.tsx +++ b/assets/js/base/components/drawer/index.tsx @@ -54,10 +54,7 @@ const Drawer = ( { slideOut, } ) } - closeButtonLabel={ __( - 'Close mini cart', - 'woo-gutenberg-products-block' - ) } + closeButtonLabel={ __( 'Close', 'woo-gutenberg-products-block' ) } > { children } diff --git a/assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/filled-mini-cart-contents-block/frontend.tsx b/assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/filled-mini-cart-contents-block/frontend.tsx index 1b89e66a37b..2b9b52dc92f 100644 --- a/assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/filled-mini-cart-contents-block/frontend.tsx +++ b/assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/filled-mini-cart-contents-block/frontend.tsx @@ -1,8 +1,13 @@ /** * External dependencies */ +import { StoreNoticesContainer } from '@woocommerce/blocks-checkout'; import { useStoreCart } from '@woocommerce/base-context/hooks'; +import { useDispatch } from '@wordpress/data'; +import { useEffect } from '@wordpress/element'; +import { decodeEntities } from '@wordpress/html-entities'; + type FilledMiniCartContentsBlockProps = { children: JSX.Element; className: string; @@ -12,13 +17,31 @@ const FilledMiniCartContentsBlock = ( { children, className, }: FilledMiniCartContentsBlockProps ): JSX.Element | null => { - const { cartItems } = useStoreCart(); + const { cartItems, cartItemErrors } = useStoreCart(); + + const { createErrorNotice } = useDispatch( 'core/notices' ); + + // Ensures any cart errors listed in the API response get shown. + useEffect( () => { + cartItemErrors.forEach( ( error ) => { + createErrorNotice( decodeEntities( error.message ), { + isDismissible: false, + id: error.code, + context: 'wc/cart', + } ); + } ); + }, [ createErrorNotice, cartItemErrors ] ); if ( cartItems.length === 0 ) { return null; } - return