dotansimha / dotansimha/graphql-code-generator-community
Typescript React Query v5 wrong type infinite query
- Dominant language
- TypeScript
- Stars
- 137
- Forks
- 195
- Avg merge
- 6h 20m
- Merged PRs (30d)
- 16
Description
### Which packages are impacted by your issue?
_No response_
### Describe the bug
Hi,
I also have an issue with infinite query. I tried upgrading to the last version.
I think this type is wrong
export function useInfiniteQuery<
TQueryFnData,
TError = DefaultError,
TData = InfiniteData,
TQueryKey extends QueryKey = QueryKey,
TPageParam = unknown,
>
Is it the good type for TData @TkDodo @neil585456525 ?
The TData = InfiniteData, should it be only TQueryFnData ?
because with the version 6.0.0 all my infinite queries types in typescript does not match what is really returned.
I have a strange typescript error on what I should have on my result data. I should have an array
{
pageParams : ... [],
pages: {
pageParams : unknown[],
pages: result[]
}[]
}
but what I really have is not an array
{
pageParams : ...,
pages: result[]
}
This type is used for the result and it already use InfiniteData. So I thinks it should not be in the useInfiniteQuery type params
export interface InfiniteQueryObserverSuccessResult<
TData = unknown,
TError = unknown,
> extends InfiniteQueryObserverBaseResult {
data: InfiniteData
error: null
isError: false
isLoading: false
isLoadingError: false
isRefetchError: false
isSuccess: true
status: 'success'
}
Thanks for your help!
### Your Example Website or App
https://codesandbox.io/p/devbox/wild-water-xrq5tp?file=%2Ftypes.ts%3A90%2C5
### Steps to Reproduce the Bug or Issue
Go to types find useInfiniteUserQuery
Types is
```
<
TData = InfiniteData,
TError = unknown
>
```
### Expected behavior
But should be
```
<
TData =UserQuery,
TError = unknown
>
```
### Screenshots or Videos
_No response_
### Platform
- OS: Mac 0S 14.0
- NodeJS: 20.10.0
"@graphql-codegen/add": "^5.0.0",
"@graphql-codegen/cli": "^4.0.1",
"@graphql-codegen/typescript": "^4.0.1",
"@graphql-codegen/typescript-operations": "^4.0.1",
"@graphql-codegen/typescript-react-query": "^6.0.0",
### Codegen Config File
import { CodegenConfig } from "@graphql-codegen/cli";
const config: CodegenConfig = {
schema: "schema.graphql",
documents: "document.graphql",
generates: {
"types.ts": {
plugins: [
"typescript",
"typescript-operations",
"typescript-react-query",
],
config: {
reactQueryVersion: 5,
legacyMode: false,
addInfiniteQuery: true,
},
},
},
};
export default config;
### Additional context
_No response_
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the linked CodeSandbox, generated types.ts, and the useInfiniteUserQuery example, then inspect the typescript-react-query configuration using reactQueryVersion: 5 and addInfiniteQuery: true. Compare the generated useInfiniteQuery generics with InfiniteQueryObserverSuccessResult and confirm the expected result types compile without mismatch.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- graphql, typescript
- Domain
- tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100