matias-delavega-dg-dmi 716b540966
TEC-252 and TEC-256: Implementing fetchers, products list and search (#5)
* TEC-252: Base integration with commercetools using fetchers for REST and GraphQL endpoints

* TEC-252: WIP commenting some components that are failing while we don't have all the hooks defined

* add sdk integration

* TEC-256: Implementing product search

* TEC-256: removing unnecessary env variables

* TEC-256: review comments

* TEC-256: other remaining review fixes

Co-authored-by: nicossosa93 <nicolas.sosa@devgurus.io>
2021-06-30 10:05:26 -03:00

55 lines
1.4 KiB
TypeScript

import { SWRHook } from '@commerce/utils/types'
import useSearch, { UseSearch } from '@commerce/product/use-search'
import { Product } from '@commerce/types/product'
import type { SearchProductsHook } from '../../commerce/types/product'
export default useSearch as UseSearch<typeof handler>
export type SearchProductsInput = {
search?: string
categoryId?: string
brandId?: string
sort?: string
locale?: string
}
export type SearchProductsData = {
products: Product[]
found: boolean
}
export const handler: SWRHook<SearchProductsHook> = {
fetchOptions: {
url: 'api/catalog/products',
method: 'GET',
},
async fetcher({ input, options, fetch }) {
const { search, categoryId, brandId, sort } = input
const url = new URL(options.url!, 'http://a')
if (search) url.searchParams.set('search', search)
if (categoryId) url.searchParams.set('categoryId', String(categoryId))
if (brandId) url.searchParams.set('brandId', String(brandId))
if (sort) url.searchParams.set('sort', sort)
return await fetch({
url: url.pathname + url.search,
method: options.method,
})
},
useHook: ({ useData }) => (input = {}) => {
return useData({
input: [
['search', input.search],
['categoryId', input.categoryId],
['brandId', input.brandId],
['sort', input.sort],
],
swrOptions: {
revalidateOnFocus: false,
...input.swrOptions,
},
})
},
}