Giters

algolia / instantsearch

⚡️ Libraries for building performant and instant search experiences with Algolia. Compatible with JavaScript, TypeScript, React and Vue.

Home Page:https://www.algolia.com/doc/guides/building-search-ui/what-is-instantsearch/js/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Using nextjs instant search with App router - navigating back in browser shows incorrect search results

PaulWild opened this issue · comments

commented

🐛 Current behavior

when Using react-instantsearch-nextjs in the app router with routing, if you have been on multiple pages and click on a link to a search item (as an example) and then hit back in the browser, the list of search results shown is not correct, it shows items from a different page.

The code is a small addition to the example repo, adding a link to each search item

Code: https://github.com/PaulWild/algolia-next-app-bug

🔍 Steps to reproduce

  1. Go to a search results page, with pagination and routing (eg https://algolia-next-app-bug.vercel.app/)
  2. click on a page other than the page you are on.
  3. click a link to go to another page (eg an item in the search list)
  4. Hit back in the browser

The search result page you finish on is not showing the correct search results for that page.

Live reproduction

https://algolia-next-app-bug.vercel.app/

💭 Expected behavior

When using the browsers back button the search results should be the correct search results

Package version

react-instantsearch-nextjs: 0.1.14

Operating system

No response

Browser

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct
commented

Hi @PaulWild,

Thanks for raising this issue !

This seems to happen starting from Next 14, if you are running 14.0.x this can be fixed with this :

routing={{
  router: { push: (url) => window.history.pushState({}, "", url) },
}}

Which we wanted to set as default, but this seems to be broken starting from 14.1.0...

So I would suggest you pin your version 14.0 if possible with the above code while we look for a viable solution for the latest Next version.

commented

Thanks for the reply. Unfortunately we are dependent on some other fixes that came in 14.1!

We've had to take the step of switching back to client only search provider to provide a more consistent behaviour.

We appreciate the hard work going in to getting a nice SSR solution with next!

commented

Hi @PaulWild,

This should be fixed when the next version of react-instantsearch-nextjs is released !
You may try with a build from the PR to make sure it does before release :)