forked from crowetic/commerce
Add util hooks for creating hooks
This commit is contained in:
parent
96b7971e94
commit
d4f09d3590
@ -1,6 +1,6 @@
|
||||
import { ConfigInterface } from 'swr'
|
||||
import { HookFetcher, HookDeps } from '@lib/commerce/utils/types'
|
||||
import useCommerceCart from '@lib/commerce/cart/use-cart'
|
||||
import { HookFetcher } from '@lib/commerce/utils/types'
|
||||
import useCommerceCart, { CartInput } from '@lib/commerce/cart/use-cart'
|
||||
import type { Cart } from '../api/cart'
|
||||
|
||||
const defaultOpts = {
|
||||
@ -9,11 +9,17 @@ const defaultOpts = {
|
||||
|
||||
export type { Cart }
|
||||
|
||||
export const fetcher: HookFetcher<Cart | null, {}> = (options, _, fetch) => {
|
||||
return fetch({
|
||||
url: options?.url,
|
||||
query: options?.query,
|
||||
})
|
||||
export const fetcher: HookFetcher<Cart | null, CartInput> = (
|
||||
options,
|
||||
{ cartId },
|
||||
fetch
|
||||
) => {
|
||||
return cartId
|
||||
? fetch({
|
||||
url: options?.url,
|
||||
query: options?.query,
|
||||
})
|
||||
: null
|
||||
}
|
||||
|
||||
export function extendHook(
|
||||
|
@ -1,17 +1,5 @@
|
||||
import { useCallback } from 'react'
|
||||
import type { HookFetcher, HookFetcherOptions } from '../utils/types'
|
||||
import { useCommerce } from '..'
|
||||
import useAction from '../utils/use-action'
|
||||
|
||||
export default function useAddItem<T, Input>(
|
||||
options: HookFetcherOptions,
|
||||
fetcher: HookFetcher<T, Input>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
const useAddItem = useAction
|
||||
|
||||
return useCallback(
|
||||
function addItem(input: Input) {
|
||||
return fetcher(options, input, fetcherRef.current)
|
||||
},
|
||||
[fetcher]
|
||||
)
|
||||
}
|
||||
export default useAddItem
|
||||
|
@ -1,35 +1,29 @@
|
||||
import useSWR, { responseInterface, ConfigInterface } from 'swr'
|
||||
import { responseInterface, ConfigInterface } from 'swr'
|
||||
import Cookies from 'js-cookie'
|
||||
import type { HookInput, HookFetcher, HookFetcherOptions } from '../utils/types'
|
||||
import useData from '../utils/use-data'
|
||||
import { useCommerce } from '..'
|
||||
|
||||
export type CartResponse<C> = responseInterface<C, Error> & {
|
||||
isEmpty: boolean
|
||||
}
|
||||
|
||||
export type CartInput = {
|
||||
cartId: string | undefined
|
||||
}
|
||||
|
||||
export default function useCart<T>(
|
||||
options: HookFetcherOptions,
|
||||
input: HookInput,
|
||||
fetcherFn: HookFetcher<T, any>,
|
||||
fetcherFn: HookFetcher<T | null, CartInput>,
|
||||
swrOptions?: ConfigInterface<T | null>
|
||||
) {
|
||||
const { fetcherRef, cartCookie } = useCommerce()
|
||||
const fetcher = (url?: string, query?: string, ...args: any[]) =>
|
||||
Cookies.get(cartCookie)
|
||||
? fetcherFn(
|
||||
{ url, query },
|
||||
args.reduce((obj, val, i) => {
|
||||
obj[input[i][1]!] = val
|
||||
return obj
|
||||
}, {}),
|
||||
fetcherRef.current
|
||||
)
|
||||
: null
|
||||
const response = useSWR(
|
||||
[options.url, options.query, ...input.map((e) => e[1])],
|
||||
fetcher,
|
||||
swrOptions
|
||||
)
|
||||
const { cartCookie } = useCommerce()
|
||||
const fetcher: typeof fetcherFn = (options, input, fetch) => {
|
||||
input.cartId = Cookies.get(cartCookie)
|
||||
return fetcherFn(options, input, fetch)
|
||||
}
|
||||
const response = useData(options, input, fetcher, swrOptions)
|
||||
|
||||
return Object.assign(response, { isEmpty: true }) as CartResponse<T>
|
||||
}
|
||||
|
@ -1,17 +1,5 @@
|
||||
import { useCallback } from 'react'
|
||||
import type { HookFetcher, HookFetcherOptions } from '../utils/types'
|
||||
import { useCommerce } from '..'
|
||||
import useAction from '../utils/use-action'
|
||||
|
||||
export default function useRemoveItem<T, Input>(
|
||||
options: HookFetcherOptions,
|
||||
fetcher: HookFetcher<T, Input>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
const useRemoveItem = useAction
|
||||
|
||||
return useCallback(
|
||||
function removeItem(input: Input) {
|
||||
return fetcher(options, input, fetcherRef.current)
|
||||
},
|
||||
[fetcher]
|
||||
)
|
||||
}
|
||||
export default useRemoveItem
|
||||
|
@ -1,17 +1,5 @@
|
||||
import { useCallback } from 'react'
|
||||
import type { HookFetcher, HookFetcherOptions } from '../utils/types'
|
||||
import { useCommerce } from '..'
|
||||
import useAction from '../utils/use-action'
|
||||
|
||||
export default function useUpdateItem<T, Input>(
|
||||
options: HookFetcherOptions,
|
||||
fetcher: HookFetcher<T, Input>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
const useUpdateItem = useAction
|
||||
|
||||
return useCallback(
|
||||
function updateItem(input: Input) {
|
||||
return fetcher(options, input, fetcherRef.current)
|
||||
},
|
||||
[fetcher]
|
||||
)
|
||||
}
|
||||
export default useUpdateItem
|
||||
|
@ -1,28 +1,5 @@
|
||||
import useSWR, { ConfigInterface } from 'swr'
|
||||
import type { HookInput, HookFetcher, HookFetcherOptions } from '../utils/types'
|
||||
import { useCommerce } from '..'
|
||||
import useData from '../utils/use-data'
|
||||
|
||||
export default function useSearch<T>(
|
||||
options: HookFetcherOptions,
|
||||
input: HookInput,
|
||||
fetcherFn: HookFetcher<T, any>,
|
||||
swrOptions?: ConfigInterface<T | null>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
const fetcher = (url?: string, query?: string, ...args: any[]) =>
|
||||
fetcherFn(
|
||||
{ url, query },
|
||||
args.reduce((obj, val, i) => {
|
||||
obj[input[i][1]!] = val
|
||||
return obj
|
||||
}, {}),
|
||||
fetcherRef.current
|
||||
)
|
||||
const response = useSWR(
|
||||
[options.url, options.query, ...input.map((e) => e[1])],
|
||||
fetcher,
|
||||
swrOptions
|
||||
)
|
||||
const useSearch = useData
|
||||
|
||||
return response
|
||||
}
|
||||
export default useSearch
|
||||
|
17
lib/commerce/utils/use-action.tsx
Normal file
17
lib/commerce/utils/use-action.tsx
Normal file
@ -0,0 +1,17 @@
|
||||
import { useCallback } from 'react'
|
||||
import type { HookFetcher, HookFetcherOptions } from './types'
|
||||
import { useCommerce } from '..'
|
||||
|
||||
export default function useAction<T, Input>(
|
||||
options: HookFetcherOptions,
|
||||
fetcher: HookFetcher<T, Input>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
|
||||
return useCallback(
|
||||
function addItem(input: Input) {
|
||||
return fetcher(options, input, fetcherRef.current)
|
||||
},
|
||||
[fetcher]
|
||||
)
|
||||
}
|
28
lib/commerce/utils/use-data.tsx
Normal file
28
lib/commerce/utils/use-data.tsx
Normal file
@ -0,0 +1,28 @@
|
||||
import useSWR, { ConfigInterface } from 'swr'
|
||||
import type { HookInput, HookFetcher, HookFetcherOptions } from './types'
|
||||
import { useCommerce } from '..'
|
||||
|
||||
export default function useData<T, Input = any>(
|
||||
options: HookFetcherOptions,
|
||||
input: HookInput,
|
||||
fetcherFn: HookFetcher<T, Input>,
|
||||
swrOptions?: ConfigInterface<T>
|
||||
) {
|
||||
const { fetcherRef } = useCommerce()
|
||||
const fetcher = (url?: string, query?: string, ...args: any[]) =>
|
||||
fetcherFn(
|
||||
{ url, query },
|
||||
args.reduce((obj, val, i) => {
|
||||
obj[input[i][1]!] = val
|
||||
return obj
|
||||
}, {}),
|
||||
fetcherRef.current
|
||||
)
|
||||
const response = useSWR(
|
||||
[options.url, options.query, ...input.map((e) => e[1])],
|
||||
fetcher,
|
||||
swrOptions
|
||||
)
|
||||
|
||||
return response
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user