RangeSlider React Hook immediately updating URL State (Routing)

Open Q&A
, ,
#1

Hi,
we have migrated to React Hooks and Dynamic Routing recently and absolutely love it.

However, we have a problem with the RangeSlider: Is there a way to NOT have it redefine the current filters immediately when it is rendered? We think it is super annoying to have these long URLs all the time, aswell as the current refinement lists with the defaults, e.g. Price from 0 to 4000 Euros. That is not really helpful and bad customer experience.

So I wonder:

  1. Do you have an (ideally TypeSCript) example of a working and implemented RangeSlider?
  2. How can I prevent the RangeSlider to set defaults immediately that show up in the Refinements once the page is loaded?
#2

Hello!

You should be able to rewrite the URLs to lower the amount of noise in the URL. For example, when generating the URL you can check if the default state is set and then not append this value to the URL parameters.

We have some information on this in our documentation here. I couldn’t find an example that used RangeSlider specifically, but functionally it will be similar to how the sandbox below removes the page variable from the search parameters if it is set to the first page: