fix(types): allow useInstantSearch to be generic

packages/react-instantsearch-hooks/src/hooks/useInstantSearch.ts

@@ -4,33 +4,26 @@ import { useInstantSearchContext } from '../lib/useInstantSearchContext';
 import { useSearchResults } from '../lib/useSearchResults';
 import { useSearchState } from '../lib/useSearchState';
 
-import type { SearchResults } from 'algoliasearch-helper';
-import type {
-  IndexUiState,
-  InstantSearch,
-  Middleware,
-  ScopedResult,
-  UiState,
-} from 'instantsearch.js';
-
-type InstantSearchApi = {
-  scopedResults: ScopedResult[];
-  results: SearchResults<any>;
-  uiState: UiState;
-  setUiState: InstantSearch['setUiState'];
-  indexUiState: IndexUiState;
-  setIndexUiState: (indexUiState: IndexUiState) => void;
-  use: (...middlewares: Middleware[]) => () => void;
-  refresh: InstantSearch['refresh'];
-};
-
-export function useInstantSearch(): InstantSearchApi {
-  const search = useInstantSearchContext();
+import type { SearchResultsRenderState } from '../lib/useSearchResults';
+import type { SearchStateRenderState } from '../lib/useSearchState';
+import type { InstantSearch, Middleware, UiState } from 'instantsearch.js';
+
+type InstantSearchApi<TUiState extends UiState> =
+  SearchStateRenderState<TUiState> &
+    SearchResultsRenderState & {
+      use: (...middlewares: Middleware[]) => () => void;
+      refresh: InstantSearch['refresh'];
+    };
+
+export function useInstantSearch<
+  TUiState extends UiState = UiState
+>(): InstantSearchApi<TUiState> {
+  const search = useInstantSearchContext<TUiState>();
   const { uiState, setUiState, indexUiState, setIndexUiState } =
-    useSearchState();
+    useSearchState<TUiState>();
   const { results, scopedResults } = useSearchResults();
 
-  const use: InstantSearchApi['use'] = useCallback(
+  const use: InstantSearchApi<TUiState>['use'] = useCallback(
     (...middlewares: Middleware[]) => {
       search.use(...middlewares);
 
@@ -41,7 +34,7 @@ export function useInstantSearch(): InstantSearchApi {
     [search]
   );
 
-  const refresh: InstantSearchApi['refresh'] = useCallback(() => {
+  const refresh: InstantSearchApi<TUiState>['refresh'] = useCallback(() => {
     search.refresh();
   }, [search]);
 

packages/react-instantsearch-hooks/src/lib/useSearchResults.ts

@@ -3,7 +3,7 @@ import { useConnector } from '../hooks/useConnector';
 import type { SearchResults } from 'algoliasearch-helper';
 import type { Connector, ScopedResult } from 'instantsearch.js';
 
-type SearchResultsRenderState = {
+export type SearchResultsRenderState = {
   results: SearchResults<any>;
   scopedResults: ScopedResult[];
 };

packages/react-instantsearch-hooks/src/lib/useSearchState.ts

@@ -1,29 +1,36 @@
 import { useConnector } from '../hooks/useConnector';
 
-import type { Connector, IndexUiState, UiState } from 'instantsearch.js';
+import type { Connector, UiState } from 'instantsearch.js';
 
-type SearchStateRenderState = {
-  uiState: UiState;
-  indexUiState: IndexUiState;
-  setUiState(uiState: UiState | ((previousUiState: UiState) => UiState)): void;
+export type SearchStateRenderState<TUiState extends UiState> = {
+  uiState: TUiState;
+  indexUiState: TUiState[keyof TUiState];
+  setUiState(
+    uiState: TUiState | ((previousUiState: TUiState) => TUiState)
+  ): void;
   setIndexUiState(
     indexUiState:
-      | IndexUiState
-      | ((previousIndexUiState: IndexUiState) => IndexUiState)
+      | TUiState[keyof TUiState]
+      | ((
+          previousIndexUiState: TUiState[keyof UiState]
+        ) => TUiState[keyof UiState])
   ): void;
 };
 
-type SearchStateWidgetDescription = {
+type SearchStateWidgetDescription<TUiState extends UiState = UiState> = {
   $$type: 'ais.searchState';
-  renderState: SearchStateRenderState;
+  renderState: SearchStateRenderState<TUiState>;
 };
 
-const connectSearchState: Connector<SearchStateWidgetDescription, never> = (
-  renderFn
-) => {
+type SearchStateConnector<TUiState extends UiState = UiState> = Connector<
+  SearchStateWidgetDescription<TUiState>,
+  never
+>;
+
+const connectSearchState: SearchStateConnector = (renderFn) => {
   return (widgetParams) => {
-    let setUiState: SearchStateRenderState['setUiState'];
-    let setIndexUiState: SearchStateRenderState['setIndexUiState'];
+    let setUiState: SearchStateRenderState<UiState>['setUiState'];
+    let setIndexUiState: SearchStateRenderState<UiState>['setIndexUiState'];
     return {
       $$type: 'ais.searchState',
       getWidgetRenderState({ instantSearchInstance, parent }) {
@@ -69,6 +76,8 @@ const connectSearchState: Connector<SearchStateWidgetDescription, never> = (
   };
 };
 
-export function useSearchState() {
-  return useConnector(connectSearchState);
+export function useSearchState<TUiState extends UiState = UiState>() {
+  return useConnector<never, SearchStateWidgetDescription<TUiState>>(
+    connectSearchState as unknown as SearchStateConnector<TUiState>
+  );
 }