useQueries combined data is never undefined in contrast to useQuery

[nop33]

I run into a type error when one of my combine functions of a useQueries is returning an object (by reducing the results array into a object so that I can use IDs as keys for faster search) and I try to access a property of that object. It happened that that object was undefined. So, I am curious, shouldn't data returned by combine also be undefined, like the data from useQuery is?

Here is a simple example with number:

Typescript playground

import { useQueries, useQuery } from '@tanstack/react-query';

export const useOneThing = () => {
    const num = 1
    const { data } = useQuery({
        queryKey: ['things', num],
        queryFn: () => Promise.resolve(num)
    })

    // data is "number | undefined" so I can't just call foobar(data) without
    // checking if data is defined, which is expected, all good.
    if (data) {
        foobar(data)
    }
    
}

export const useManyThingsReduced = () => {
    const nums = [1, 2, 3]
    const { data } = useQueries({
        queries: nums.map((num) => ({
            queryKey: ['things', num],
            queryFn: () => Promise.resolve(num)
        })),
        combine: (results) => ({
            data: results.reduce((acc, result) => acc + (result.data ?? 0), 0)
        })
    })

    // data is never "undefined", but in reality it will be if the queries have
    // not yet returned and combine hasn't run, so this line will throw a type
    // error in that case when executing
    foobar(data)
}

const foobar = (value: number) => {
  console.log(value)
}

[TkDodo]

yes, this is likely wrong. Would you like to fix it & add some tests?

[TkDodo]

on second thought - can you make a runtime reproduction for this please? We always run combine, even on the first render cycle. You would likely get results into combine where data is still undefined, but that means you should have an array with data: 0 and not undefined as a result of useQueries ....

[nop33]

That's indeed what I get (0) when I try to reproduce the type error I got in my application. I will keep trying to reproduce, maybe I'll share a more realistic example taken directly from my app. Thanks for your response.

[nop33]

I really can't reproduce it. Here's what I tried: https://stackblitz.com/edit/vitejs-vite-31qcuh?file=src%2FApp.tsx

I'll keep an eye on it and come back to this thread if I see something. Thanks a lot, much obliged!