[cli/docs]Add GitHub Loader TypeScript type, update usage docs (#9332)

* Add GitHub Loader TypeScript type, update usage docs

* Use better typing for github schema value

Author: eddeee888

.changeset/breezy-rice-retire.md

@@ -0,0 +1,5 @@
+---
+'@graphql-codegen/plugin-helpers': patch
+---
+
+Update GitHub loader TypeScript type and usage docs

packages/utils/plugins-helpers/src/types.ts

@@ -187,6 +187,10 @@ export namespace Types {
     'apollo-engine': ApolloEngineOptions;
   }
 
+  export interface GitHubSchemaOptions {
+    [githubProtocol: `github:${string}`]: { token: string };
+  }
+
   export type SchemaGlobPath = string;
   /**
    * @description A URL to your GraphQL endpoint, a local path to `.graphql` file, a glob pattern to your GraphQL schema files, or a JavaScript file that exports the schema to generate code from. This can also be an array which specifies multiple schemas to generate code from. You can read more about the supported formats [here](schema-field#available-formats).
@@ -195,6 +199,7 @@ export namespace Types {
     | string
     | UrlSchemaWithOptions
     | ApolloEngineSchemaOptions
+    | GitHubSchemaOptions
     | LocalSchemaPathWithOptions
     | SchemaGlobPath
     | SchemaWithLoader

website/src/pages/docs/config-reference/schema-field.mdx

@@ -445,7 +445,33 @@ export default config;
 
 ### GitHub
 
-You can load your schema file from a remote GitHub file, using the following syntax:
+You can load your schema file from a remote GitHub file using one of the following approaches:
+
+#### Provide GitHub token in Codegen Config
+
+Provide the GitHub path to your schema and token using the following syntax:
+
+```ts {4,5,6,7}
+import { CodegenConfig } from '@graphql-codegen/cli';
+
+const config: CodegenConfig = {
+  schema: {
+    'github:user/repo#branchName:path/to/file.graphql':
+      { token: "<YOUR GITHUB TOKEN>" }
+  }
+};
+export default config;
+```
+
+Then, run codegen:
+
+```bash
+yarn graphql-codegen
+```
+
+#### Provide GitHub token via Codegen CLI
+
+Alternatively, you can provide just the GitHub path to your schema:
 
 ```ts {4}
 import { CodegenConfig } from '@graphql-codegen/cli';
@@ -456,6 +482,11 @@ const config: CodegenConfig = {
 export default config;
 ```
 
+Then, provide your GitHub token using the `GITHU_TOKEN` environment variable when running codegen:
+
+```bash
+GITHUB_TOKEN=<YOUR GITHUB TOKEN> yarn graphql-codegen
+```
 
 <Callout>You can load from a JSON file, `.graphql` file, or from a code file containing `gql` tag syntax.</Callout>