Can TS Adapter be used with react-instantsearch-hooks-web

[Roman Kovtun]

Description

I am using TS example of next implementation https://github.com/typesense/showcase-nextjs-typesense-ecommerce-store. It still uses the old way of react-instantsearch-dom/server implementation which extends the findResultsState however, the react instantsearch hooks is using a totally different approach per documentation https://www.algolia.com/doc/guides/building-search-ui/upgrade-guides/react-hooks/

Steps to reproduce

const Adapter = new TypesenseInstantsearchAdapter({
	server: SERVER_CONFIG,
	additionalSearchParameters: {
		query_by: "brand",
		group_by: "brand",
		sort_by: "created_at_unix:desc, price:asc",
		group_limit: 1,
		filter_by: "is_archived:false && is_visible:true",
		per_page: 80
	},
});

Expected Behavior

Return grouped list based on the search parameters

Actual Behavior

I have implemented the instant search with TS via hooks, however, it did not work as expected because it renders the list as is, but if you do any manipulation to the client-side it refreshes the list to the correct way I wanted it to. Example of the implementation https://www.algolia.com/doc/guides/building-search-ui/going-further/server-side-rendering/react-hooks/#server-side-rendering

Metadata

Typesense Adapter Version: 2.6.0

[Jason Bosco]

I'm not too familiar with react-instantsearch-hooks-web, but to answer your question:

Can TS Adapter be used with react-instantsearch-hooks-web

I've anecdotally heard users using the adapter with react-instantsearch-hooks-web... All the adapter does is to translate any search requests generated by instantsearch to a format understood by Typesense and vice-versa. And the data format for these search requests is consistent regardless of whether it's vanilla JS, react, vue or angular.

[Kristoffer]

Hey 👋 I came here to ask a similar question, I tried getting a demo application up and running with the Instantsearch provider from react-instantsearch-hooks-web and immediately ran into the problem of the provider sending a GET request with the Typesense API key embedded in the query string instead of as a header, which made Typesense return a 401. Did you get further than me @gyto?

[Roman Kovtun]

@denkristoffer I have a project currently working with dom/hook setup and I am still using next@12 per example, but if you try to switch to next@13 it comes to a lot of issues due to react new server-side render type

[Roman Kovtun]

I'm not too familiar with react-instantsearch-hooks-web, but to answer your question:

Can TS Adapter be used with react-instantsearch-hooks-web

I've anecdotally heard users using the adapter with react-instantsearch-hooks-web... All the adapter does is to translate any search requests generated by instantsearch to a format understood by Typesense and vice-versa. And the data format for these search requests is consistent regardless of whether it's vanilla JS, react, vue or angular.

I assume that a common sense because they change it constantly. So your suggestion is just to use regular instant search as a dom and avoid hooks?