Open Tiago-Silva opened 4 months ago
Para que os filtros fossem persistido eu utilizei o localStorage. Veja:
useEffect(() => { const storedSearchParams = localStorage.getItem('searchParams'); if (storedSearchParams) { setSearchParams(new URLSearchParams(storedSearchParams)); } }, []);
Nesse trecho toda vez que a página é carregada eu verifico se já existe algo salvo no localStorage com determinada chave, se houver então eu seto o setSearchParams com o valor guardado.
const onSubmitFilterForm = useCallback( (values: IFilterFormProps) => { setOpenModal(false); setFilterData(values); const searchQuery = qs.stringify(values, { skipNulls: true, }); setSearchParams(searchQuery); localStorage.setItem('searchParams', JSON.stringify(searchQuery)); refresh({ params: { search: searchQuery, }, }); }, [refresh, setSearchParams] );
Quando o filtro é aplicado essa função é chamada, nela eu guardo os parametros no localStorage dessa maneira:
localStorage.setItem('searchParams', JSON.stringify(searchQuery));
E por último quando o botão 'Limpar filtros' é executado eu limpo o valor salvo no localStorage:
const clearSearch = useCallback(() => { setSearch(''); setFilterData(initialFilterData); setSearchParams(''); refresh(); localStorage.removeItem('searchParams'); //aqui eu limpo, esse comentário não está no commit }, [refresh, setSearch, setSearchParams]); const hasMore = useMemo( () => shelters.page * shelters.perPage < shelters.count, [shelters.page, shelters.perPage, shelters.count] );
Para que os filtros fossem persistido eu utilizei o localStorage. Veja:
Nesse trecho toda vez que a página é carregada eu verifico se já existe algo salvo no localStorage com determinada chave, se houver então eu seto o setSearchParams com o valor guardado.
Quando o filtro é aplicado essa função é chamada, nela eu guardo os parametros no localStorage dessa maneira:
E por último quando o botão 'Limpar filtros' é executado eu limpo o valor salvo no localStorage: