Haroenv
commented
3 months ago I notice you don't have Hits rendered on your app, Hits is what displays the results, so that's why there are no results shown. You can follow the regular getting started guide https://www.algolia.com/doc/guides/building-search-ui/getting-started/react/#display-hits for more information.
The client import has indeed changed very recently with the release of v5 and not all imports had been changed when you opened this issue, but now those have been updated.
I can also only reproduce the hydration error in codesandbox, so I assume it's a bug in codesandbox itself.
A complete example you can use to see what's a good starting point is: https://codesandbox.io/p/devbox/github/algolia/instantsearch/tree/master/examples/react/next-app-router
dimonets
🐛 Current behavior
I followed this instruction to implement Algolia search in brand new clean Next.js application and I can't make it working: https://www.algolia.com/doc/guides/building-search-ui/going-further/server-side-rendering/react/#app-router-experimental
I have app working in my Algolia dashboard, but not through next.js script.
I believe that the call
import algoliasearch from 'algoliasearch/lite';is incorrect, because it give me an error:This expression is not callable. Type 'typeof import("/test-algolia/node_modules/algoliasearch/lite")' has no call signatures.ts(2349).Then I tried to replace import to
import {liteClient as algoliasearch} from 'algoliasearch/lite';and error gone, and at output I was able to see search box, but it doesn't return any results after typing.Can you please advise how to make it working?
PS. I know that support of App Router is experimental, but we have to use it for our new project. What are your plans with it? When do you expect to have a stable (not experimental) version?
PSS. On codesandbox it also shows Hydration error. On my local machine it doesn't show Hydration Error.
🔍 Steps to reproduce
Try to follow your steps from manual with brand new clear next.js 14 application: https://www.algolia.com/doc/guides/building-search-ui/going-further/server-side-rendering/react/#app-router-experimental
Live reproduction
https://codesandbox.io/p/devbox/condescending-star-t5yc7s
💭 Expected behavior
Works as expected. Show at least one found item on keywords: Lamp, Test...
Package version
algoliasearch: 5.1.1, instantsearch.js: 4.74.0, react-instantsearch: 7.13.0, react-instantsearch-nextjs: 0.3.10
Operating system
No response
Browser
No response
Code of Conduct