InstantSearch rerendering with Next.js global layout #5320
-
|
Hey! I am trying to implement a global search bar for my website, which re-routes the user to the search results page when they start typing on a page that isn't the search results page (e.g. if the user is in the homepage and starts typing, it should be redirected to the search results page). The goal is to re-route as soon as the user starts typing and not wait for the user to submit the search. I have tried a few things to implement this on Next.js using React InstantSearch Hooks, but with no success. I was wondering if anyone implemented this pattern before or could give me some help with this. 🙏 You can see that after you start typing on the search bar in the Homepage the search input is unmounted, which causes the input to lose focus. Thanks a lot! |
Beta Was this translation helpful? Give feedback.
Replies: 0 comments 1 reply
-
|
I ended up being able to implement this experience with the help of @klaasman's adaptation of algolia instant search history router for Next.js (thank you 🙏), that was shared in #3506. Here is a repo with a PoC of it in case someone runs into the same problems I had: https://github.com/francisconeves97/react-instantsearch-search-as-you-type |
Beta Was this translation helpful? Give feedback.
I ended up being able to implement this experience with the help of @klaasman's adaptation of algolia instant search history router for Next.js (thank you 🙏), that was shared in #3506.
Here is a repo with a PoC of it in case someone runs into the same problems I had: https://github.com/francisconeves97/react-instantsearch-search-as-you-type