TData is unknown when passing object to useQuery

[luizeboli]

version: 4.29.5
typescript: 5.0.2

---

Hi guys, I'm struggling with react-query in typescript, pretty sure lack of knowledge from my side.

I'm trying to use useQuery as this article suggests: https://tkdodo.eu/blog/react-query-meets-react-router

const createPermissionUsersQuery = ({ id }) => ({
    queryKey: ['get-permission-users', id],
    queryFn: () => axiosInstance.get<CustomPermissionUsers>('/permissions/users', { params: { levelId: id } }),
})

 const { data } = useQuery({ ...createPermissionUsersQuery({ id }) })

I'm not passing initialData because it doesn't exist on my context.

The problem with this approach is data is of type unknown. I've tried with a plain object just for testing and the result was the same:

// This also makes `data` unknown
const query = {
    queryKey: ['get-permission-users'],
    queryFn: () => axiosInstance.get<CustomPermissionUsers>('/permissions/users'),
})

Is there any way I can get this to work?

[luizeboli]

This was a mistake from my side, as I was expecting...I had a reusable select function that expects a generic

export const select = <T>(data: AxiosResponse<T>): T => data.data

I was not passing this type argument