Add a way to clear filters in the modal

This commit is contained in:
Uku Taht 2021-07-23 10:29:46 +03:00
parent d6662f1f69
commit 7dfbd9308c

View File

@ -256,9 +256,9 @@ class FilterModal extends React.Component {
)
}
renderBody() {
const { selectedFilterGroup, query } = this.state;
const showClear = FILTER_GROUPS[selectedFilterGroup].some((filterName) => query.filters[filterName])
return (
<>
@ -278,16 +278,17 @@ class FilterModal extends React.Component {
Save Filter
</button>
{query.filters[selectedFilterGroup] && (
{showClear && (
<button
type="button"
className="ml-2 button px-4 flex bg-red-500 dark:bg-red-500 hover:bg-red-600 dark:hover:bg-red-700 items-center"
onClick={() => {
this.selectFiltersAndCloseModal([{filter: selectedFilterGroup, value: null}])
const updatedFilters = FILTER_GROUPS[selectedFilterGroup].map((filterName) => ({filter: filterName, value: null}))
this.selectFiltersAndCloseModal(updatedFilters)
}}
>
<svg className="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"></path></svg>
Remove
Remove filter{FILTER_GROUPS[selectedFilterGroup].length > 1 ? 's' : ''}
</button>
)}
</div>