React Instant Search Range Slider Issue and Alternative Solutions
TLDR Lukas voiced concerns and issues regarding React instant search range slider. Jason suggested a custom range slider, custom code, and using typesense-js directly as potential alternatives and solutions.
May 29, 2022 (17 months ago)
Lukas
05:17 PMI find React instant search
RangeSlider
to have very bad user experience.When setting your range on more than 1 slider, the rest of the slider values keeps jumping, because it always tries to find the hit. Also you can’t select out of range values?
When selecting a value that doesn’t exist in the database i get:
Error: You can't provide min value lower than range.
In my opinion it would be much better if instead of throwing validation error, user would simply be informed that 0 hits were returned.
Is there any solution to this?
Jason
05:20 PMLukas
05:23 PMLukas
05:24 PMJason
05:25 PMJason
05:26 PMHere's how I implemented the price range slider: https://github.com/typesense/showcase-nextjs-typesense-ecommerce-store/blob/master/components/RangeSlider/RangeSlider.js
Jason
05:27 PMLukas
05:44 PMJason
05:45 PMLukas
05:50 PMJason
06:09 PMLukas
06:12 PMconnectRange
api from react-instantsearchLukas
06:15 PMLike passing all the parameters and query string yourself.
Jason
06:54 PMTypesense
Indexed 2779 threads (79% resolved)
Similar Threads
Issues with Typesense Frontend Search Integration
Akash experienced issues integrating Typesense into their frontend search, particularly with their search box. Jason guided them to troubleshoot, eventually identifying the issue to be with react-instantsearch-dom and suggesting a downgrade to react 17, which resolved the issue.
Resolving Issue with Instantsearch Sort_by in React
Edward had a problem with sorting functionality in a React component using Algolia's InstantSearch. Jason recommended a potential solution for specifying index names which resolved the issue.
Network Errors and Duplicate Requests in Typesense
Ethan and Rushil were experiencing more than 300 network errors and duplicate requests from Typesense. After rigorous troubleshooting, Jason identified the issue as an Instantsearch-induced multiple re-rendering and implemented a fix. Multiple requests reduced, but networking errors persisted, suggested to be due to client-side internet connectivity.
Troubleshooting Typesense Setup and Understanding Facets and Keywords
Demitri encountered errors when exploring Typesense for the first time. Jason guided them through troubleshooting and discussed facets, keyword settings, and widget configurations. Helin shared a Python demo app and its source code to help Demitri with their project.
Implementing Search Suggestion/Autocomplete Functionality in Typesense
Denis needed advice on implementing search suggestions in Typesense. Jason provided a solution for fetching after 3+ letters. However, questions on design pattern and passing hooks remain unanswered.