Filtros nao persistem ao retornar de um abrigo especifico #291

[Tiago-Silva]

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]
  );