dotansimha / dotansimha/graphql-code-generator-community
Types for React HOC's throw TS error's
- Dominant language
- TypeScript
- Stars
- 137
- Forks
- 195
- Avg merge
- 6h 20m
- Merged PRs (30d)
- 16
Description
### Which packages are impacted by your issue?
@graphql-codegen/typescript-react-apollo
### Describe the bug
Types generated for HOC components throw `Type 'TProps' does not satisfy the constraint 'Exact<{ first: number; }> | Record'`
### Your Example Website or App
https://github.com/dotansimha/graphql-code-generator/tree/master/examples/react/apollo-client
### Steps to Reproduce the Bug or Issue
1. clone react example repo https://github.com/dotansimha/graphql-code-generator/tree/master/examples/react/apollo-client
2. install 'typescript-operations', 'typescript-react-apollo' plugins
3. change config file to
```
// eslint-disable-next-line import/no-extraneous-dependencies
import { type CodegenConfig } from '@graphql-codegen/cli';
const config: CodegenConfig = {
schema: 'https://swapi-graphql.netlify.app/.netlify/functions/index',
documents: ['src/**/*.tsx'],
generates: {
'./src/gql/types.ts': {
plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
config: {
withHOC: true
},
},
},
};
export default config;
```
4. run `npm run codegen`
5. observe typescript errors in `src/gql/types.ts`

### Expected behavior
Generated types don't throw typescript errors
### Screenshots or Videos
_No response_
### Platform
- OS: macOS,
- NodeJS: 16,
- `graphql` version: 16.6.0,
- "@graphql-codegen/cli": "^3.3.0",
- "@graphql-codegen/typescript-operations": "^3.0.3",
- "@graphql-codegen/typescript-react-apollo": "^3.3.7",
### Codegen Config File
```
// eslint-disable-next-line import/no-extraneous-dependencies
import { type CodegenConfig } from '@graphql-codegen/cli';
const config: CodegenConfig = {
schema: 'https://swapi-graphql.netlify.app/.netlify/functions/index',
documents: ['src/**/*.tsx'],
generates: {
'./src/gql/types.ts': {
plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
config: {
withHOC: true
},
},
},
};
export default config;
```
### Additional context
package.json:
```
{
"name": "example-react-apollo-client",
"version": "0.1.0",
"private": true,
"dependencies": {
"@apollo/client": "^3.6.9",
"graphql": "^16.6.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@graphql-codegen/cli": "^3.3.0",
"@graphql-codegen/typescript-operations": "^3.0.3",
"@graphql-codegen/typescript-react-apollo": "^3.3.7",
"@types/jest": "^27.5.2",
"@types/node": "^18.11.18",
"@types/react": "^18.0.15",
"@types/react-dom": "^18.0.10",
"@vitejs/plugin-react": "^3.1.0",
"cypress": "12.9.0",
"serve": "14.2.0",
"start-server-and-test": "2.0.0",
"typescript": "5.0.4",
"vite": "^4.1.0"
},
"scripts": {
"dev": "vite",
"build": "vite build",
"start": "serve -s dist",
"test": "cypress run",
"test:end2end": "start-server-and-test start http://localhost:3000 test",
"codegen": "graphql-codegen --config codegen.ts"
}
}
```
generated types file:
[types.ts.zip](https://github.com/dotansimha/graphql-code-generator-community/files/11214349/types.ts.zip)
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.