New website, better docs (based on nextjs & @theguild/docs) (#7010)

Co-authored-by: Dotan Simha <dotansimha@gmail.com>

README.md

@@ -1,18 +1,9 @@
-[![CodeGen](https://user-images.githubusercontent.com/25294569/63773131-35f6aa00-c8e3-11e9-8191-fc0ac6f959e4.gif)](https://graphql-code-generator.com)
+[![CodeGen](./logo.svg)](https://graphql-code-generator.com)
 
 [![npm version](https://badge.fury.io/js/%40graphql-codegen%2Fcli.svg)](https://badge.fury.io/js/%40graphql-codegen%2Fcli)
-[![CircleCI](https://circleci.com/gh/dotansimha/graphql-code-generator/tree/master.svg?style=svg)](https://circleci.com/gh/dotansimha/graphql-code-generator/tree/master)
-[![Discord Chat](https://img.shields.io/discord/625400653321076807)](https://discord.gg/xud7bH9)
-[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
-[![renovate-app badge][renovate-badge]][renovate-app]
-
-[renovate-badge]: https://img.shields.io/badge/renovate-app-blue.svg
-[renovate-app]: https://renovateapp.com/
 
 [graphql-code-generator.com](https://graphql-code-generator.com)
 
-[GraphQL Codegen 1.0 is here!](https://graphql-code-generator.com/docs/migration/from-0-18)
-
 GraphQL Code Generator is a tool that generates code out of your GraphQL schema. Whether you are developing a frontend or backend, you can utilize GraphQL Code Generator to generate output from your GraphQL Schema and GraphQL Documents (query/mutation/subscription/fragment).
 
 By analyzing the schema and documents and parsing it, GraphQL Code Generator can output code at a wide variety of formats, based on pre-defined templates or based on custom user-defined ones. Regardless of the language that you're using, GraphQL Code Generator got you covered.
@@ -21,10 +12,12 @@ GraphQL Code Generator lets you choose the output that you need, based on _plugi
 
 You can try this tool live on your browser and see some useful examples. Check out [GraphQL Code Generator Live Examples](https://graphql-code-generator.com/#live-demo).
 
-We currently support and maintain [these plugins](https://graphql-code-generator.com/docs/plugins/index) (TypeScript, Flow, React, Angular, MongoDB, Stencil, Reason, and some more), and there is an active community that writes and maintains custom plugins.
+We currently support and maintain [these plugins](https://graphql-code-generator.com/plugins) (TypeScript, Flow, React, Angular, MongoDB, Stencil, Reason, and some more), and there is an active community that writes and maintains custom plugins.
 
 ### Quick Start
 
+> You can find the complete instructions in [GraphQL-Code-Generator website](https://graphql-code-generator.com/docs/getting-started/installation).
+
 Start by installing the basic deps of GraphQL Codegen;
 
     yarn add graphql
@@ -36,101 +29,13 @@ GraphQL Code Generator lets you setup everything by simply running the following
 
 Question by question, it will guide you through the whole process of setting up a schema, selecting plugins, picking a destination of a generated file, and a lot more.
 
-If you don't want to use the wizard, install it by yourself and create a basic `codegen.yml` configuration file, point to your schema, and pick the plugins you wish to use. 
-
-Install CLI using `yarn`:
-
-    yarn add -D @graphql-codegen/cli
-
-And create a config like below:
-
-```yml
-schema: http://localhost:3000/graphql
-generates:
-  ./src/types.d.ts:
-    plugins:
-      - typescript
-```
-
-Then, run the code-generator using `graphql-codegen` command:
-
-    yarn graphql-codegen
-
-The command above may fetch (for example) the following GraphQL schema:
-
-```graphql
-type Author {
-  id: Int!
-  firstName: String!
-  lastName: String!
-  posts(findTitle: String): [Post]
-}
-
-type Post {
-  id: Int!
-  title: String!
-  author: Author!
-}
-
-type Query {
-  posts: [Post]
-}
-
-schema {
-  query: Query
-}
-```
-
-And generate the following TypeScript typings:
-
-```ts
-export type Maybe<T> = T | null;
-
-/** All built-in and custom scalars, mapped to their actual values */
-export type Scalars = {
-  ID: string,
-  String: string,
-  Boolean: boolean,
-  Int: number,
-  Float: number,
-};
-
-export type Author = {
-  __typename?: 'Author',
-  id: Scalars['Int'],
-  firstName: Scalars['String'],
-  lastName: Scalars['String'],
-  posts?: Maybe<Array<Maybe<Post>>>,
-};
-
-export type AuthorPostsArgs = {
-  findTitle?: Maybe<Scalars['String']>
-};
-
-export type Post = {
-  __typename?: 'Post',
-  id: Scalars['Int'],
-  title: Scalars['String'],
-  author: Author,
-};
-
-export type Query = {
-  __typename?: 'Query',
-  posts?: Maybe<Array<Maybe<Post>>>,
-};
-```
+If you wish to [manually setup codegen, follow these instructions]((https://graphql-code-generator.com/docs/getting-started/installation)).
 
 ### Links
 
-Besides our [docs page](https://graphql-code-generator.com/docs/getting-started/index), feel free to go through our published Medium articles to get a better grasp of what GraphQL Code Generator is all about:
-
-- [All available plugins](https://graphql-code-generator.com/docs/plugins/index)
-
-- [**GraphQL Code-Generator** - The True GraphQL-First platform](https://the-guild.dev/blog/graphql-code-generator)
-
-- [**GraphQL Code-Generator v0.9** - What's new?](https://the-guild.dev/blog/graphql-code-generator-090)
+Besides our [docs page](https://graphql-code-generator.com/docs/getting-started), feel free to go through our published Medium articles to get a better grasp of what GraphQL Code Generator is all about:
 
-- [**GraphQL Code Generator v0.11** - Generate React and Angular Apollo Components, Resolver signatures and much more!](https://the-guild.dev/blog/graphql-code-generator-011)
+- [All available plugins & presets](https://graphql-code-generator.com/plugins)
 
 ### Contributing
 

bob.config.js

@@ -2,7 +2,6 @@ module.exports = {
   ignore: [
     '@graphql-codegen/website',
     '@graphql-codegen/live-demo',
-    '@graphql-codegen/config-schema',
     'example-programmatic-typescript',
   ],
 };

dev-test/alt-codegen.yml

@@ -0,0 +1,12 @@
+overwrite: true
+schema: 'test-schema/schema.graphql'
+documents:
+  - 'src/**/*.graphql'
+
+generates:
+  test-schema/schema.ts:
+    - typescript:
+        declarationKind: interface
+    - typescript-operations:
+        declarationKind: interface
+        defaultScalarType: unknown

package.json

@@ -29,11 +29,9 @@
       "packages/plugins/other/*",
       "packages/presets/*",
       "website",
-      "website/live-demo",
       "examples/*"
     ],
     "nohoist": [
-      "@graphql-codegen/website/@docusaurus/*",
       "**/@babel-*",
       "**/@babel-*/**"
     ]

packages/plugins/flow/flow/src/config.ts

@@ -29,10 +29,10 @@ export interface FlowPluginConfig extends RawTypesConfig {
    * ```yml
    * generates:
    *   path/to/file.ts:
-   *    plugins:
-   *      - flow
-   *    config:
-   *      useFlowReadOnlyTypes: true
+   *     plugins:
+   *       - flow
+   *     config:
+   *       useFlowReadOnlyTypes: true
    * ```
    */
   useFlowReadOnlyTypes?: boolean;

packages/plugins/flow/operations/src/config.ts

@@ -5,7 +5,7 @@ import { RawDocumentsConfig } from '@graphql-codegen/visitor-plugin-common';
  *
  * It generates types for your GraphQL documents: Query, Mutation, Subscription and Fragment.
  *
- * This plugin requires you to use `@graphql-codegen/flow` as well, because it depends on it's types.
+ * This plugin requires you to use `@graphql-codegen/flow` as well, because it depends on its types.
  */
 export interface FlowDocumentsPluginConfig extends RawDocumentsConfig {
   /**
@@ -15,11 +15,11 @@ export interface FlowDocumentsPluginConfig extends RawDocumentsConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.ts:
-   *  plugins:
-   *    - flow
-   *  config:
-   *    useFlowExactObjects: false
+   *   path/to/file.ts:
+   *     plugins:
+   *       - flow
+   *     config:
+   *       useFlowExactObjects: false
    * ```
    */
   useFlowExactObjects?: boolean;
@@ -30,11 +30,11 @@ export interface FlowDocumentsPluginConfig extends RawDocumentsConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.ts:
-   *  plugins:
-   *    - flow
-   *  config:
-   *    useFlowReadOnlyTypes: true
+   *   path/to/file.ts:
+   *     plugins:
+   *       - flow
+   *     config:
+   *       useFlowReadOnlyTypes: true
    * ```
    */
   useFlowReadOnlyTypes?: boolean;
@@ -45,12 +45,12 @@ export interface FlowDocumentsPluginConfig extends RawDocumentsConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.ts:
-   *  plugins:
-   *    - typescript
-   *    - typescript-operations
-   *  config:
-   *    flattenGeneratedTypes: true
+   *   path/to/file.ts:
+   *     plugins:
+   *       - typescript
+   *       - typescript-operations
+   *     config:
+   *       flattenGeneratedTypes: true
    * ```
    */
   flattenGeneratedTypes?: boolean;

packages/plugins/flow/resolvers/src/index.ts

@@ -14,7 +14,7 @@ import { FlowResolversVisitor } from './visitor';
  *
  * It generates types for your entire schema: types, input types, enum, interface, scalar and union.
  *
- * This plugin requires you to use `@graphql-codegen/flow` as well, because it depends on it's types.
+ * This plugin requires you to use `@graphql-codegen/flow` as well, because it depends on its types.
  */
 export interface RawFlowResolversConfig extends RawResolversConfig {}
 

packages/plugins/java/apollo-android/src/plugin.ts

@@ -17,12 +17,12 @@ export interface JavaApolloAndroidPluginConfig extends RawConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * ./app/src/main/java/:
-   *   preset: java-apollo-android
-   *   config:
-   *     package: "com.my.package.generated.graphql"
-   *   plugins:
-   *     - java-apollo-android
+   *   ./app/src/main/java/:
+   *     preset: java-apollo-android
+   *     config:
+   *       package: 'com.my.package.generated.graphql'
+   *     plugins:
+   *       - java-apollo-android
    * ```
    */
   package?: string;
@@ -32,12 +32,12 @@ export interface JavaApolloAndroidPluginConfig extends RawConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * ./app/src/main/java/:
-   *   preset: java-apollo-android
-   *   config:
-   *     typePackage: "com.my.package.generated.graphql"
-   *   plugins:
-   *     - java-apollo-android
+   *   ./app/src/main/java/:
+   *     preset: java-apollo-android
+   *     config:
+   *       typePackage: 'com.my.package.generated.graphql'
+   *     plugins:
+   *       - java-apollo-android
    * ```
    */
   typePackage?: string;
@@ -47,12 +47,12 @@ export interface JavaApolloAndroidPluginConfig extends RawConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * ./app/src/main/java/:
-   *   preset: java-apollo-android
-   *   config:
-   *     fragmentPackage: "com.my.package.generated.graphql"
-   *   plugins:
-   *     - java-apollo-android
+   *   ./app/src/main/java/:
+   *     preset: java-apollo-android
+   *     config:
+   *       fragmentPackage: 'com.my.package.generated.graphql'
+   *     plugins:
+   *       - java-apollo-android
    * ```
    */
   fragmentPackage?: string;

packages/plugins/other/fragment-matcher/src/index.ts

@@ -38,17 +38,17 @@ interface PossibleTypesResultData {
  */
 export interface FragmentMatcherConfig {
   /**
-   * @description Compatible only with JSON extension, allow you to choose the export type, either `module.exports` or `export default`.  Allowed values are: `commonjs`,  `es2015`.
+   * @description Compatible only with JSON extension, allow you to choose the export type, either `module.exports` or `export default`. Allowed values are: `commonjs`, `es2015`.
    * @default es2015
    *
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.json:
-   *  plugins:
-   *    - fragment-matcher
-   *  config:
-   *    module: commonjs
+   *   path/to/file.json:
+   *     plugins:
+   *       - fragment-matcher
+   *     config:
+   *       module: commonjs
    * ```
    */
   module?: 'commonjs' | 'es2015';
@@ -59,11 +59,11 @@ export interface FragmentMatcherConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.ts:
-   *  plugins:
-   *    - fragment-matcher
-   *  config:
-   *    apolloClientVersion: 3
+   *   path/to/file.ts:
+   *     plugins:
+   *       - fragment-matcher
+   *     config:
+   *       apolloClientVersion: 3
    * ```
    */
   apolloClientVersion?: 2 | 3;
@@ -74,11 +74,11 @@ export interface FragmentMatcherConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * path/to/file.ts:
-   *  plugins:
-   *    - fragment-matcher
-   *  config:
-   *    useExplicitTyping: true
+   *   path/to/file.ts:
+   *     plugins:
+   *       - fragment-matcher
+   *     config:
+   *       useExplicitTyping: true
    * ```
    */
   useExplicitTyping?: boolean;

packages/plugins/other/introspection/src/index.ts

@@ -14,11 +14,11 @@ export interface IntrospectionPluginConfig {
    * @exampleMarkdown
    * ```yml
    * generates:
-   * introspection.json:
-   *   plugins:
-   *     - introspection
-   *   config:
-   *     minify: true
+   *   introspection.json:
+   *     plugins:
+   *       - introspection
+   *     config:
+   *       minify: true
    * ```
    */
   minify?: boolean;