useQueries does not infer correct type for select parameter – data is typed as unknown

[Junnis0123]

Describe the bug

When using useQueries in React Query v5 with TypeScript, the select function’s input parameter data is inferred as unknown, even though the return type of queryFn should be known.

This leads to an unintuitive developer experience where data must be manually typed or casted, despite the fact that the shape of the data is already known via queryFn.

This does not happen in useQuery, which correctly infers the type of data passed to select.

Your minimal, reproducible example

https://www.typescriptlang.org/play/?#code/MYewdgzgLgBATgUwgVwDZQjAvDZEECKyCcAlkgBQDeAUDDAI7FlIBcMA2nfTLTz0xIBPANIIh7DgHIEADwCGAWwAOqBFIC6AGm79BcIQDEw7CgEpsAPhgAFOCEWl8AOkQQQqAG4JqMeeykACwRUVBApLRgAI3YAFgAmGABfMx1+enw1YChTABN5KHkLLGt8wud5SIB6KphAGXIYMvkYJxgpZDAAazAQAHcwKV1k7g0aFIBuIA

Steps to reproduce

1. Create a React component using useQueries
2. Pass an array with a query using queryFn that returns an object
3. Add a select function like (data) => data.a
4. Hover data in an IDE or let TypeScript check its type
5. Observe that data is inferred as unknown

Expected behavior

I expected the data parameter in the select function to be inferred based on the return type of queryFn, just like it is in useQuery. This would enable proper autocomplete and type checking without requiring manual type assertions or annotations.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: macOS 14.5
• IDE: VSCode

Tanstack Query adapter

None

TanStack Query version

v5.66.9

TypeScript version

5.2.2

Additional context

This issue breaks the type inference parity between useQuery and useQueries.

Similar issues have been raised in the past (#3994, #6556, #7270), but this problem remains in React Query v5 and may require a fresh look.

Even though the select function’s return type is inferred, the input data is not — likely because the UseQueryOptions<TQueryFnData, TError, TData> is defaulting to unknown when used in a dynamic array (useQueries).

A fix (or improved inference strategy) would significantly improve DX when using select with useQueries.

[imrrohitt]

I’ve been investigating the TypeScript inference issue with useQueries in React Query v5 where the select function’s data parameter is incorrectly typed as unknown despite the queryFn return type being known.

I’d like to work on a fix for this issue to improve type safety and maintain consistency with useQuery. I’ve already analyzed the problem and believe I can propose a solution that preserves proper type inference in dynamic query arrays.

Could you please assign this bug to me? I’d be happy to submit a PR once I have a working solution.

[TkDodo]

Could you please assign this bug to me?

No cookie licking. If you want to work on it, just do it.

[TkDodo]

The best workaround right now is to wrap it in queryOptions:

const results = useQueries({
  queries: [
    queryOptions({
      queryKey: ['example'],
      queryFn: () => Promise.resolve({ a: 'hello', b: 42 }),
      select: (data) => data.a,
    }),
  ],
})

fixed playground

[konhi]

debugging note: this is related to that type which incorrectly fallbacks

// packages/react-query/src/useQueries.ts

type GetUseQueryOptionsForUseQueries<T> =
  // Part 1: responsible for applying explicit type parameter to function arguments, if object { queryFnData: TQueryFnData, error: TError, data: TData }
  T extends {
    queryFnData: infer TQueryFnData
    error?: infer TError
    data: infer TData
  }
    ? UseQueryOptionsForUseQueries<TQueryFnData, TError, TData>
    : T extends { queryFnData: infer TQueryFnData; error?: infer TError }
      ? UseQueryOptionsForUseQueries<TQueryFnData, TError>
      : T extends { data: infer TData; error?: infer TError }
        ? UseQueryOptionsForUseQueries<unknown, TError, TData>
        : // Part 2: responsible for applying explicit type parameter to function arguments, if tuple [TQueryFnData, TError, TData]
          T extends [infer TQueryFnData, infer TError, infer TData]
          ? UseQueryOptionsForUseQueries<TQueryFnData, TError, TData>
          : T extends [infer TQueryFnData, infer TError]
            ? UseQueryOptionsForUseQueries<TQueryFnData, TError>
            : T extends [infer TQueryFnData]
              ? UseQueryOptionsForUseQueries<TQueryFnData>
              : // Part 3: responsible for inferring and enforcing type if no explicit parameter was provided
                T extends {
                    queryFn?:
                      | QueryFunction<infer TQueryFnData, infer TQueryKey>
                      | SkipTokenForUseQueries
                    select?: (data: any) => infer TData
                    throwOnError?: ThrowOnError<any, infer TError, any, any>
                  }
                ? UseQueryOptionsForUseQueries<
                    TQueryFnData,
                    unknown extends TError ? DefaultError : TError,
                    unknown extends TData ? TQueryFnData : TData,
                    TQueryKey
                  >
                : // Fallback
                  // !!! conditional fails, this is what is being used as a type
                  UseQueryOptionsForUseQueries

[TkDodo]

let’s track this in:

• Type checking select works differently on useQueries compared to useQuery #6556