diff --git a/docs/framework/preact/reference/functions/useInfiniteQuery.md b/docs/framework/preact/reference/functions/useInfiniteQuery.md index 0201330bc3..a05cc3914f 100644 --- a/docs/framework/preact/reference/functions/useInfiniteQuery.md +++ b/docs/framework/preact/reference/functions/useInfiniteQuery.md @@ -263,7 +263,7 @@ function Projects() { function useInfiniteQuery(options, queryClient?): UseInfiniteQueryResult; ``` -Defined in: [preact-query/src/useInfiniteQuery.ts:390](https://github.com/TanStack/query/blob/main/packages/preact-query/src/useInfiniteQuery.ts#L390) +Defined in: [preact-query/src/useInfiniteQuery.ts:344](https://github.com/TanStack/query/blob/main/packages/preact-query/src/useInfiniteQuery.ts#L344) The options for `useInfiniteQuery` are identical to `useQuery`, with the addition of `queryFn`, `initialPageParam`, `getNextPageParam`, `getPreviousPageParam`, and `maxPages`. @@ -416,51 +416,6 @@ function Projects() { } ``` -Warming the cache on hover, so `` has data as soon as it's clicked. Requires an -[infiniteQueryOptions](infiniteQueryOptions.md) factory, so the hook and the imperative call share the same cache entry: -```tsx -import { - infiniteQueryOptions, - noop, - useInfiniteQuery, - useQueryClient, -} from '@tanstack/preact-query' - -const commentsOptions = (postId: string) => - infiniteQueryOptions({ - queryKey: ['post', postId, 'comments'], - queryFn: ({ pageParam }) => fetchComments(postId, pageParam), - initialPageParam: 0, - getNextPageParam: (lastPage) => lastPage.nextId, - }) - -function Comments({ postId }: { postId: string }) { - const { data, isPending, isError, error } = useInfiniteQuery(commentsOptions(postId)) - - if (isPending) return 'Loading...' - if (isError) return Error: {error.message} - - return ( -
    - {data.pages.map((page) => page.comments.map((c) =>
  • {c.text}
  • ))} -
- ) -} - -function PostLink({ postId, title }: { postId: string; title: string }) { - const queryClient = useQueryClient() - - return ( - queryClient.infiniteQuery(commentsOptions(postId)).catch(noop)} - > - {title} - - ) -} -``` - A query that's disabled, type safe, until `postId` is set — pass `skipToken` as `queryFn` instead of setting `enabled: false`: ```tsx diff --git a/docs/framework/preact/reference/functions/useQuery.md b/docs/framework/preact/reference/functions/useQuery.md index 99347676cd..4f002e036d 100644 --- a/docs/framework/preact/reference/functions/useQuery.md +++ b/docs/framework/preact/reference/functions/useQuery.md @@ -190,7 +190,7 @@ function Posts() { function useQuery(options, queryClient?): UseQueryResult; ``` -Defined in: [preact-query/src/useQuery.ts:293](https://github.com/TanStack/query/blob/main/packages/preact-query/src/useQuery.ts#L293) +Defined in: [preact-query/src/useQuery.ts:261](https://github.com/TanStack/query/blob/main/packages/preact-query/src/useQuery.ts#L261) ### Type Parameters @@ -358,34 +358,3 @@ function Posts() { ) } ``` - -Warming the cache on hover, so `` has data as soon as it's clicked. Requires a -[queryOptions](queryOptions.md) factory, so the hook and the imperative call share the same cache entry: -```tsx -import { noop, queryOptions, useQuery, useQueryClient } from '@tanstack/preact-query' - -const postOptions = (id: string) => - queryOptions({ - queryKey: ['post', id], - queryFn: () => fetchPost(id), - }) - -function Post({ id }: { id: string }) { - const { data, isError, error } = useQuery(postOptions(id)) - if (isError) return Error: {error.message} - return

{data?.title}

-} - -function PostLink({ id, title }: { id: string; title: string }) { - const queryClient = useQueryClient() - - return ( - queryClient.query(postOptions(id)).catch(noop)} - > - {title} - - ) -} -``` diff --git a/packages/preact-query/src/useInfiniteQuery.ts b/packages/preact-query/src/useInfiniteQuery.ts index 36e1514d37..2de6ebb9db 100644 --- a/packages/preact-query/src/useInfiniteQuery.ts +++ b/packages/preact-query/src/useInfiniteQuery.ts @@ -312,52 +312,6 @@ export function useInfiniteQuery< * ``` * * @example - * Warming the cache on hover, so `` has data as soon as it's clicked. Requires an - * {@link infiniteQueryOptions} factory, so the hook and the imperative call share the same cache entry: - * ```tsx - * import { - * infiniteQueryOptions, - * noop, - * useInfiniteQuery, - * useQueryClient, - * } from '@tanstack/preact-query' - * - * const commentsOptions = (postId: string) => - * infiniteQueryOptions({ - * queryKey: ['post', postId, 'comments'], - * queryFn: ({ pageParam }) => fetchComments(postId, pageParam), - * initialPageParam: 0, - * getNextPageParam: (lastPage) => lastPage.nextId, - * }) - * - * function Comments({ postId }: { postId: string }) { - * const { data, isPending, isError, error } = useInfiniteQuery(commentsOptions(postId)) - * - * if (isPending) return 'Loading...' - * if (isError) return Error: {error.message} - * - * return ( - *
    - * {data.pages.map((page) => page.comments.map((c) =>
  • {c.text}
  • ))} - *
- * ) - * } - * - * function PostLink({ postId, title }: { postId: string; title: string }) { - * const queryClient = useQueryClient() - * - * return ( - * queryClient.infiniteQuery(commentsOptions(postId)).catch(noop)} - * > - * {title} - * - * ) - * } - * ``` - * - * @example * A query that's disabled, type safe, until `postId` is set — pass `skipToken` as `queryFn` * instead of setting `enabled: false`: * ```tsx diff --git a/packages/preact-query/src/useQuery.ts b/packages/preact-query/src/useQuery.ts index 72f957016a..dfa19538c1 100644 --- a/packages/preact-query/src/useQuery.ts +++ b/packages/preact-query/src/useQuery.ts @@ -257,38 +257,6 @@ export function useQuery< * ) * } * ``` - * - * @example - * Warming the cache on hover, so `` has data as soon as it's clicked. Requires a - * {@link queryOptions} factory, so the hook and the imperative call share the same cache entry: - * ```tsx - * import { noop, queryOptions, useQuery, useQueryClient } from '@tanstack/preact-query' - * - * const postOptions = (id: string) => - * queryOptions({ - * queryKey: ['post', id], - * queryFn: () => fetchPost(id), - * }) - * - * function Post({ id }: { id: string }) { - * const { data, isError, error } = useQuery(postOptions(id)) - * if (isError) return Error: {error.message} - * return

{data?.title}

- * } - * - * function PostLink({ id, title }: { id: string; title: string }) { - * const queryClient = useQueryClient() - * - * return ( - * queryClient.query(postOptions(id)).catch(noop)} - * > - * {title} - * - * ) - * } - * ``` */ export function useQuery< TQueryFnData = unknown,