Typing queries

[gavinthomas-valtech]

I'm using the orval.dev codegen tooling which generates all the types and models for api's. This means i can't edit them and all logic goes into hooks

How do i get typing for hooks? if i use useQuery directly i get full inference but if i eference the query key factory in a hook i lose this. What do i need to do to get typing in the hook?

[lukemorales]

@gavinthomas-valtech I'm not familiar with orval codegen, so I'm lacking some context here.
Can you share a reproduction in a codesandbox?

[gavinthomas-valtech]

hiya. The example i found is here

https://github.com/profydev/prolog-app/tree/end-to-end-types

based on https://profy.dev/article/react-openapi-typescript

example here: https://codesandbox.io/p/github/trickydisco78/prolog-app/end-to-end-types?workspaceId=2f001bc8-600a-4bdb-bd50-6e3b30f8dee8&file=%2Ffeatures%2Fissues%2Fapi%2Fuse-get-issues.tsx&selection=%5B%7B%22endColumn%22%3A41%2C%22endLineNumber%22%3A3%2C%22startColumn%22%3A41%2C%22startLineNumber%22%3A3%7D%5D

looks like they are typing against useQuery in a hook

Essentially orval in my case is doing the same. It's generating api code like this

export const createApplication = (
  thing: string,
  thingApplicationBody: thingTypeApplicationBody
) => {
  return apiClient<InitialThingResponse>({
    url: `/thing/thing{$thing}/`,
    method: 'post',
    headers: { 'Content-Type': 'application/json' },
    data: thingTypeApplicationBody,
  });
};

i then consume this api inside the query key factory. When i use the hook (that isn't typed) i don't see an inference in the component it's used

[gavinthomas-valtech]

wondering if i need to use the type thingTypeApplicationBody or InitialThingResponse rather than the query key factory inferring it?

[gavinthomas-valtech]

I was slightly confused where i would use this kind of thing? in the hook?

export type TodosKeys = inferQueryKeys<typeof todos>;

[gavinthomas-valtech]

Looks like this won't be able to infer the response?

[lukemorales]

Your codesandbox appears to be private, can you make it public so I can access it?