dotansimha / dotansimha/graphql-code-generator
namingConvention shouldn't affect documentVariablePrefix/Suffix
- Dominant language
- TypeScript
- Stars
- 11.3k
- Forks
- 1.4k
- Avg merge
- 1d 1h
- Merged PRs (30d)
- 23
Description
### Which packages are impacted by your issue?
@graphql-codegen/visitor-plugin-common
### Describe the bug
`namingConvention` is supposed to affect **type names** (`typeNames`) and **enum value names** (`enumValues`) only.
However, **variable names** created with `typed-document-node` for operations are also affected by the option, which is not expected.
### Your Example Website or App
https://stackblitz.com/edit/github-xc1bjj?file=types.ts
### Steps to Reproduce the Bug or Issue
In the Stackblitz example, set the `namingConvention` and run `npm run generate` to test the following scenarios:
## `namingConvention: { typeNames: "change-case-all#pascalCase" }` (default)
```ts
export const GqluserDocument = … // should be [g]ql[U]serDocument
export const GqldeleteUserDocument = … // should be [g]ql[D]eleteUserDocument
export const GqlDeleteUserUppercaseDocument = … // should be [g]qlDeleteUserUppercaseDocument
export type MutationDeleteUserArgs = … // good, as expected
export type QueryUserArgs = … // good, as expected
```
## `namingConvention: { typeNames: "keep" }`
```ts
export const gqluserDocument = … // bad, but as expected
export const gqldeleteUserDocument = … // bad, but as expected
export const gqlDeleteUserUppercaseDocument = … // good, as expected
export type MutationdeleteUserArgs = … // bad, but as expected?
export type QueryuserArgs = … // bad, but as expected?
```
### Expected behavior
With `namingConvention: { typeNames: "change-case-all#pascalCase" }` (default) I expect:
- Types start uppercase.
- Explicit prefixes and suffixes remain exactly as defined. I chose a lowercase prefix here because these are used for variable names, not type names.
```ts
export const gqlUserDocument = … // good, as expected
export const gqlDeleteUserDocument = … // good, as expected
export const gqlDeleteUserUppercaseDocument = … // good, as expected
export type MutationDeleteUserArgs = … // good, as expected
export type QueryUserArgs = … // good, as expected
```
**It's impossible to achieve that consistency easily** with the currently available config options. Either the `gql` prefix starts uppercase or the `…Args` types are lowercase after `Mutation` and `Query`. The only alternative is to write my own conversion function that checks if the string (which can be either a type or a variable name) starts with my prefix and then treat that in a special way.
Also, I need to write all operation names in uppercase in the GraphQL document in order to achieve `gqlUserDocument` instead of `gqluserDocument`, which seems odd.
--
This happens because `documentVariablePrefix/Suffix` are passed as `prefix/suffix` to the `convertName` and thus converted as if they're part of the type name. They should instead be applied **after** converting the type name.
https://github.com/dotansimha/graphql-code-generator/blob/39e6e80903e325eb0ddf040389c214428c9362e9/packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts#L743-L749
### Screenshots or Videos
_No response_
### Platform
- OS: macOS, Linux
- NodeJS: 22.2.0, 18.20.3
- `graphql` version: 16.8.1, 16.2.0
- `@graphql-codegen/cli`: 5.0.2
- `@graphql-codegen/near-operation-file-preset`: 3.0.0
- `@graphql-codegen/typed-document-node`: 5.0.7
- `@graphql-codegen/typescript`: 4.0.7
- `@graphql-codegen/typescript-operations`: 4.2.1
- `@graphql-typed-document-node/core`: 3.2.0
### Codegen Config File
```ts
import { CodegenConfig } from '@graphql-codegen/cli';
const config: CodegenConfig = {
config: {
documentVariablePrefix: 'gql',
namingConvention: {
typeNames: 'change-case-all#pascalCase',
},
},
schema: 'schema.graphql',
documents: 'document.graphql',
generates: {
'types.ts': {
plugins: ['typed-document-node', 'typescript', 'typescript-operations'],
},
},
};
export default config;
```
### Additional context
### Schema
```gql
type Mutation {
deleteUser(id: ID!): Boolean
}
type Query {
user(id: ID!): User!
}
type User {
id: ID!
username: String!
email: String!
}
```
### Document
```gql
query user {
user(id: 1) {
id
username
email
}
}
mutation deleteUser($id: ID!) {
deleteUser(id: $id)
}
mutation DeleteUserUppercase($id: ID!) {
deleteUser(id: $id)
}
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.