diff --git a/src/Common/hooks/useFilters.tsx b/src/Common/hooks/useFilters.tsx index 7da5a2c0dac..264a3eba7bd 100644 --- a/src/Common/hooks/useFilters.tsx +++ b/src/Common/hooks/useFilters.tsx @@ -34,7 +34,13 @@ export default function useFilters({ const updateQuery = (filter: FilterState) => { filter = hasPagination ? { page: 1, limit, ...filter } : filter; - setQueryParams(Object.assign({}, qParams, filter), { replace: true }); + const updatedQParams = { ...qParams }; + for (const key of cacheBlacklist) { + delete updatedQParams[key]; + } + setQueryParams(Object.assign({}, updatedQParams, filter), { + replace: true, + }); }; const updatePage = (page: number) => { if (!hasPagination) return; @@ -45,10 +51,14 @@ export default function useFilters({ }; const removeFilter = (param: string) => removeFilters([param]); - useEffect( - () => updateFiltersCache(qParams, cacheBlacklist), - [qParams, cacheBlacklist] - ); + useEffect(() => { + const updatedQParams = { ...qParams }; + + for (const key of cacheBlacklist) { + delete updatedQParams[key]; + } + updateFiltersCache(updatedQParams); + }, [qParams, cacheBlacklist]); useEffect(() => { const cache = getFiltersCache(); @@ -180,7 +190,7 @@ export default function useFilters({ id="clear-all-filters" className="rounded-full border border-gray-300 bg-white px-2 py-1 text-xs text-gray-600 hover:text-gray-800" onClick={() => { - updateFiltersCache({}, cacheBlacklist); + updateFiltersCache({}); removeFilters(Object.keys(qParams)); }} > @@ -276,12 +286,9 @@ const getFiltersCacheKey = () => `filters--${window.location.pathname}`; const getFiltersCache = () => { return JSON.parse(localStorage.getItem(getFiltersCacheKey()) || "{}"); }; -const updateFiltersCache = ( - cache: Record, - cacheBlacklist: string[] -) => { +const updateFiltersCache = (cache: Record) => { const result = { ...cache }; - for (const param of FILTERS_CACHE_BLACKLIST.concat(cacheBlacklist)) { + for (const param of FILTERS_CACHE_BLACKLIST) { delete result[param]; } localStorage.setItem(getFiltersCacheKey(), JSON.stringify(result));