diff --git a/packages/edit-site/src/components/dataviews/filters.js b/packages/edit-site/src/components/dataviews/filters.js
index 655bd83732293..e34ba84040a95 100644
--- a/packages/edit-site/src/components/dataviews/filters.js
+++ b/packages/edit-site/src/components/dataviews/filters.js
@@ -7,6 +7,8 @@ import { __ } from '@wordpress/i18n';
* Internal dependencies
*/
import { default as InFilter, OPERATOR_IN } from './in-filter';
+import ResetFilters from './reset-filters';
+
const VALID_OPERATORS = [ OPERATOR_IN ];
export default function Filters( { fields, view, onChangeView } ) {
@@ -34,27 +36,41 @@ export default function Filters( { fields, view, onChangeView } ) {
} );
} );
- return view.visibleFilters?.map( ( fieldName ) => {
- const visibleFiltersForField = filtersRegistered.filter(
- ( f ) => f.field === fieldName
- );
+ const visibleFilters = view.visibleFilters
+ ?.map( ( fieldName ) => {
+ const visibleFiltersForField = filtersRegistered.filter(
+ ( f ) => f.field === fieldName
+ );
- if ( visibleFiltersForField.length === 0 ) {
- return null;
- }
-
- return visibleFiltersForField.map( ( filter ) => {
- if ( OPERATOR_IN === filter.operator ) {
- return (
-
- );
+ if ( visibleFiltersForField.length === 0 ) {
+ return null;
}
- return null;
- } );
- } );
+
+ return visibleFiltersForField.map( ( filter ) => {
+ if ( OPERATOR_IN === filter.operator ) {
+ return (
+
+ );
+ }
+ return null;
+ } );
+ } )
+ .filter( Boolean );
+
+ if ( visibleFilters?.length > 0 ) {
+ visibleFilters.push(
+
+ );
+ }
+
+ return visibleFilters;
}
diff --git a/packages/edit-site/src/components/dataviews/reset-filters.js b/packages/edit-site/src/components/dataviews/reset-filters.js
new file mode 100644
index 0000000000000..68b5c17590c97
--- /dev/null
+++ b/packages/edit-site/src/components/dataviews/reset-filters.js
@@ -0,0 +1,26 @@
+/**
+ * WordPress dependencies
+ */
+import { BaseControl, Button } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+
+export default ( { view, onChangeView } ) => {
+ return (
+
+
+
+ );
+};