Update client codegen doc to match v6 release#13162
Conversation
|
|
|
Important Review skippedAuto incremental reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Repository UI (base), Organization UI (inherited) Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughReworked GraphQL Codegen docs: removed the Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Warning Review ran into problems🔥 ProblemsTimed out fetching pipeline failures after 30000ms Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
commit: |
| plugins: ["typescript"], | ||
| plugins: ["typescript-operations"], | ||
| config: { | ||
| // This avoids generating operation types, which are generated in the near-operation file. |
There was a problem hiding this comment.
Open for suggestions if this doesn't quite follow the other comment's format/tone/language
There was a problem hiding this comment.
As a reader, the current wording makes me question if we still need that "./src/types/__generated__/graphql.ts" file at all if all we add is typescript-operations and then immediately set generateOperationTypes: false
So if it's still needed, could you add a bit more context about what it still does?
There was a problem hiding this comment.
Also, if it's really just there because near-operation-file needs a file to be there, but the content actually doesn't matter, could we maybe just have this be a setup with a static comment in it explaining that this file is temporarily required and can be removed in the future?
There was a problem hiding this comment.
Good questions! This made me rethink what we should recommend to our users.
There are 2 ways to set up near-operation-file-preset now (details in the migration guide):
- Use a shared schema type file (currently mentioned in this doc)
- Generate schema types (used Enums and Input) into every near-operation file
generates: {
'src/': {
preset: 'near-operation-file',
plugins: ['typescript-operations'],
config: {
// ... Apollo Client options here
}
}
}
Option 2 would be my recommended approach because (1) it has a simpler setup and (2) the duplicated generated schema types are removed at runtime.
Mentioning both options in this doc can make it very verbose. How do you feel if we start recommending option 2?
There was a problem hiding this comment.
Thinking about it more, I'll keep the current recommendation for now.
This is because the rest of the section talks about sharing types, which the config achieves.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
docs/source/development-testing/graphql-codegen.mdx (1)
154-156: Consider adopting style guide suggestions for code comments.Static analysis flagged minor style improvements for comments. The suggested changes use imperative voice and avoid trailing punctuation in fragments.
✏️ Optional style improvements
config: { - // This avoids generating operation types, which are generated in the near-operation file. + // Avoid generating operation types; these are generated in the near-operation file generateOperationTypes: false } }, "./src/": { preset: "near-operation-file", plugins: ["typescript-operations"], // Note: these config options moved from the other generated file config config: { - // This should be the file generated by the "typescript-operations" plugin above, + // Use the file generated by the `typescript-operations` plugin above, // relative to the current working directory.Also applies to: 163-165
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 154 - 156, Update the inline comment above the GraphQL Codegen option generateOperationTypes to follow the style guide: rewrite it in imperative voice and remove trailing punctuation (e.g., change "This avoids generating operation types, which are generated in the near-operation file." to something like "Avoid generating operation types; they are produced in the near-operation file"). Apply the same change to the similar comment at the other occurrence (lines referencing the same generateOperationTypes setting).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Line 165: The path string in the GraphQL codegen config for
importSchemaTypesFrom has a typo: `importSchemaTypesFrom:
"./src/types/__generated__/graphql,ts"` uses a comma instead of a period; update
the value used by the importSchemaTypesFrom setting (look for the
importSchemaTypesFrom key in this file) to use a proper extension
(`./src/types/__generated__/graphql.ts`) so the file reference resolves
correctly.
- Line 252: The config key importSchemaTypesFrom has a typo in its path string:
"./src/types/__generated__/graphql,ts" uses a comma instead of a period; update
the string value for importSchemaTypesFrom to use the correct file extension
(graphql.ts) so the path reads "./src/types/__generated__/graphql.ts" ensuring
the generated types import resolves correctly.
---
Nitpick comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Around line 154-156: Update the inline comment above the GraphQL Codegen
option generateOperationTypes to follow the style guide: rewrite it in
imperative voice and remove trailing punctuation (e.g., change "This avoids
generating operation types, which are generated in the near-operation file." to
something like "Avoid generating operation types; they are produced in the
near-operation file"). Apply the same change to the similar comment at the other
occurrence (lines referencing the same generateOperationTypes setting).
ℹ️ Review info
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/source/development-testing/graphql-codegen.mdx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: Compare Build Output
- GitHub Check: Api-Extractor
- GitHub Check: Build and Test
🧰 Additional context used
🧠 Learnings (3)
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Use the apollo-client skill when answering questions about Apollo Client setup, configuration, usage, or troubleshooting
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to tsconfig*.json : Configure TypeScript with strict mode enabled, NodeNext module resolution, ESNext target, and use separate tsconfig files for main, build, and test configurations
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
🪛 GitHub Check: AI Style Review
docs/source/development-testing/graphql-codegen.mdx
[notice] 154-154: docs/source/development-testing/graphql-codegen.mdx#L154
Structural Elements: Comments should match the current indentation level and be written above the line they apply to. Avoid ending fragments with punctuation.
// Avoid generating operation types; these are generated in the near-operation file
[notice] 163-163: docs/source/development-testing/graphql-codegen.mdx#L163
Framing: Use imperative verbs for instructions.
Structural Elements: Comments should match the current indentation level and be written above the line they apply to. Avoid ending fragments with punctuation.
Text Formatting: Use code font for plugin names.
Verb Tense and Voice: Use present tense instead of 'should be'.
Voice: Use authoritative language like 'Use' instead of 'This should be'.
Word and Symbol Usage: Avoid 'above'; use 'preceding' for body text.
// Use the file generated by the "typescript-operations" plugin above,
[notice] 241-241: docs/source/development-testing/graphql-codegen.mdx#L241
Structural Elements: Comments should match the current indentation level and be written above the line they apply to. Avoid ending fragments with punctuation.
// Avoid generating operation types; these are generated in the near-operation file
[notice] 250-250: docs/source/development-testing/graphql-codegen.mdx#L250
Framing: Use imperative verbs for instructions.
Structural Elements: Comments should match the current indentation level and be written above the line they apply to. Avoid ending fragments with punctuation.
Text Formatting: Use code font for plugin names.
Verb Tense and Voice: Use present tense instead of 'should be'.
Voice: Use authoritative language like 'Use' instead of 'This should be'.
Word and Symbol Usage: Avoid 'above'; use 'preceding' for body text.
// Use the file generated by the "typescript-operations" plugin above,
🔇 Additional comments (4)
docs/source/development-testing/graphql-codegen.mdx (4)
23-23: LGTM!The package installation is updated correctly to remove the now-unnecessary
@graphql-codegen/typescriptpackage for v6.
43-43: LGTM!Plugin configuration correctly updated to use only
typescript-operationsfor v6.
239-243: Same configuration pattern as earlier—looks correct.Assuming the
generateOperationTypesoption is valid per the earlier verification.
152-156: No action needed —generateOperationTypes: falseis a valid v6 configuration option.The
generateOperationTypes: falseconfig option for thetypescript-operationsplugin is documented in the official GraphQL Codegen v6 migration guide. It is correctly used to generate only shared types (inputs/enums/scalars) without operation result/variable types, as shown in the documented examples.
| // relative to the current working directory. | ||
| importSchemaTypesFrom: "./src/types/__generated__/graphql,ts", |
There was a problem hiding this comment.
Main difference of importSchemaTypesFrom compared to the baseTypesPath is importSchemaTypesFrom is not relative from the preset's path.
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
docs/source/development-testing/graphql-codegen.mdx (1)
163-165: Optional wording cleanup for repeated config comments.The duplicated comment text is clear, but you can tighten style/tone by using directive language and avoiding “above.”
✍️ Suggested wording
- // This should be the file generated by the "typescript-operations" plugin above, + // Use the file generated by the "typescript-operations" plugin in the preceding block,Also applies to: 250-252
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 163 - 165, Update the duplicated explanatory comment around the importSchemaTypesFrom setting to use directive language and remove the word “above” (e.g., change "This should be the file generated by the 'typescript-operations' plugin above" to "Use the file generated by the 'typescript-operations' plugin"), and apply the same wording change to the other identical comment near the other graphql-codegen config block; locate the comments adjacent to importSchemaTypesFrom ("./src/types/__generated__/graphql.ts") and the matching repeated comment and replace with the tightened directive phrasing.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Line 23: The install guidance is inconsistent: the top command now installs
only `@graphql-codegen/cli` and `@graphql-codegen/typescript-operations` but the
later sentence still mentions both `@graphql-codegen/typescript` and
`@graphql-codegen/typescript-operations`; update that sentence to reference only
`@graphql-codegen/typescript-operations` (and `@graphql-codegen/cli` if you mention
packages) so the doc consistently recommends the same packages throughout.
---
Nitpick comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Around line 163-165: Update the duplicated explanatory comment around the
importSchemaTypesFrom setting to use directive language and remove the word
“above” (e.g., change "This should be the file generated by the
'typescript-operations' plugin above" to "Use the file generated by the
'typescript-operations' plugin"), and apply the same wording change to the other
identical comment near the other graphql-codegen config block; locate the
comments adjacent to importSchemaTypesFrom
("./src/types/__generated__/graphql.ts") and the matching repeated comment and
replace with the tightened directive phrasing.
ℹ️ Review info
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/source/development-testing/graphql-codegen.mdx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: Api-Extractor
- GitHub Check: Compare Build Output
- GitHub Check: Build and Test
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Follow existing code style enforced by ESLint and Prettier
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Use the apollo-client skill when answering questions about Apollo Client setup, configuration, usage, or troubleshooting
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to tsconfig*.json : Configure TypeScript with strict mode enabled, NodeNext module resolution, ESNext target, and use separate tsconfig files for main, build, and test configurations
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
🪛 GitHub Check: AI Style Review
docs/source/development-testing/graphql-codegen.mdx
[warning] 23-23: docs/source/development-testing/graphql-codegen.mdx#L23
Structural Elements: Terminal commands longer than three words must be placed in a code block.
```bash
npm install -D `@graphql-codegen/cli` `@graphql-codegen/typescript-operations`
---
[notice] 163-163: docs/source/development-testing/graphql-codegen.mdx#L163
**Verb Tense and Voice**: Use present tense instead of 'should be'.
**Voice**: Use authoritative language like 'Use' instead of 'This should be'.
**Word and Symbol Usage**: Avoid "above"; use "preceding" for body text.
```suggestion
// This is the file generated by the "typescript-operations" plugin above,
[notice] 250-250: docs/source/development-testing/graphql-codegen.mdx#L250
Verb Tense and Voice: Use present tense instead of 'should be'.
Voice: Use authoritative language like 'Use' instead of 'This should be'.
Word and Symbol Usage: Avoid "above"; use "preceding" for body text.
// This is the file generated by the "typescript-operations" plugin above,
🔇 Additional comments (1)
docs/source/development-testing/graphql-codegen.mdx (1)
43-43: Nice consistency update across the codegen examples.Using
typescript-operationsin the generated types target and disabling operation type generation in the shared file (generateOperationTypes: false) is consistently applied in both advanced examples.Also applies to: 152-156, 239-243
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
docs/source/development-testing/graphql-codegen.mdx (1)
86-86: Use singular wording for the single recommended plugin.This paragraph now points to one plugin, but it still says
which focusandthese plugins. Tightening that sentence would make the guidance read consistently.📝 Suggested wording
-We do not recommend using the client preset with Apollo Client apps because it generates additional runtime code that adds bundle size to your application and includes features that are incompatible with Apollo Client. Instead, we recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum), which focus on only generating types and don't include additional runtime code. Follow the steps in the preceding section to use a setup that includes these plugins. +We do not recommend using the client preset with Apollo Client apps because it generates additional runtime code that adds bundle size to your application and includes features that are incompatible with Apollo Client. Instead, use the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum). It focuses on generating types and doesn't include additional runtime code. Follow the steps in the Recommended starter configuration section to use that setup.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` at line 86, The paragraph that recommends using the typescript-operations plugin should use singular wording: change "which focus on only generating types and don't include additional runtime code" and "these plugins" to a singular form referencing the single plugin (e.g., "which focuses on generating only types and doesn't include additional runtime code" and "this plugin"); locate the sentence that mentions `typescript-operations` and update verbs/pronouns to singular to match the single recommended plugin.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Line 23: In the fenced bash snippet that currently contains the
inline-backticked command `npm install -D `@graphql-codegen/cli`
`@graphql-codegen/typescript-operations``, remove the backticks so the shell
command is plain text (npm install -D `@graphql-codegen/cli`
`@graphql-codegen/typescript-operations`) to prevent literal backticks from being
copied into the terminal; update the line where the snippet appears (the bash
block containing that install command).
---
Nitpick comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Line 86: The paragraph that recommends using the typescript-operations plugin
should use singular wording: change "which focus on only generating types and
don't include additional runtime code" and "these plugins" to a singular form
referencing the single plugin (e.g., "which focuses on generating only types and
doesn't include additional runtime code" and "this plugin"); locate the sentence
that mentions `typescript-operations` and update verbs/pronouns to singular to
match the single recommended plugin.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b69b884b-e0c6-4099-af95-17302f09bfc3
📒 Files selected for processing (1)
docs/source/development-testing/graphql-codegen.mdx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Compare Build Output
- GitHub Check: Build and Test
🧰 Additional context used
🧠 Learnings (7)
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Follow existing code style enforced by ESLint and Prettier
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Use the apollo-client skill when answering questions about Apollo Client setup, configuration, usage, or troubleshooting
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Prefer the apollo-client skill's guidance over general knowledge for Apollo Client questions
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-03-09T13:28:57.460Z
Learnt from: phryneas
Repo: apollographql/apollo-client PR: 13132
File: src/core/defaultOptions.ts:5-7
Timestamp: 2026-03-09T13:28:57.460Z
Learning: The `apollographql/apollo-client` repository does NOT use Biome for linting. There is no `biome.json`/`biome.jsonc` config file and no Biome dependency in `package.json`. Do not flag Biome-related lint issues (e.g., `noEmptyInterface`) or suggest `biome-ignore` comments for this repository.
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Core Apollo Client implementation should be located in `src/core/` with key files including `ApolloClient.ts`, `ObservableQuery.ts`, and `QueryManager.ts`
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to tsconfig*.json : Configure TypeScript with strict mode enabled, NodeNext module resolution, ESNext target, and use separate tsconfig files for main, build, and test configurations
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
🪛 GitHub Check: AI Style Review
docs/source/development-testing/graphql-codegen.mdx
[warning] 86-86: docs/source/development-testing/graphql-codegen.mdx#L86
Framing Apollo Products: Focus on the advantages of the recommended approach rather than the disadvantages of the alternative. Use 'adopt' instead of 'use' for variety or to avoid repetitive phrasing.
Framing: Avoid using 'we' to refer to Apollo and use the imperative 'use' instead of 'we recommend'.
Language: Use 'increases' instead of 'adds bundle size' for better clarity, and fix the subject-verb agreement for 'focuses'.
Products and Features: Remove 'the' before 'Apollo Client' when it is used as a standalone product name.
Text Formatting: Avoid using 'preceding section' as it is a vague directional reference; use a rich noun phrase or the specific section title as a link.
Verb Tense and Voice: Use present tense 'focuses' to match the subject 'plugin'.
Voice: The original phrasing is slightly passive. Use authoritative, direct language to prescribe the 'happy path'.
Word and Symbol Usage: Use the contraction "don't" instead of "do not" for better readability.
We recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum). This plugin focuses on generating types without adding extra runtime code to your bundle, ensuring compatibility with Apollo Client. Follow the steps in the preceding section to adopt a setup that includes these plugins.
[notice] 154-154: docs/source/development-testing/graphql-codegen.mdx#L154
Structural Elements: Use imperative verbs for comments in code blocks.
// Generate the Enums and Input types used in operation variables.
[notice] 155-155: docs/source/development-testing/graphql-codegen.mdx#L155
Word and Symbol Usage: Avoid using "below" to describe position; use "following" instead.
// These types are imported into near-operation files generated by the config following.
[warning] 164-164: docs/source/development-testing/graphql-codegen.mdx#L164
Text Formatting: Use code font for symbols like plugin names instead of double quotes.
Word and Symbol Usage: Avoid using "above" to describe position; use "preceding" instead.
// This is the file generated by the `typescript-operations` plugin above,
[notice] 242-242: docs/source/development-testing/graphql-codegen.mdx#L242
Structural Elements: Use imperative verbs for comments in code blocks.
// Generate the Enums and Input types used in operation variables.
[notice] 243-243: docs/source/development-testing/graphql-codegen.mdx#L243
Word and Symbol Usage: Avoid using "below" to describe position; use "following" instead.
// These types are imported into near-operation files generated by the config following.
[warning] 252-252: docs/source/development-testing/graphql-codegen.mdx#L252
Text Formatting: Use code font for symbols like plugin names instead of double quotes.
Word and Symbol Usage: Avoid using "above" to describe position; use "preceding" instead.
// This is the file generated by the `typescript-operations` plugin above,
eddeee888
force-pushed
the
update-codegen-doc
branch
2 times, most recently
from
b94fa4b to
c0aea13
Compare
There was a problem hiding this comment.
🧹 Nitpick comments (5)
docs/source/development-testing/graphql-codegen.mdx (5)
164-166: Consider using code font for plugin name.Static analysis suggests using backticks for the plugin name instead of quotes for consistency with other code references.
📝 Suggested change
- // This is the file generated by the "typescript-operations" plugin above, + // This is the file generated by the `typescript-operations` plugin in the preceding config,🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 164 - 166, The documentation uses quotes around the plugin name "typescript-operations"; update the text to use code font/backticks for the plugin name (e.g., `typescript-operations`) for consistency with other code references and ensure the line referencing importSchemaTypesFrom remains unchanged (the symbol importSchemaTypesFrom and path "./src/types/__generated__/graphql.ts" should be left as-is).
252-254: Same optional style improvement applies here.For consistency with the earlier suggestion, consider using backticks for the plugin name.
📝 Suggested change
- // This is the file generated by the "typescript-operations" plugin above, + // This is the file generated by the `typescript-operations` plugin in the preceding config,🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 252 - 254, Update the MDX docs to use inline code formatting for the plugin name: wrap the plugin identifier "typescript-operations" in backticks wherever it is mentioned (e.g., near the importSchemaTypesFrom comment and the earlier plugin reference) so the documentation consistently highlights plugin names; look for the string "typescript-operations" and replace it with `typescript-operations`.
86-86: Consider reframing to focus on the recommended approach's benefits.The static analysis hints suggest a more direct, benefit-focused phrasing. This is optional but would align better with the documentation style guide.
📝 Suggested rewording
-We do not recommend using the client preset with Apollo Client apps because it generates additional runtime code that adds bundle size to your application and includes features that are incompatible with Apollo Client. Instead, we recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum), which focus on only generating types and don't include additional runtime code. Follow the steps in the preceding section to use a setup that includes these plugins. +We recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum). This approach focuses on generating types without adding extra runtime code to your bundle, ensuring compatibility with Apollo Client. Follow the steps in the preceding section to use a setup that includes these plugins.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` at line 86, Reword the paragraph to emphasize benefits of the recommended approach: replace the current admonition about not using the client preset with a positive, benefit-focused sentence that recommends using the typescript-operations plugin (and optionally typescript plugin) directly; highlight that this produces only type definitions, avoids extra runtime code and bundle-size increases, and ensures full compatibility with Apollo Client so users understand the concrete advantages of the suggested setup.
240-245: Same optional style improvements apply here.For consistency, consider applying the same comment style changes suggested for lines 154-155.
📝 Suggested change
plugins: ["typescript-operations"], config: { - // Generates the Enums and Input types used in operation variables. - // These types are imported into near-operation files generated by the config below. + // Generate the Enums and Input types used in operation variables. + // The following config imports these types into near-operation files. generateOperationTypes: false, },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 240 - 245, Update the inline comment style in the GraphQL Codegen config block to match the earlier style used around lines 154-155: adjust the comment above config.generateOperationTypes (and the preceding comment about Enums/Input types) so they follow the same phrasing and punctuation convention used for the other comments in this file (e.g., consistent sentence casing and punctuation). Locate the plugins/config block and the generateOperationTypes comment and rewrite those comment lines to the same style as the earlier comments for consistency.
152-157: Consider using imperative language in the comment block.The
generateOperationTypes: falseconfig is valid for v6. Minor style refinement suggested:Optional: Use imperative verbs
plugins: ["typescript-operations"], config: { - // Generates the Enums and Input types used in operation variables. - // These types are imported into near-operation files generated by the config below. + // Generate the Enums and Input types used in operation variables. + // The following config imports these types into near-operation files. generateOperationTypes: false, },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/source/development-testing/graphql-codegen.mdx` around lines 152 - 157, Update the inline comment inside the config block that documents generateOperationTypes to use imperative language; edit the comment lines referencing "Generates the Enums and Input types used in operation variables." and "These types are imported into near-operation files generated by the config below." to use imperative verbs (for example, "Generate the Enums and Input types used in operation variables." and "Import these types into near-operation files generated by the config below.") so the documentation reads as direct instructions; target the comment near the generateOperationTypes setting in the config for the typescript-operations plugin.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Around line 164-166: The documentation uses quotes around the plugin name
"typescript-operations"; update the text to use code font/backticks for the
plugin name (e.g., `typescript-operations`) for consistency with other code
references and ensure the line referencing importSchemaTypesFrom remains
unchanged (the symbol importSchemaTypesFrom and path
"./src/types/__generated__/graphql.ts" should be left as-is).
- Around line 252-254: Update the MDX docs to use inline code formatting for the
plugin name: wrap the plugin identifier "typescript-operations" in backticks
wherever it is mentioned (e.g., near the importSchemaTypesFrom comment and the
earlier plugin reference) so the documentation consistently highlights plugin
names; look for the string "typescript-operations" and replace it with
`typescript-operations`.
- Line 86: Reword the paragraph to emphasize benefits of the recommended
approach: replace the current admonition about not using the client preset with
a positive, benefit-focused sentence that recommends using the
typescript-operations plugin (and optionally typescript plugin) directly;
highlight that this produces only type definitions, avoids extra runtime code
and bundle-size increases, and ensures full compatibility with Apollo Client so
users understand the concrete advantages of the suggested setup.
- Around line 240-245: Update the inline comment style in the GraphQL Codegen
config block to match the earlier style used around lines 154-155: adjust the
comment above config.generateOperationTypes (and the preceding comment about
Enums/Input types) so they follow the same phrasing and punctuation convention
used for the other comments in this file (e.g., consistent sentence casing and
punctuation). Locate the plugins/config block and the generateOperationTypes
comment and rewrite those comment lines to the same style as the earlier
comments for consistency.
- Around line 152-157: Update the inline comment inside the config block that
documents generateOperationTypes to use imperative language; edit the comment
lines referencing "Generates the Enums and Input types used in operation
variables." and "These types are imported into near-operation files generated by
the config below." to use imperative verbs (for example, "Generate the Enums and
Input types used in operation variables." and "Import these types into
near-operation files generated by the config below.") so the documentation reads
as direct instructions; target the comment near the generateOperationTypes
setting in the config for the typescript-operations plugin.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b0ada65f-1576-4926-8f2a-ae5fb5af398b
📒 Files selected for processing (1)
docs/source/development-testing/graphql-codegen.mdx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Compare Build Output
- GitHub Check: Build and Test
🧰 Additional context used
🧠 Learnings (7)
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Follow existing code style enforced by ESLint and Prettier
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Use the apollo-client skill when answering questions about Apollo Client setup, configuration, usage, or troubleshooting
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Prefer the apollo-client skill's guidance over general knowledge for Apollo Client questions
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-03-09T13:28:57.460Z
Learnt from: phryneas
Repo: apollographql/apollo-client PR: 13132
File: src/core/defaultOptions.ts:5-7
Timestamp: 2026-03-09T13:28:57.460Z
Learning: The `apollographql/apollo-client` repository does NOT use Biome for linting. There is no `biome.json`/`biome.jsonc` config file and no Biome dependency in `package.json`. Do not flag Biome-related lint issues (e.g., `noEmptyInterface`) or suggest `biome-ignore` comments for this repository.
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Core Apollo Client implementation should be located in `src/core/` with key files including `ApolloClient.ts`, `ObservableQuery.ts`, and `QueryManager.ts`
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to tsconfig*.json : Configure TypeScript with strict mode enabled, NodeNext module resolution, ESNext target, and use separate tsconfig files for main, build, and test configurations
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
🪛 GitHub Check: AI Style Review
docs/source/development-testing/graphql-codegen.mdx
[warning] 86-86: docs/source/development-testing/graphql-codegen.mdx#L86
Framing Apollo Products: Focus on the advantages of the recommended approach rather than the disadvantages of the alternative.
Framing: Avoid 'we' to clarify responsibility and use the imperative 'use' for instructions.
Language: Corrected subject-verb agreement ('focuses', 'does') and used simpler phrasing for bundle size.
Products and Features: Remove 'the' before 'Apollo Client' when it is used as a standalone product name.
Text Formatting: The link text is descriptive and uses code font correctly; no change needed for formatting.
Verb Tense and Voice: Use present tense 'focuses' to match the subject 'plugin'.
Voice: The original phrasing is slightly passive. Use more authoritative and direct language to prescribe the 'happy path'.
Word and Symbol Usage: Use the contraction "don't" instead of "do not" for better readability.
We recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum). This approach focuses on generating types without adding extra runtime code to your bundle, ensuring compatibility with Apollo Client. Follow the steps in the preceding section to use a setup that includes these plugins.
[notice] 154-154: docs/source/development-testing/graphql-codegen.mdx#L154
Structural Elements: Use imperative verbs for comments within code blocks.
// Generate the Enums and Input types used in operation variables.
[warning] 164-164: docs/source/development-testing/graphql-codegen.mdx#L164
Text Formatting: Use code font for plugin names instead of quotes.
Verb Tense and Voice: Use active voice for clarity.
Word and Symbol Usage: Avoid using "above" to refer to content; use "preceding" instead.
// This is the file generated by the `typescript-operations` plugin above,
[notice] 155-155: docs/source/development-testing/graphql-codegen.mdx#L155
Verb Tense and Voice: Use active voice for clarity.
Word and Symbol Usage: Avoid using "below" to refer to content; use "following" instead.
// The config below imports these types into near-operation files.
[notice] 242-242: docs/source/development-testing/graphql-codegen.mdx#L242
Structural Elements: Use imperative verbs for comments within code blocks.
// Generate the Enums and Input types used in operation variables.
[warning] 252-252: docs/source/development-testing/graphql-codegen.mdx#L252
Text Formatting: Use code font for plugin names instead of quotes.
Verb Tense and Voice: Use active voice for clarity.
Word and Symbol Usage: Avoid using "above" to refer to content; use "preceding" instead.
// This is the file generated by the `typescript-operations` plugin above,
[notice] 243-243: docs/source/development-testing/graphql-codegen.mdx#L243
Verb Tense and Voice: Use active voice for clarity.
Word and Symbol Usage: Avoid using "below" to refer to content; use "following" instead.
// The config below imports these types into near-operation files.
🔇 Additional comments (2)
docs/source/development-testing/graphql-codegen.mdx (2)
23-23: LGTM!The simplified install command correctly reflects the v6 changes, removing the now-unnecessary
@graphql-codegen/typescriptpackage.
43-43: LGTM!Plugin list correctly updated to use only
typescript-operations, consistent with the install command.
eddeee888
force-pushed
the
update-codegen-doc
branch
from
c0aea13 to
d2460aa
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/source/development-testing/graphql-codegen.mdx`:
- Line 86: Update the sentence referring to the recommended plugin so verbs and
nouns agree with the singular "typescript-operations" plugin: change "which
focus on only generating types and don't include additional runtime code" to
"which focuses on only generating types and doesn't include additional runtime
code," and change "a setup that includes these plugins" to "a setup that
includes this plugin" (reference: the 'typescript-operations' plugin).
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 7bc6b567-e330-425f-93a5-e81c2d9acf56
📒 Files selected for processing (1)
docs/source/development-testing/graphql-codegen.mdx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: Compare Build Output
- GitHub Check: Are the types wrong
- GitHub Check: Api-Extractor
- GitHub Check: Pull Request Prerelease
- GitHub Check: Build and Test
🧰 Additional context used
🧠 Learnings (8)
📓 Common learnings
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Use `apollo/client/*/internal` paths for accessing internal APIs
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Follow existing code style enforced by ESLint and Prettier
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Use the apollo-client skill when answering questions about Apollo Client setup, configuration, usage, or troubleshooting
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:37.139Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: .github/instructions/apollo-client.instructions.md:0-0
Timestamp: 2026-02-19T17:01:37.139Z
Learning: Prefer the apollo-client skill's guidance over general knowledge for Apollo Client questions
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-03-09T13:29:05.350Z
Learnt from: phryneas
Repo: apollographql/apollo-client PR: 13132
File: src/core/defaultOptions.ts:5-7
Timestamp: 2026-03-09T13:29:05.350Z
Learning: The `apollographql/apollo-client` repository does NOT use Biome for linting. There is no `biome.json`/`biome.jsonc` config file and no Biome dependency in `package.json`. Do not flag Biome-related lint issues (e.g., `noEmptyInterface`) or suggest `biome-ignore` comments for this repository.
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Core Apollo Client implementation should be located in `src/core/` with key files including `ApolloClient.ts`, `ObservableQuery.ts`, and `QueryManager.ts`
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
📚 Learning: 2026-02-19T17:01:54.257Z
Learnt from: CR
Repo: apollographql/apollo-client PR: 0
File: CLAUDE.md:0-0
Timestamp: 2026-02-19T17:01:54.257Z
Learning: Applies to tsconfig*.json : Configure TypeScript with strict mode enabled, NodeNext module resolution, ESNext target, and use separate tsconfig files for main, build, and test configurations
Applied to files:
docs/source/development-testing/graphql-codegen.mdx
🪛 GitHub Check: AI Style Review
docs/source/development-testing/graphql-codegen.mdx
[warning] 23-23: docs/source/development-testing/graphql-codegen.mdx#L23
Structural Elements: Terminal commands longer than three words should be placed in a code block with a language specifier.
Text Formatting: Use code font for CLI commands.
```bash
npm install -D `@graphql-codegen/cli` `@graphql-codegen/typescript-operations`
---
[notice] 86-86: docs/source/development-testing/graphql-codegen.mdx#L86
**Framing Apollo Products**: Focus on the advantages of the recommended approach rather than the disadvantages of the alternative.
**Framing**: Use 'Apollo' instead of 'we' to avoid ambiguity and maintain a reader-centric focus.
**Language**: Corrected subject-verb agreement for 'focuses' to ensure grammatical accuracy.
**Text Formatting**: Use a rich noun phrase for link text instead of just the code symbol.
**Verb Tense and Voice**: Use the present tense and active voice for recommendations.
**Word and Symbol Usage**: Use contractions like "Don't" and "doesn't" for better readability.
```suggestion
We recommend using the [`typescript-operations`](https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations) plugin directly (at minimum). This plugin focuses on generating types without adding extra runtime code to your bundle, ensuring compatibility with Apollo Client. Follow the steps in the preceding section to adopt a setup that includes these plugins.
[notice] 164-164: docs/source/development-testing/graphql-codegen.mdx#L164
Word and Symbol Usage: Use "preceding" instead of "above" when referring to content.
// This is the file generated by the `typescript-operations` plugin preceding,
[notice] 252-252: docs/source/development-testing/graphql-codegen.mdx#L252
Word and Symbol Usage: Use "preceding" instead of "above" when referring to content.
// This is the file generated by the `typescript-operations` plugin preceding,
ad12abf to
f3e363e
Compare
|
Hey @eddeee888! FYI don't feel like you need to address every coderabbit comment that comes through. We're still trying out this AI review thing to get a feel for it, but we would by no means block this if you didn't address all those comments. Feel free to hit the obvious ones, but don't feel bad if you ignore some of them as well! |
eddeee888
force-pushed
the
update-codegen-doc
branch
from
f3e363e to
4243d0d
Compare
eddeee888
force-pushed
the
update-codegen-doc
branch
from
4243d0d to
951bd21
Compare
|
Thanks for the recommendation @jerelmiller ! It caught some grammar mistakes which was great! Keen to get your ahead of time reviews @jerelmiller and/or @phryneas 🙏 |
| config: { | ||
| // Generates the enum and input types used in operation variables. | ||
| // The files generated from the config below import these types into near-operation files. | ||
| generateOperationTypes: false, |
There was a problem hiding this comment.
For my own education, what does turning this setting off do in conjunction with the typescript-operations plugin? Does it just generate scalar types? Or something else?
There was a problem hiding this comment.
The typescript-operations plugin generates two main parts:
- Utility types and Scalars used in Variables (in 2.): Enums and Input
- Operation-specific types e.g. Variables (which use enums and input from 1.) and operation Result
When generateOperationTypes: false is used, it only generates 1., so it is used fort generating shared types in documents.
On the other hand, we have importSchemaTypesFrom: path/to/schema/types.ts which only generates 2. and imports types from the schema type file
There was a problem hiding this comment.
Thats helpful. Thanks so much!
There was a problem hiding this comment.
A couple things that we should also consider as part of this update:
- I think we should clearly state that this configuration is for Codegen v6 (or however you want to spell it out). Users that might come to this page with an older version of codegen/plugins might not understand that this conforms to the newest major.
- We should consider copying the old configuration to a collapsible section below that shows v5 users how to configure codegen. I think a
<details><summary /></details>might be great to use here along with a title of something like "Still using v5?".
Thoughts?
There was a problem hiding this comment.
Great suggestions! I've made the changes here:
- Added a Note component at the start to say this is a v6 guide, with hints about v5 configuration being at the end
- Added summary blocks at the end of each section with v5 configuration inside
There was a problem hiding this comment.
That looks great! Thanks so much 🙏
jerelmiller
left a comment
jerelmiller
left a comment
There was a problem hiding this comment.
I had a couple questions to call out the new version, but otherwise the changes in place now make sense to me. Appreciate you helping us get this updated! I can't wait for the new version to drop 🎉
jerelmiller
left a comment
jerelmiller
left a comment
There was a problem hiding this comment.
I'll go ahead and approve so that its ready to go when v6 is released. Let me know when you're ready for me to merge. Appreciate all the hard work on the new version and for helping make this documentation change!
|
FYI don't worry about the failed check. It always fails for forks. We'll need to fix that at some point 😬 |
|
Thank you @jerelmiller ! I've released the update here: https://github.com/dotansimha/graphql-code-generator/releases/tag/release-1777556900878 |
|
Thanks so much @eddeee888! Looking forward to using the new version 🎉 |
3 participants
This PR updates GraphQL Codegen docs for
typescript-operationsandclient-presetv6 release: dotansimha/graphql-code-generator#10496Summary by CodeRabbit