RangeSlider component does not work inside Filter's shortcut in Polaris Library

user_8608048 0
Viewed 34

I am using the Polaris library by Shopify to build an app. I am using RangeSlider with dual thumb for the filter.

However, when I add it as a shortcut inside my Filters, the slider does not work, i.e., I am not able to drag the ends of the slider

Note - If you go to More Filters -> Money Spent, the slider works fine without any issues, and I am able to drag both ends.

I tried manipulating the callback, but it didn't help and also does not throw any errors while debugging.

Reproducible Code Link to CodeSandbox => check Money spend filter

shopify-app polaris shopify reactjs
1 Answers

The problem seems to be that you are saving the data the user enters into rangeValue, but the code you have to add the filters (Line 198) is looking at moneySpent instead. Since moneySpent is never set, the filter is never added.

user_18287090
Related