Add snackbar filter (#4313)

Author: opr

assets/js/base/context/providers/store-notices/components/snackbar-notices-container.js

@@ -3,6 +3,7 @@
  */
 import { SnackbarList } from 'wordpress-components';
 import classnames from 'classnames';
+import { __experimentalApplyCheckoutFilter } from '@woocommerce/blocks-checkout';
 
 const SnackbarNoticesContainer = ( {
 	className,
@@ -18,14 +19,19 @@ const SnackbarNoticesContainer = ( {
 		( notice ) => notice.type === 'snackbar'
 	);
 
+	const filteredNotices = __experimentalApplyCheckoutFilter( {
+		filterName: 'snackbarNotices',
+		defaultValue: snackbarNotices,
+	} );
+
 	const wrapperClass = classnames(
 		className,
 		'wc-block-components-notices__snackbar'
 	);
 
 	return (
 		<SnackbarList
-			notices={ snackbarNotices }
+			notices={ filteredNotices }
 			className={ wrapperClass }
 			onRemove={ removeNotice }
 		/>

docs/extensibility/available-filters.md

@@ -116,6 +116,32 @@ interface CartCoupon {
   }
 }
 ```
+### Snackbar notices
+
+There is a snackbar at the bottom of the page used to display notices to the customer, it looks like this:
+
+<img src="https://user-images.githubusercontent.com/5656702/120882329-d573c100-c5ce-11eb-901b-d7f206f74a66.png" width=300 />
+
+It may be desirable to hide this (by removing it from the array) or to change the text in the notice.
+
+| Filter name  | Description | Return type  |
+|---|---|---|
+| `snackbarNotices`  | An array of notices waiting to be shown in the snackbar | `SnackbarNotice[]`
+
+These are the relevant members of a `SnackbarNotice` object.
+
+```typescript
+SnackbarNotice {
+  content: string;
+  explicitDismiss: boolean;
+  icon: string | null;
+  isDismissable: boolean;
+  onDismiss: Function;
+  spokenMessage: string;
+  status: string;
+  type: string
+}
+```
 
 ## Examples
 

packages/checkout/registry/index.ts

@@ -72,7 +72,7 @@ export const __experimentalApplyCheckoutFilter = < T >( {
 	/** Values extend to REST API response. */
 	extensions?: Record< string, unknown >;
 	/** Object containing arguments for the filter function. */
-	arg: CheckoutFilterArguments;
+	arg?: CheckoutFilterArguments;
 	/** Function that needs to return true when the filtered value is passed in order for the filter to be applied. */
 	validation?: ( value: T ) => true | Error;
 } ): T => {