Calling setSort and setFilters after one another filckers and doesn't setSort

What you were expecting:

I’ve built a button and added it as part of the actions props on a List component. This button is intended to clear the filters applied to the List as well as return the sort to its default value. The button calls the setSort and setFilters functions that are passed in as props to actions. I expected the filters to be cleared and the sort to return to its default value.

What happened instead:

Instead, what I’m seeing is that the filters are cleared (as expected) however the sort “flicks” to the default sort options and then flicks back to the previously selected sort. If I call setSort alone or setFilters alone, they behave as expected and it seems that this issue only occurs when both are called after one another.

Steps to reproduce:

1. Go to the Posts list in the following sandbox.
2. Click on the “Title” column to sort posts by title.
3. In the search box, type “Mai” to add a filter.
4. Then click the “Clear sort and filters” button in the top right.
5. You’ll see the sort goes back to “Published At” as expected but then flicks back to “Title”.

https://codesandbox.io/s/elastic-raman-kvypc

Environment

• React-admin version: 3.1.0
• Last version that did not exhibit the issue (if applicable): 2.x
• React version: 16.12.0
• Browser: Chrome (v. 78.0.3904.108)

[ZachSelindh]

In 4.0, we’ve found a workaround for this issue that I hope others will find helpful.

After upgrading, I examined the Saved Query feature that has become available in version 4, and the way that loading a saved query uses react-router’s useNavigate hook to change the URL instead of changing list context with setFilters, setSort, etc. The relevant code is found in the FilterButton component.

I’m happy to report that calling navigate() with the list parameters will (so far) reliably change the filters and sort without debounce issues. Not sure if this closes the issue or not since presumably setSort and setFilters should still be able to be called simultaneously, but using useNavigate() essentially solves the implementation for my part.

[oparisblue]

+1 for this issue, I just ran into it as well.

In our case, we have a set of tabs which swap out Datagrids within a list, and we wanted to make one of thoseDatagrids default to sorting on a different column than the others. The tab change effectively calls setFilters to filter by the given status represented by one of the tabs.

The debouncing fix doesn’t seem to work for us — it just results in the sort getting applied, but not the filter.