Changes

components/wishlist/WishlistButton/WishlistButton.tsx

@@ -8,7 +8,7 @@ import useCustomer from '@framework/customer/use-customer'
 import useAddItem from '@framework/wishlist/use-add-item'
 import useRemoveItem from '@framework/wishlist/use-remove-item'
 import useWishlist from '@framework/wishlist/use-add-item'
-import type { Product } from '@framework/types'
+
 type Props = {
   productId: Product['id']
   variant: ProductVariant

framework/bigcommerce/product/use-search.tsx

@@ -1,5 +1,5 @@
 import { HookHandler } from '@commerce/utils/types'
-import useSearch, { UseSearch } from '@commerce/product/use-search'
+import useSearch, { UseSearch } from '@commerce/products/use-search'
 import type { SearchProductsData } from '../api/catalog/products'
 import type { BigcommerceProvider } from '..'
 

framework/commerce/products/use-search.tsx

@@ -0,0 +1,57 @@
+import type { SearchProductsData } from '../types'
+import type {
+  Prop,
+  HookFetcherFn,
+  UseHookInput,
+  UseHookResponse,
+} from '../utils/types'
+import defaultFetcher from '../utils/default-fetcher'
+import useData from '../utils/use-data'
+import { Provider, useCommerce } from '..'
+import { BigcommerceProvider } from '@framework'
+
+export type UseSearchHandler<P extends Provider> = Prop<
+  Prop<P, 'products'>,
+  'useSearch'
+>
+
+export type UseSeachInput<P extends Provider> = UseHookInput<
+  UseSearchHandler<P>
+>
+
+export type SearchResponse<P extends Provider> = UseHookResponse<
+  UseSearchHandler<P>
+>
+
+export type UseSearch<P extends Provider> = Partial<
+  UseSeachInput<P>
+> extends UseSeachInput<P>
+  ? (input?: UseSeachInput<P>) => SearchResponse<P>
+  : (input: UseSeachInput<P>) => SearchResponse<P>
+
+export const fetcher = defaultFetcher as HookFetcherFn<SearchProductsData>
+
+export default function useSearch<P extends Provider>(
+  input: UseSeachInput<P> = {}
+) {
+  const { providerRef, fetcherRef } = useCommerce<P>()
+
+  const provider = providerRef.current
+  const opts = provider.products?.useSearch
+
+  const fetcherFn = opts?.fetcher ?? fetcher
+  const useHook = opts?.useHook ?? ((ctx) => ctx.useData())
+
+  return useHook({
+    input,
+    useData(ctx) {
+      const response = useData(
+        { ...opts!, fetcher: fetcherFn },
+        ctx?.input ?? [],
+        provider.fetcher ?? fetcherRef.current,
+        ctx?.swrOptions ?? input.swrOptions
+      )
+      return response
+    },
+  })
+}