@sanity/sdk-react 3.0.0-rc.0 → 3.0.0-rc.1

package/src/hooks/documents/useDocuments.test.tsx

@@ -1,10 +1,8 @@
-import {type DatasetResource} from '@sanity/sdk'
+import {act, renderHook} from '@testing-library/react'
 import {evaluateSync, parse, toJS} from 'groq-js'
 import {describe, vi} from 'vitest'
 
-import {act, renderHook} from '../../../test/test-utils'
 import {ResourceProvider} from '../../context/ResourceProvider'
-import {ResourcesContext} from '../../context/ResourcesContext'
 import {useQuery} from '../query/useQuery'
 import {useDocuments} from './useDocuments'
 
@@ -79,13 +77,25 @@ describe('useDocuments', () => {
 
   it('should respect custom page size', () => {
     const customBatchSize = 2
-    const {result} = renderHook(() => useDocuments({batchSize: customBatchSize}))
+    const {result} = renderHook(() => useDocuments({batchSize: customBatchSize}), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
 
     expect(result.current.data.length).toBe(customBatchSize)
   })
 
   it('should filter by document type', () => {
-    const {result} = renderHook(() => useDocuments({filter: '_type == "movie"'}))
+    const {result} = renderHook(() => useDocuments({filter: '_type == "movie"'}), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
 
     expect(result.current.data.every((doc) => doc.documentType === 'movie')).toBe(true)
     expect(result.current.count).toBe(5) // 5 movies in the dataset
@@ -93,18 +103,32 @@ describe('useDocuments', () => {
 
   // groq-js doesn't support search filters yet
   it.skip('should apply search filter', () => {
-    const {result} = renderHook(() => useDocuments({search: 'inter'}))
+    const {result} = renderHook(() => useDocuments({search: 'inter'}), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
 
     // Should match "Interstellar"
     expect(result.current.data.some((doc) => doc.documentId === 'movie3')).toBe(true)
   })
 
   it('should apply ordering', () => {
-    const {result} = renderHook(() =>
-      useDocuments({
-        filter: '_type == "movie"',
-        orderings: [{field: 'releaseYear', direction: 'desc'}],
-      }),
+    const {result} = renderHook(
+      () =>
+        useDocuments({
+          filter: '_type == "movie"',
+          orderings: [{field: 'releaseYear', direction: 'desc'}],
+        }),
+      {
+        wrapper: ({children}) => (
+          <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+            {children}
+          </ResourceProvider>
+        ),
+      },
     )
 
     // First item should be the most recent movie (Interstellar, 2014)
@@ -113,7 +137,13 @@ describe('useDocuments', () => {
 
   it('should load more data when loadMore is called', () => {
     const batchSize = 2
-    const {result} = renderHook(() => useDocuments({batchSize: batchSize}))
+    const {result} = renderHook(() => useDocuments({batchSize: batchSize}), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
 
     expect(result.current.data.length).toBe(batchSize)
 
@@ -125,7 +155,13 @@ describe('useDocuments', () => {
   })
 
   it('should indicate when there is more data to load', () => {
-    const {result} = renderHook(() => useDocuments({batchSize: 3}))
+    const {result} = renderHook(() => useDocuments({batchSize: 3}), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
     expect(result.current.hasMore).toBe(true)
     // Load all remaining data
     act(() => {
@@ -138,6 +174,11 @@ describe('useDocuments', () => {
   it('should reset limit when filter changes', () => {
     const {result, rerender} = renderHook((props) => useDocuments(props), {
       initialProps: {batchSize: 2, filter: ''},
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
     })
     // Initially, data length equals pageSize (2)
     expect(result.current.data.length).toBe(2)
@@ -153,44 +194,23 @@ describe('useDocuments', () => {
     expect(result.current.data.length).toBe(2)
   })
 
-  it('should add resources to document handles', () => {
-    const {result} = renderHook(() => useDocuments({}))
-
-    // Check that the first document handle has the projectId and dataset
-    expect((result.current.data[0].resource as DatasetResource).projectId).toBe('test')
-    expect((result.current.data[0].resource as DatasetResource).dataset).toBe('test')
-
-    // Verify all document handles have these properties
-    expect(
-      result.current.data.every(
-        (doc) =>
-          (doc.resource as DatasetResource).projectId === 'test' &&
-          (doc.resource as DatasetResource).dataset === 'test',
-      ),
-    ).toBe(true)
-  })
-
-  it('should resolve resourceName to the named dataset resource', () => {
-    const resources = {
-      default: {projectId: 'test-project', dataset: 'test-dataset'},
-      secondary: {projectId: 'secondary-project', dataset: 'secondary-dataset'},
-    }
-
-    const {result} = renderHook(() => useDocuments({resourceName: 'secondary'}), {
+  it('should add projectId and dataset to document handles', () => {
+    const {result} = renderHook(() => useDocuments({}), {
       wrapper: ({children}) => (
-        <ResourceProvider resource={resources.default} fallback={null}>
-          <ResourcesContext.Provider value={resources}>{children}</ResourcesContext.Provider>
+        <ResourceProvider projectId="test-project" dataset="test-dataset" fallback={null}>
+          {children}
         </ResourceProvider>
       ),
     })
 
-    expect((result.current.data[0].resource as DatasetResource).projectId).toBe('secondary-project')
-    expect((result.current.data[0].resource as DatasetResource).dataset).toBe('secondary-dataset')
+    // Check that the first document handle has the projectId and dataset
+    expect(result.current.data[0].projectId).toBe('test-project')
+    expect(result.current.data[0].dataset).toBe('test-dataset')
+
+    // Verify all document handles have these properties
     expect(
       result.current.data.every(
-        (doc) =>
-          (doc.resource as DatasetResource).projectId === 'secondary-project' &&
-          (doc.resource as DatasetResource).dataset === 'secondary-dataset',
+        (doc) => doc.projectId === 'test-project' && doc.dataset === 'test-dataset',
       ),
     ).toBe(true)
   })

package/src/hooks/documents/useDocuments.ts

@@ -1,10 +1,16 @@
-import {createGroqSearchFilter, type QueryOptions} from '@sanity/sdk'
+import {
+  createGroqSearchFilter,
+  type DocumentHandle,
+  isDatasetResource,
+  type QueryOptions,
+} from '@sanity/sdk'
+import {pickProperties} from '@sanity/sdk/_internal'
 import {type SortOrderingItem} from '@sanity/types'
-import {pick} from 'lodash-es'
-import {useCallback, useEffect, useMemo, useState} from 'react'
+import {useCallback, useMemo, useState} from 'react'
 
-import {type DocumentHandle, type ResourceHandle} from '../../config/handles'
+import {type ResourceHandle} from '../../config/handles'
 import {useNormalizedResourceOptions} from '../helpers/useNormalizedResourceOptions'
+import {useTrackHookUsage} from '../helpers/useTrackHookUsage'
 import {useQuery} from '../query/useQuery'
 
 const DEFAULT_BATCH_SIZE = 25
@@ -20,9 +26,7 @@ export interface DocumentsOptions<
   TDataset extends string = string,
   TProjectId extends string = string,
 >
-  extends
-    ResourceHandle<TProjectId, TDataset>,
-    Pick<QueryOptions<TDocumentType, TDataset, TProjectId>, 'params'> {
+  extends ResourceHandle<TDataset, TProjectId>, Pick<QueryOptions, 'perspective' | 'params'> {
   /**
    * Filter documents by their `_type`. Can be a single type or an array of types.
    */
@@ -90,16 +94,18 @@ export interface DocumentsResponse<
  * @returns An object containing the list of document handles, the loading state, the total count of retrieved document handles, and a function to load more
  *
  * @remarks
- * - The returned document handles include resource information from the current Sanity instance
+ * - The returned document handles include projectId and dataset information from the current Sanity instance
  * - This makes them ready to use with document operations and other document hooks
- * - The hook automatically uses the correct Sanity instance based on the resource in the options
+ * - The hook automatically uses the correct Sanity instance based on the projectId and dataset in the options
  *
  * @example Basic infinite list with loading more
  * ```tsx
  * import {
  *   useDocuments,
+ *   createDatasetHandle,
+ *   type DatasetHandle,
  *   type DocumentHandle,
- *   type DocumentResource,
+ *   type SortOrderingItem
  * } from '@sanity/sdk-react'
  * import {Suspense} from 'react'
  *
@@ -115,14 +121,14 @@ export interface DocumentsResponse<
  *
  * // Define props for the list component
  * interface DocumentListProps {
- *   resource: DocumentResource
+ *   dataset: DatasetHandle
  *   documentType: string
  *   search?: string
  * }
  *
- * function DocumentList({resource, documentType, search}: DocumentListProps) {
+ * function DocumentList({dataset, documentType, search}: DocumentListProps) {
  *   const { data, hasMore, isPending, loadMore, count } = useDocuments({
- *     resource,
+ *     ...dataset,
  *     documentType,
  *     search,
  *     batchSize: 10,
@@ -136,7 +142,7 @@ export interface DocumentsResponse<
  *         {data.map((docHandle) => (
  *           <li key={docHandle.documentId}>
  *            <Suspense fallback="Loading…">
- *              <MyDocumentComponent doc={docHandle} />
+ *              <MyDocumentComponent docHandle={docHandle} />
  *            </Suspense>
  *           </li>
  *         ))}
@@ -151,7 +157,8 @@ export interface DocumentsResponse<
  * }
  *
  * // Usage:
- * // <DocumentList resource={{projectId: 'p1', dataset: 'production'}} documentType="post" search="Sanity" />
+ * // const myDatasetHandle = createDatasetHandle({ projectId: 'p1', dataset: 'production' })
+ * // <DocumentList dataset={myDatasetHandle} documentType="post" search="Sanity" />
  * ```
  *
  * @example Using `filter` and `params` options for narrowing a collection
@@ -202,8 +209,8 @@ export function useDocuments<
   TDataset,
   TProjectId
 > {
-  const options =
-    useNormalizedResourceOptions<DocumentsOptions<TDocumentType, TDataset, TProjectId>>(rawOptions)
+  useTrackHookUsage('useDocuments')
+  const options = useNormalizedResourceOptions(rawOptions)
   const [limit, setLimit] = useState(batchSize)
   const documentTypes = useMemo(
     () =>
@@ -224,9 +231,11 @@ export function useDocuments<
     types: documentTypes,
     ...options,
   })
-  useEffect(() => {
+  const [prevKey, setPrevKey] = useState(key)
+  if (prevKey !== key) {
+    setPrevKey(key)
     setLimit(batchSize)
-  }, [key, batchSize])
+  }
 
   const filterClause = useMemo(() => {
     const conditions: string[] = []
@@ -276,7 +285,14 @@ export function useDocuments<
     params: {
       ...params,
       // these are passed back to the user as part of each document handle
-      __handle: pick(options, ['resource', 'perspective']),
+      __handle: {
+        // keep projectId/dataset for backward compat until v4; resource is added
+        // intentionally so that hook consumers can resolve the correct resource
+        ...(options.resource && isDatasetResource(options.resource)
+          ? pickProperties(options.resource, ['projectId', 'dataset'])
+          : {}),
+        ...pickProperties(options, ['perspective', 'resource']),
+      },
       __types: documentTypes,
     },
   })

package/src/hooks/helpers/createCallbackHook.test.tsx

@@ -1,7 +1,7 @@
 import {type SanityInstance} from '@sanity/sdk'
+import {renderHook} from '@testing-library/react'
 import {describe, expect, it, vi} from 'vitest'
 
-import {renderHook} from '../../../test/test-utils'
 import {ResourceProvider} from '../../context/ResourceProvider'
 import {createCallbackHook} from './createCallbackHook'
 
@@ -21,7 +21,13 @@ describe('createCallbackHook', () => {
     const useTestHook = createCallbackHook(testCallback)
 
     // Render the hook
-    const {result, rerender} = renderHook(() => useTestHook())
+    const {result, rerender} = renderHook(() => useTestHook(), {
+      wrapper: ({children}) => (
+        <ResourceProvider projectId="p" dataset="d" fallback={null}>
+          {children}
+        </ResourceProvider>
+      ),
+    })
 
     // Test the callback with parameters
     const result1 = result.current('test', 123)
@@ -38,17 +44,13 @@ describe('createCallbackHook', () => {
 
   it('should create new callback when instance changes', () => {
     // Create a test callback
-    const testCallback = (instance: SanityInstance) => instance.config.studio?.projectId
+    const testCallback = (instance: SanityInstance) => instance.config.projectId
 
     // Create and render our hook with first provider
     const useTestHook = createCallbackHook(testCallback)
     const {result, unmount} = renderHook(() => useTestHook(), {
       wrapper: ({children}) => (
-        <ResourceProvider
-          studio={{projectId: 'p1'}}
-          resource={{projectId: 'p1', dataset: 'd'}}
-          fallback={null}
-        >
+        <ResourceProvider projectId="p1" dataset="d" fallback={null}>
           {children}
         </ResourceProvider>
       ),
@@ -64,11 +66,7 @@ describe('createCallbackHook', () => {
     // Re-render with different provider configuration
     const {result: result2} = renderHook(() => useTestHook(), {
       wrapper: ({children}) => (
-        <ResourceProvider
-          studio={{projectId: 'p2'}}
-          resource={{projectId: 'p2', dataset: 'd'}}
-          fallback={null}
-        >
+        <ResourceProvider projectId="p2" dataset="d" fallback={null}>
           {children}
         </ResourceProvider>
       ),
@@ -87,7 +85,7 @@ describe('createCallbackHook', () => {
       method: string,
       data: object,
     ) => ({
-      url: `${instance.config.studio?.projectId}${path}`,
+      url: `${instance.config.projectId}${path}`,
       method,
       data,
     })
@@ -95,11 +93,7 @@ describe('createCallbackHook', () => {
     const useTestHook = createCallbackHook(testCallback)
     const {result} = renderHook(() => useTestHook(), {
       wrapper: ({children}) => (
-        <ResourceProvider
-          studio={{projectId: 'p'}}
-          resource={{projectId: 'p', dataset: 'd'}}
-          fallback={null}
-        >
+        <ResourceProvider projectId="p" dataset="d" fallback={null}>
           {children}
         </ResourceProvider>
       ),

package/src/hooks/helpers/createFetcherHook.test.tsx

@@ -0,0 +1,180 @@
+import {createSanityInstance} from '@sanity/sdk'
+import {defineFetcher, type Fetcher, type FetcherSnapshot} from '@sanity/sdk/_internal'
+import {renderHook} from '@testing-library/react'
+import {of, throwError} from 'rxjs'
+import {beforeEach, describe, expect, it, vi} from 'vitest'
+
+import {useSanityInstance} from '../context/useSanityInstance'
+import {createFetcherHook} from './createFetcherHook'
+
+vi.mock('../context/useSanityInstance', () => ({
+  useSanityInstance: vi.fn(),
+}))
+
+const instance = createSanityInstance({projectId: 'p', dataset: 'd'})
+
+const makeFetcher = (snapshot: FetcherSnapshot<string>): Fetcher<[id: string], string> => {
+  const fetcher = {
+    getState: vi.fn(() => ({
+      subscribe: vi.fn(() => () => {}),
+      getCurrent: () => snapshot,
+      observable: throwError(() => new Error('unexpected usage of observable')),
+    })),
+    resolveState: vi.fn(() => Promise.resolve('resolved')),
+    refetch: vi.fn(() => Promise.resolve('refetched')),
+    invalidate: vi.fn(),
+    invalidateAll: vi.fn(),
+    setData: vi.fn(() => ({undo: vi.fn()})),
+  }
+  return fetcher as unknown as Fetcher<[id: string], string>
+}
+
+const success: FetcherSnapshot<string> = {
+  status: 'success',
+  data: 'DATA',
+  error: undefined,
+  isFetching: false,
+  dataUpdatedAt: 1,
+}
+
+describe('createFetcherHook', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    vi.mocked(useSanityInstance).mockReturnValue(instance)
+  })
+
+  it('returns {data, isFetching, error, refetch} from a success snapshot', () => {
+    const fetcher = makeFetcher(success)
+    const useThing = createFetcherHook(fetcher)
+    const {result} = renderHook(() => useThing('a'))
+
+    expect(result.current.data).toBe('DATA')
+    expect(result.current.isFetching).toBe(false)
+    expect(result.current.error).toBeUndefined()
+    expect(typeof result.current.refetch).toBe('function')
+  })
+
+  it('surfaces isFetching and the background error on the success arm', () => {
+    const boom = new Error('background')
+    const fetcher = makeFetcher({...success, isFetching: true, error: boom})
+    const useThing = createFetcherHook(fetcher)
+    const {result} = renderHook(() => useThing('a'))
+
+    expect(result.current.isFetching).toBe(true)
+    expect(result.current.error).toBe(boom)
+  })
+
+  it('refetch() calls the fetcher with the instance and params', () => {
+    const fetcher = makeFetcher(success)
+    const useThing = createFetcherHook(fetcher)
+    const {result} = renderHook(() => useThing('a'))
+
+    const returned = result.current.refetch()
+
+    expect(fetcher.refetch).toHaveBeenCalledWith(instance, 'a')
+    expect(returned).toBeInstanceOf(Promise)
+  })
+
+  it('suspends on a pending snapshot by throwing resolveState', () => {
+    const fetcher = makeFetcher({
+      status: 'pending',
+      data: undefined,
+      error: undefined,
+      isFetching: true,
+      dataUpdatedAt: undefined,
+    })
+    const useThing = createFetcherHook(fetcher)
+    const {result} = renderHook(() => {
+      try {
+        return useThing('a')
+      } catch (thrown) {
+        return thrown
+      }
+    })
+
+    expect(fetcher.resolveState).toHaveBeenCalledWith(instance, 'a')
+    expect(result.current).toBe(vi.mocked(fetcher.resolveState).mock.results[0]!.value)
+  })
+
+  it('throws the error arm to the error boundary', () => {
+    const boom = new Error('fatal')
+    const fetcher = makeFetcher({
+      status: 'error',
+      data: undefined,
+      error: boom,
+      isFetching: false,
+      dataUpdatedAt: undefined,
+    })
+    const useThing = createFetcherHook(fetcher)
+    const {result} = renderHook(() => {
+      try {
+        return useThing('a')
+      } catch (thrown) {
+        return thrown
+      }
+    })
+
+    expect(result.current).toBe(boom)
+  })
+
+  // Regression: the mocked fetcher above can never reproduce the real bug — its
+  // `getCurrent` returns a fixed snapshot object. A real fetcher store replaces
+  // the cache entry on every (un)subscribe, so `getCurrent` yields a new snapshot
+  // reference each time. Feeding that straight through `useSyncExternalStore`
+  // makes React see the store "change" on every commit and re-render forever
+  // ("Maximum update depth exceeded", React #185).
+  it('does not re-render forever over a real fetcher store (SDK-1448)', () => {
+    const fetcher = defineFetcher<[id: string], string>({
+      name: `regression-loop-${Math.random().toString(36).slice(2)}`,
+      getKey: (_instance, id) => id,
+      fetch: () => (id) => of(`DATA:${id}`),
+    })
+    // Seed a success entry so we skip Suspense and land in useSyncExternalStore.
+    fetcher.setData(instance, ['a'], 'DATA:a')
+
+    const useThing = createFetcherHook(fetcher)
+
+    let renders = 0
+    const {result} = renderHook(() => {
+      renders += 1
+      if (renders > 25) throw new Error(`infinite render loop: ${renders} renders`)
+      return useThing('a')
+    })
+
+    expect(result.current.data).toBe('DATA:a')
+    expect(renders).toBeLessThan(25)
+  })
+
+  // The realistic case: `data` is an object, not a primitive. The store hands
+  // back a fresh snapshot object on every (un)subscribe, so the dedup must keep
+  // returning the *same* `data` reference while the entry is unchanged —
+  // otherwise consumers that key off `data` identity (memo deps, effects)
+  // re-render on every commit even though nothing changed. This is the property
+  // the snapshot-equality check guards.
+  it('keeps a stable object data reference across re-renders (SDK-1448)', () => {
+    const data = {id: 'a', title: 'Thing', tags: ['x', 'y']}
+    const fetcher = defineFetcher<[id: string], typeof data>({
+      name: `regression-object-${Math.random().toString(36).slice(2)}`,
+      getKey: (_instance, id) => id,
+      fetch: () => () => of(data),
+    })
+    fetcher.setData(instance, ['a'], data)
+
+    const useThing = createFetcherHook(fetcher)
+
+    let renders = 0
+    const seen: unknown[] = []
+    const {result} = renderHook(() => {
+      renders += 1
+      if (renders > 25) throw new Error(`infinite render loop: ${renders} renders`)
+      const value = useThing('a')
+      seen.push(value.data)
+      return value
+    })
+
+    expect(result.current.data).toBe(data)
+    expect(renders).toBeLessThan(25)
+    // Every commit observed the identical object — no churn from fresh snapshots.
+    expect(seen.every((d) => d === data)).toBe(true)
+  })
+})

package/src/hooks/helpers/createFetcherHook.ts

@@ -0,0 +1,69 @@
+import {type Fetcher, type FetcherSnapshot, isDeepEqual} from '@sanity/sdk/_internal'
+import {useRef, useSyncExternalStore} from 'react'
+
+import {useSanityInstance} from '../context/useSanityInstance'
+
+/**
+ * The value returned by a fetcher-backed hook. The hook suspends until the
+ * first fetch succeeds, so `data` is always present once your component renders.
+ *
+ * @public
+ */
+export interface FetcherHookResult<TData> {
+  /** The resolved data. Guaranteed present — the hook suspends until the first fetch succeeds. */
+  data: TData
+  /** A fetch for this entry is in flight (background revalidation or a `refetch()`). */
+  isFetching: boolean
+  /** The most recent background-fetch failure while data still renders; cleared by the next success. */
+  error: unknown
+  /** Imperatively refetch, bypassing staleness. Resolves with the refreshed data. */
+  refetch: () => Promise<TData>
+}
+
+/**
+ * Builds a Suspense hook over a {@link Fetcher}: it suspends until the first
+ * success via the snapshot's `status`, throws the error arm to the nearest error
+ * boundary, and returns the live `{data, isFetching, error, refetch}` envelope.
+ *
+ * @internal
+ */
+export function createFetcherHook<TParams extends unknown[], TData>(
+  fetcher: Fetcher<TParams, TData>,
+): (...params: TParams) => FetcherHookResult<TData> {
+  return function useFetcherHook(...params: TParams): FetcherHookResult<TData> {
+    const instance = useSanityInstance()
+    const source = fetcher.getState(instance, ...params)
+
+    // No entry/data yet — suspend on the first fetch (matches an 'error' below never reaching here).
+    if (source.getCurrent().status === 'pending') {
+      throw fetcher.resolveState(instance, ...params)
+    }
+
+    // The store replaces its cache entry on every (un)subscribe (it bumps a
+    // subscription counter), so `getCurrent()` hands back a fresh snapshot object
+    // with identical fields on each commit. Passed raw to `useSyncExternalStore`
+    // — which compares by `Object.is` — that reads as a perpetual change and
+    // re-renders forever. Reuse the previous snapshot while its fields are
+    // unchanged so React sees a stable reference.
+    const previous = useRef<FetcherSnapshot<TData> | null>(null)
+    const snapshot = useSyncExternalStore(source.subscribe, () => {
+      const next = source.getCurrent()
+      const prev = previous.current
+      if (prev && isDeepEqual(prev, next)) return prev
+      previous.current = next
+      return next
+    })
+
+    if (snapshot.status !== 'success') {
+      // 'pending' already suspended above; 'error' surfaces to the error boundary.
+      throw snapshot.status === 'error' ? snapshot.error : fetcher.resolveState(instance, ...params)
+    }
+
+    return {
+      data: snapshot.data,
+      isFetching: snapshot.isFetching,
+      error: snapshot.error,
+      refetch: () => fetcher.refetch(instance, ...params),
+    }
+  }
+}