forked from crowetic/commerce
Moved data hooks to new format
This commit is contained in:
parent
7005e45b09
commit
6721ef736b
@ -1,11 +1,10 @@
|
|||||||
import { HookHandler } from '@commerce/utils/types'
|
import { SWRHook } from '@commerce/utils/types'
|
||||||
import useCustomer, { UseCustomer } from '@commerce/customer/use-customer'
|
import useCustomer, { UseCustomer } from '@commerce/customer/use-customer'
|
||||||
import type { Customer, CustomerData } from '../api/customers'
|
import type { Customer, CustomerData } from '../api/customers'
|
||||||
import type { BigcommerceProvider } from '..'
|
|
||||||
|
|
||||||
export default useCustomer as UseCustomer<BigcommerceProvider>
|
export default useCustomer as UseCustomer<typeof handler>
|
||||||
|
|
||||||
export const handler: HookHandler<Customer | null> = {
|
export const handler: SWRHook<Customer | null> = {
|
||||||
fetchOptions: {
|
fetchOptions: {
|
||||||
url: '/api/bigcommerce/customers',
|
url: '/api/bigcommerce/customers',
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
@ -14,11 +13,11 @@ export const handler: HookHandler<Customer | null> = {
|
|||||||
const data = await fetch<CustomerData | null>(options)
|
const data = await fetch<CustomerData | null>(options)
|
||||||
return data?.customer ?? null
|
return data?.customer ?? null
|
||||||
},
|
},
|
||||||
useHook({ input, useData }) {
|
useHook: ({ useData }) => (input) => {
|
||||||
return useData({
|
return useData({
|
||||||
swrOptions: {
|
swrOptions: {
|
||||||
revalidateOnFocus: false,
|
revalidateOnFocus: false,
|
||||||
...input.swrOptions,
|
...input?.swrOptions,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -1,9 +1,8 @@
|
|||||||
import { HookHandler } from '@commerce/utils/types'
|
import { SWRHook } from '@commerce/utils/types'
|
||||||
import useSearch, { UseSearch } from '@commerce/product/use-search'
|
import useSearch, { UseSearch } from '@commerce/product/use-search'
|
||||||
import type { SearchProductsData } from '../api/catalog/products'
|
import type { SearchProductsData } from '../api/catalog/products'
|
||||||
import type { BigcommerceProvider } from '..'
|
|
||||||
|
|
||||||
export default useSearch as UseSearch<BigcommerceProvider>
|
export default useSearch as UseSearch<typeof handler>
|
||||||
|
|
||||||
export type SearchProductsInput = {
|
export type SearchProductsInput = {
|
||||||
search?: string
|
search?: string
|
||||||
@ -12,7 +11,7 @@ export type SearchProductsInput = {
|
|||||||
sort?: string
|
sort?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export const handler: HookHandler<
|
export const handler: SWRHook<
|
||||||
SearchProductsData,
|
SearchProductsData,
|
||||||
SearchProductsInput,
|
SearchProductsInput,
|
||||||
SearchProductsInput
|
SearchProductsInput
|
||||||
@ -37,7 +36,7 @@ export const handler: HookHandler<
|
|||||||
method: options.method,
|
method: options.method,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
useHook({ input, useData }) {
|
useHook: ({ useData }) => (input = {}) => {
|
||||||
return useData({
|
return useData({
|
||||||
input: [
|
input: [
|
||||||
['search', input.search],
|
['search', input.search],
|
||||||
|
@ -1,13 +1,12 @@
|
|||||||
import { useMemo } from 'react'
|
import { useMemo } from 'react'
|
||||||
import { HookHandler } from '@commerce/utils/types'
|
import { SWRHook } from '@commerce/utils/types'
|
||||||
import useWishlist, { UseWishlist } from '@commerce/wishlist/use-wishlist'
|
import useWishlist, { UseWishlist } from '@commerce/wishlist/use-wishlist'
|
||||||
import type { Wishlist } from '../api/wishlist'
|
import type { Wishlist } from '../api/wishlist'
|
||||||
import useCustomer from '../customer/use-customer'
|
import useCustomer from '../customer/use-customer'
|
||||||
import type { BigcommerceProvider } from '..'
|
|
||||||
|
|
||||||
export default useWishlist as UseWishlist<BigcommerceProvider>
|
export default useWishlist as UseWishlist<typeof handler>
|
||||||
|
|
||||||
export const handler: HookHandler<
|
export const handler: SWRHook<
|
||||||
Wishlist | null,
|
Wishlist | null,
|
||||||
{ includeProducts?: boolean },
|
{ includeProducts?: boolean },
|
||||||
{ customerId?: number; includeProducts: boolean },
|
{ customerId?: number; includeProducts: boolean },
|
||||||
@ -30,16 +29,16 @@ export const handler: HookHandler<
|
|||||||
method: options.method,
|
method: options.method,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
useHook({ input, useData }) {
|
useHook: ({ useData }) => (input) => {
|
||||||
const { data: customer } = useCustomer()
|
const { data: customer } = useCustomer()
|
||||||
const response = useData({
|
const response = useData({
|
||||||
input: [
|
input: [
|
||||||
['customerId', (customer as any)?.id],
|
['customerId', (customer as any)?.id],
|
||||||
['includeProducts', input.includeProducts],
|
['includeProducts', input?.includeProducts],
|
||||||
],
|
],
|
||||||
swrOptions: {
|
swrOptions: {
|
||||||
revalidateOnFocus: false,
|
revalidateOnFocus: false,
|
||||||
...input.swrOptions,
|
...input?.swrOptions,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
import Cookies from 'js-cookie'
|
import Cookies from 'js-cookie'
|
||||||
import type { Cart } from '../types'
|
import { useHook, useSWRHook } from '../utils/use-hook'
|
||||||
import type { HookFetcherFn, SWRHook } from '../utils/types'
|
import type { HookFetcherFn, SWRHook } from '../utils/types'
|
||||||
|
import type { Cart } from '../types'
|
||||||
import { Provider, useCommerce } from '..'
|
import { Provider, useCommerce } from '..'
|
||||||
import { useHook, useSWRHook } from '@commerce/utils/use-hook'
|
|
||||||
|
|
||||||
export type FetchCartInput = {
|
export type FetchCartInput = {
|
||||||
cartId?: Cart['id']
|
cartId?: Cart['id']
|
||||||
|
@ -1,56 +1,20 @@
|
|||||||
|
import { useHook, useSWRHook } from '../utils/use-hook'
|
||||||
|
import { SWRFetcher } from '../utils/default-fetcher'
|
||||||
|
import type { HookFetcherFn, SWRHook } from '../utils/types'
|
||||||
import type { Customer } from '../types'
|
import type { Customer } from '../types'
|
||||||
import type {
|
import { Provider } from '..'
|
||||||
Prop,
|
|
||||||
HookFetcherFn,
|
|
||||||
UseHookInput,
|
|
||||||
UseHookResponse,
|
|
||||||
} from '../utils/types'
|
|
||||||
import defaultFetcher from '../utils/default-fetcher'
|
|
||||||
import useData from '../utils/use-data'
|
|
||||||
import { Provider, useCommerce } from '..'
|
|
||||||
|
|
||||||
export type UseCustomerHandler<P extends Provider> = Prop<
|
export type UseCustomer<
|
||||||
Prop<P, 'customer'>,
|
H extends SWRHook<any, any, any> = SWRHook<Customer | null>
|
||||||
'useCustomer'
|
> = ReturnType<H['useHook']>
|
||||||
>
|
|
||||||
|
|
||||||
export type UseCustomerInput<P extends Provider> = UseHookInput<
|
export const fetcher: HookFetcherFn<Customer | null, any> = SWRFetcher
|
||||||
UseCustomerHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type CustomerResponse<P extends Provider> = UseHookResponse<
|
const fn = (provider: Provider) => provider.customer?.useCustomer!
|
||||||
UseCustomerHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type UseCustomer<P extends Provider> = Partial<
|
const useCustomer: UseCustomer = (input) => {
|
||||||
UseCustomerInput<P>
|
const hook = useHook(fn)
|
||||||
> extends UseCustomerInput<P>
|
return useSWRHook({ fetcher, ...hook })(input)
|
||||||
? (input?: UseCustomerInput<P>) => CustomerResponse<P>
|
|
||||||
: (input: UseCustomerInput<P>) => CustomerResponse<P>
|
|
||||||
|
|
||||||
export const fetcher = defaultFetcher as HookFetcherFn<Customer | null>
|
|
||||||
|
|
||||||
export default function useCustomer<P extends Provider>(
|
|
||||||
input: UseCustomerInput<P> = {}
|
|
||||||
) {
|
|
||||||
const { providerRef, fetcherRef } = useCommerce<P>()
|
|
||||||
|
|
||||||
const provider = providerRef.current
|
|
||||||
const opts = provider.customer?.useCustomer
|
|
||||||
|
|
||||||
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
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export default useCustomer
|
||||||
|
@ -21,13 +21,13 @@ export type Provider = CommerceConfig & {
|
|||||||
useRemoveItem?: MutationHook<any, any, any>
|
useRemoveItem?: MutationHook<any, any, any>
|
||||||
}
|
}
|
||||||
wishlist?: {
|
wishlist?: {
|
||||||
useWishlist?: HookHandler<Wishlist | null, any, any>
|
useWishlist?: SWRHook<Wishlist | null, any, any>
|
||||||
}
|
}
|
||||||
customer: {
|
customer: {
|
||||||
useCustomer?: HookHandler<Customer | null, any, any>
|
useCustomer?: SWRHook<Customer | null, any, any>
|
||||||
}
|
}
|
||||||
products: {
|
products: {
|
||||||
useSearch?: HookHandler<SearchProductsData, any, any>
|
useSearch?: SWRHook<SearchProductsData, any, any>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,57 +1,20 @@
|
|||||||
|
import { useHook, useSWRHook } from '../utils/use-hook'
|
||||||
|
import { SWRFetcher } from '../utils/default-fetcher'
|
||||||
|
import type { HookFetcherFn, SWRHook } from '../utils/types'
|
||||||
import type { SearchProductsData } from '../types'
|
import type { SearchProductsData } from '../types'
|
||||||
import type {
|
import { Provider } from '..'
|
||||||
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<
|
export type UseSearch<
|
||||||
Prop<P, 'products'>,
|
H extends SWRHook<any, any, any> = SWRHook<SearchProductsData>
|
||||||
'useSearch'
|
> = ReturnType<H['useHook']>
|
||||||
>
|
|
||||||
|
|
||||||
export type UseSeachInput<P extends Provider> = UseHookInput<
|
export const fetcher: HookFetcherFn<SearchProductsData, any> = SWRFetcher
|
||||||
UseSearchHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type SearchResponse<P extends Provider> = UseHookResponse<
|
const fn = (provider: Provider) => provider.products?.useSearch!
|
||||||
UseSearchHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type UseSearch<P extends Provider> = Partial<
|
const useSearch: UseSearch = (input) => {
|
||||||
UseSeachInput<P>
|
const hook = useHook(fn)
|
||||||
> extends UseSeachInput<P>
|
return useSWRHook({ fetcher, ...hook })(input)
|
||||||
? (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
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export default useSearch
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import type { HookFetcherFn } from './types'
|
import type { HookFetcherFn } from './types'
|
||||||
|
|
||||||
const defaultFetcher: HookFetcherFn<any> = ({ options, fetch }) =>
|
export const SWRFetcher: HookFetcherFn<any, any> = ({ options, fetch }) =>
|
||||||
fetch(options)
|
fetch(options)
|
||||||
|
|
||||||
export const mutationFetcher: HookFetcherFn<any, any> = ({
|
export const mutationFetcher: HookFetcherFn<any, any> = ({
|
||||||
@ -9,4 +9,4 @@ export const mutationFetcher: HookFetcherFn<any, any> = ({
|
|||||||
fetch,
|
fetch,
|
||||||
}) => fetch({ ...options, body: input })
|
}) => fetch({ ...options, body: input })
|
||||||
|
|
||||||
export default defaultFetcher
|
export default SWRFetcher
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { useCallback } from 'react'
|
import { useCallback } from 'react'
|
||||||
import type { Fetcher, MutationHook, PickRequired, SWRHook } from './types'
|
import type { MutationHook, PickRequired, SWRHook } from './types'
|
||||||
import { Provider, useCommerce } from '..'
|
import { Provider, useCommerce } from '..'
|
||||||
import useData from './use-data'
|
import useData from './use-data'
|
||||||
|
|
||||||
|
@ -1,56 +1,25 @@
|
|||||||
|
import { useHook, useSWRHook } from '../utils/use-hook'
|
||||||
|
import { SWRFetcher } from '../utils/default-fetcher'
|
||||||
|
import type { HookFetcherFn, SWRHook } from '../utils/types'
|
||||||
import type { Wishlist } from '../types'
|
import type { Wishlist } from '../types'
|
||||||
import type {
|
import type { Provider } from '..'
|
||||||
Prop,
|
|
||||||
HookFetcherFn,
|
|
||||||
UseHookInput,
|
|
||||||
UseHookResponse,
|
|
||||||
} from '../utils/types'
|
|
||||||
import defaultFetcher from '../utils/default-fetcher'
|
|
||||||
import useData from '../utils/use-data'
|
|
||||||
import { Provider, useCommerce } from '..'
|
|
||||||
|
|
||||||
export type UseWishlistHandler<P extends Provider> = Prop<
|
export type UseWishlist<
|
||||||
Prop<P, 'wishlist'>,
|
H extends SWRHook<any, any, any> = SWRHook<
|
||||||
'useWishlist'
|
Wishlist | null,
|
||||||
>
|
{ includeProducts?: boolean },
|
||||||
|
{ customerId?: number; includeProducts: boolean },
|
||||||
|
{ isEmpty?: boolean }
|
||||||
|
>
|
||||||
|
> = ReturnType<H['useHook']>
|
||||||
|
|
||||||
export type UseWishlistInput<P extends Provider> = UseHookInput<
|
export const fetcher: HookFetcherFn<Wishlist | null, any> = SWRFetcher
|
||||||
UseWishlistHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type WishlistResponse<P extends Provider> = UseHookResponse<
|
const fn = (provider: Provider) => provider.wishlist?.useWishlist!
|
||||||
UseWishlistHandler<P>
|
|
||||||
>
|
|
||||||
|
|
||||||
export type UseWishlist<P extends Provider> = Partial<
|
const useWishlist: UseWishlist = (input) => {
|
||||||
UseWishlistInput<P>
|
const hook = useHook(fn)
|
||||||
> extends UseWishlistInput<P>
|
return useSWRHook({ fetcher, ...hook })(input)
|
||||||
? (input?: UseWishlistInput<P>) => WishlistResponse<P>
|
|
||||||
: (input: UseWishlistInput<P>) => WishlistResponse<P>
|
|
||||||
|
|
||||||
export const fetcher = defaultFetcher as HookFetcherFn<Wishlist | null>
|
|
||||||
|
|
||||||
export default function useWishlist<P extends Provider>(
|
|
||||||
input: UseWishlistInput<P> = {}
|
|
||||||
) {
|
|
||||||
const { providerRef, fetcherRef } = useCommerce<P>()
|
|
||||||
|
|
||||||
const provider = providerRef.current
|
|
||||||
const opts = provider.wishlist?.useWishlist
|
|
||||||
|
|
||||||
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
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export default useWishlist
|
||||||
|
Loading…
x
Reference in New Issue
Block a user