import type { FetchOptions, FetchRequest } from 'ohmyfetch' import type { TypedInternalResponse } from 'nitropack' import { hash } from 'ohash' import { computed, isRef, Ref } from 'vue' import type { AsyncDataOptions, _Transform, KeyOfRes } from './asyncData' import { useAsyncData } from './asyncData' export type FetchResult = TypedInternalResponse export interface UseFetchOptions< DataT, Transform extends _Transform = _Transform, PickKeys extends KeyOfRes = KeyOfRes > extends AsyncDataOptions, FetchOptions { key?: string } export function useFetch< ResT = void, ReqT extends FetchRequest = FetchRequest, _ResT = ResT extends void ? FetchResult : ResT, Transform extends (res: _ResT) => any = (res: _ResT) => _ResT, PickKeys extends KeyOfRes = KeyOfRes > ( request: Ref | ReqT | (() => ReqT), opts: UseFetchOptions<_ResT, Transform, PickKeys> = {} ) { if (process.dev && opts.transform && !opts.key) { console.warn('[nuxt] You should provide a key for `useFetch` when using a custom transform function.') } const key = '$f_' + (opts.key || hash([request, { ...opts, transform: null }])) const _request = computed(() => { let r = request if (typeof r === 'function') { r = r() } return isRef(r) ? r.value : r }) const _fetchOptions = { ...opts, cache: typeof opts.cache === 'boolean' ? undefined : opts.cache } const _asyncDataOptions: AsyncDataOptions<_ResT, Transform, PickKeys> = { ...opts, watch: [ _request, ...(opts.watch || []) ] } const asyncData = useAsyncData(key, () => { return $fetch(_request.value, _fetchOptions) as Promise<_ResT> }, _asyncDataOptions) return asyncData } export function useLazyFetch< ResT = void, ReqT extends string = string, _ResT = ResT extends void ? FetchResult : ResT, Transform extends (res: _ResT) => any = (res: _ResT) => _ResT, PickKeys extends KeyOfRes = KeyOfRes > ( request: Ref | ReqT | (() => ReqT), opts: Omit, 'lazy'> = {} ) { return useFetch(request, { ...opts, lazy: true }) }