Applying comments from review

packages/shopify-app-remix/docs/generated/generated_docs_data.json

@@ -2584,14 +2584,14 @@
               {
                 "filePath": "/server/types.ts",
                 "syntaxKind": "MethodSignature",
-                "name": "__@iterator@1391",
+                "name": "__@iterator@1390",
                 "value": "() => IterableIterator<JSONValue>",
                 "description": "Iterator"
               },
               {
                 "filePath": "/server/types.ts",
                 "syntaxKind": "MethodSignature",
-                "name": "__@unscopables@1393",
+                "name": "__@unscopables@1392",
                 "value": "() => { copyWithin: boolean; entries: boolean; fill: boolean; find: boolean; findIndex: boolean; keys: boolean; values: boolean; }",
                 "description": "Returns an object whose properties have the value 'true'\r\nwhen they will be absent when used in a 'with' statement."
               },
@@ -6842,14 +6842,14 @@
               {
                 "filePath": "/server/types.ts",
                 "syntaxKind": "MethodSignature",
-                "name": "__@iterator@1391",
+                "name": "__@iterator@1390",
                 "value": "() => IterableIterator<JSONValue>",
                 "description": "Iterator"
               },
               {
                 "filePath": "/server/types.ts",
                 "syntaxKind": "MethodSignature",
-                "name": "__@unscopables@1393",
+                "name": "__@unscopables@1392",
                 "value": "() => { copyWithin: boolean; entries: boolean; fill: boolean; find: boolean; findIndex: boolean; keys: boolean; values: boolean; }",
                 "description": "Returns an object whose properties have the value 'true'\r\nwhen they will be absent when used in a 'with' statement."
               },

packages/shopify-app-remix/docs/generated/generated_static_pages.json

@@ -171,7 +171,7 @@
   {
     "id": "guide-graphql-types",
     "title": "Typing GraphQL operations",
-    "description": "The GraphQL clients provided in this package can use [Codegen](https://the-guild.dev/graphql/codegen) to automatically parse and create types for your queries and mutations.\n\nBy installing a few packages in your app, you can use the `graphql-codegen` script, which will look for strings with the `#graphql` tag and add syntax highlighting and types to them.",
+    "description": "The GraphQL clients provided in this package can use [Codegen](https://the-guild.dev/graphql/codegen) to automatically parse and create types for your queries and mutations.\n\nBy installing a few packages in your app, you can use the `graphql-codegen` script, which will look for strings with the `#graphql` tag and extract types from them.\n\nIf your IDE supports it, you will also get syntax highlighting and auto-complete features when writing your queries.",
     "sections": [
       {
         "type": "Markdown",
@@ -209,7 +209,7 @@
         "type": "Generic",
         "anchorLink": "configure",
         "title": "Setting up .graphqlrc.ts",
-        "sectionContent": "Before you can parse operations, you'll need to create a `.grahpqlrc.ts` file in your project, and configure it to use the `@shopify/api-codegen-preset`.",
+        "sectionContent": "Before you can parse operations, you'll need to create a `.graphqlrc.ts` file in your project, and configure it to use the `@shopify/api-codegen-preset`.\n\n> Caution: Parsing will not work on `.graphql` documents, because the preset can only apply types from JavaScript and TypeScript const strings.",
         "codeblock": {
           "title": "Codegen configuration example",
           "tabs": [
@@ -249,24 +249,24 @@
         "type": "Generic",
         "anchorLink": "run",
         "title": "Generating types",
-        "sectionContent": "You can run the script in watch mode to update your types every time you save a file.",
+        "sectionContent": "When you run `graphql-codegen`, it will look in all your configured documents for strings marked with a `#graphql` tag.\n\nIDEs that support the `.graphqlrc.ts` file will provide syntax highlighting for your operations, as well as typing.\n\n> Tip: You can pass in a `--watch` flag to the script, which will update your types every time you save a file.",
         "codeblock": {
           "title": "Running graphql-codegen",
           "tabs": [
             {
               "title": "npm",
               "language": "sh",
-              "code": "npm run graphql-codegen -- --watch\n"
+              "code": "npm run graphql-codegen\n"
             },
             {
               "title": "yarn",
               "language": "sh",
-              "code": "yarn graphql-codegen --watch\n"
+              "code": "yarn graphql-codegen\n"
             },
             {
               "title": "pnpm",
               "language": "sh",
-              "code": "pnpm run graphql-codegen --watch\n"
+              "code": "pnpm run graphql-codegen\n"
             }
           ]
         }

packages/shopify-app-remix/docs/staticPages/examples/guides/graphql-types/run.npm.example.sh

@@ -1 +1 @@
-npm run graphql-codegen -- --watch
+npm run graphql-codegen

packages/shopify-app-remix/docs/staticPages/examples/guides/graphql-types/run.pnpm.example.sh

@@ -1 +1 @@
-pnpm run graphql-codegen --watch
+pnpm run graphql-codegen

packages/shopify-app-remix/docs/staticPages/examples/guides/graphql-types/run.yarn.example.sh

@@ -1 +1 @@
-yarn graphql-codegen --watch
+yarn graphql-codegen

packages/shopify-app-remix/docs/staticPages/graphql-types.doc.ts

@@ -4,8 +4,9 @@ const data: LandingTemplateSchema = {
   id: 'guide-graphql-types',
   title: 'Typing GraphQL operations',
   description:
-    'The GraphQL clients provided in this package can use [Codegen](https://the-guild.dev/graphql/codegen) to automatically parse and create types for your queries and mutations.\n\n' +
-    'By installing a few packages in your app, you can use the `graphql-codegen` script, which will look for strings with the `#graphql` tag and add syntax highlighting and types to them.',
+    'The GraphQL clients provided in this package can use [Codegen](https://the-guild.dev/graphql/codegen) to automatically parse and create types for your queries and mutations.' +
+    '\n\nBy installing a few packages in your app, you can use the `graphql-codegen` script, which will look for strings with the `#graphql` tag and extract types from them.' +
+    '\n\nIf your IDE supports it, you will also get syntax highlighting and auto-complete features when writing your queries.',
   sections: [
     {
       type: 'Markdown',
@@ -27,8 +28,8 @@ Note how VSCode shows the types for both the return type of \`response.json()\`,
       anchorLink: 'install',
       title: 'Installing packages',
       sectionContent:
-        'To use the `graphql-codegen` script, you will need to install a few packages in your app.\n\n' +
-        'They will include the scripts to run, and the types that will be overridden by the results of parsing your operations.',
+        'To use the `graphql-codegen` script, you will need to install a few packages in your app.' +
+        '\n\nThey will include the scripts to run, and the types that will be overridden by the results of parsing your operations.',
       codeblock: {
         title: 'Installing packages',
         tabs: [
@@ -55,7 +56,8 @@ Note how VSCode shows the types for both the return type of \`response.json()\`,
       anchorLink: 'configure',
       title: 'Setting up .graphqlrc.ts',
       sectionContent:
-        "Before you can parse operations, you'll need to create a `.grahpqlrc.ts` file in your project, and configure it to use the `@shopify/api-codegen-preset`.",
+        "Before you can parse operations, you'll need to create a `.graphqlrc.ts` file in your project, and configure it to use the `@shopify/api-codegen-preset`." +
+        '\n\n> Caution: Parsing will not work on `.graphql` documents, because the preset can only apply types from JavaScript and TypeScript const strings.',
       codeblock: {
         title: 'Codegen configuration example',
         tabs: [
@@ -97,7 +99,9 @@ Note how VSCode shows the types for both the return type of \`response.json()\`,
       anchorLink: 'run',
       title: 'Generating types',
       sectionContent:
-        'You can run the script in watch mode to update your types every time you save a file.',
+        'When you run `graphql-codegen`, it will look in all your configured documents for strings marked with a `#graphql` tag.' +
+        '\n\nIDEs that support the `.graphqlrc.ts` file will provide syntax highlighting for your operations, as well as typing.' +
+        '\n\n> Tip: You can pass in a `--watch` flag to the script, which will update your types every time you save a file.',
       codeblock: {
         title: 'Running graphql-codegen',
         tabs: [