[deploy_website] TGC Fixes (#1765)

* root components update

* font style fixes

* api docs revert

Author: alinsimoc

website/docs/api.md

@@ -3,14 +3,12 @@ id: api
 title: API Reference
 ---
 
-
-
 ## CONTEXT
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/application/tokens.ts)
 
 `CONTEXT` is an InjectionToken representing the provided `GraphQLModules.GlobalContext`
 
-
 ```typescript
 import { CONTEXT, Inject, Injectable } from 'graphql-modules';
 
@@ -21,80 +19,74 @@ export class Data {
 ```
 
 ## MODULE_ID
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/module/tokens.ts)
 
 `MODULE_ID` is an InjectionToken representing module's ID
 
-
 ```typescript
 import { MODULE_ID, Inject, Injectable } from 'graphql-modules';
 
 @Injectable()
 export class Data {
   constructor(@Inject(MODULE_ID) moduleId: string) {
-    console.log(`Data used in ${moduleId} module`)
+    console.log(`Data used in ${moduleId} module`);
   }
 }
 ```
 
 ## Application
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/application/types.ts)
 
 A return type of `createApplication` function.
 
- - `typeDefs` - A list of type definitions defined by modules.
- - `resolvers` - An object with resolve functions defined by modules.
- - `schema` - Ready to use GraphQLSchema object combined from modules.
- - `injector` - The application (Singleton) injector.
- - `createOperationController` - Take over control of GraphQL Operation
- - `createSubscription` - Creates a `subscribe` function that runs the subscription phase of GraphQL.
-Important when using GraphQL Subscriptions.
- - `createExecution` - Creates a `execute` function that runs the execution phase of GraphQL.
-Important when using GraphQL Queries and Mutations.
- - `createSchemaForApollo` - Experimental
- - `createApolloExecutor` - Experimental
-
-
+- `typeDefs` - A list of type definitions defined by modules.
+- `resolvers` - An object with resolve functions defined by modules.
+- `schema` - Ready to use GraphQLSchema object combined from modules.
+- `injector` - The application (Singleton) injector.
+- `createOperationController` - Take over control of GraphQL Operation
+- `createSubscription` - Creates a `subscribe` function that runs the subscription phase of GraphQL.
+  Important when using GraphQL Subscriptions.
+- `createExecution` - Creates a `execute` function that runs the execution phase of GraphQL.
+  Important when using GraphQL Queries and Mutations.
+- `createSchemaForApollo` - Experimental
+- `createApolloExecutor` - Experimental
 
 ## ApplicationConfig
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/application/types.ts)
 
 Application's configuration object. Represents the first argument of `createApplication` function.
 
- - `modules` - A list of GraphQL Modules
- - `providers` - A list of Providers - read the ["Providers and Tokens"](./di/providers) chapter.
- - `middlewares` - A map of middlewares - read the ["Middlewares"](./advanced/middlewares) chapter.
- - `schemaBuilder` - Creates a GraphQLSchema object out of typeDefs and resolvers
-
-
+- `modules` - A list of GraphQL Modules
+- `providers` - A list of Providers - read the ["Providers and Tokens"](./di/providers) chapter.
+- `middlewares` - A map of middlewares - read the ["Middlewares"](./advanced/middlewares) chapter.
+- `schemaBuilder` - Creates a GraphQLSchema object out of typeDefs and resolvers
 
 ## createApplication
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/application/application.ts)
 
 Creates Application out of Modules. Accepts `ApplicationConfig`.
 
-
 ```typescript
 import { createApplication } from 'graphql-modules';
 import { usersModule } from './users';
 import { postsModule } from './posts';
 import { commentsModule } from './comments';
 
 const app = createApplication({
-  modules: [
-    usersModule,
-    postsModule,
-    commentsModule
-  ]
-})
+  modules: [usersModule, postsModule, commentsModule],
+});
 ```
 
 ## createModule
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/module/module.ts)
 
 Creates a Module, an element used by Application. Accepts `ModuleConfig`.
 
-
 ```typescript
 import { createModule, gql } from 'graphql-modules';
 
@@ -105,19 +97,19 @@ export const usersModule = createModule({
   `,
   resolvers: {
     // ...
-  }
+  },
 });
 ```
 
 ## ModuleConfig
+
 [_source file_](https://github.com/Urigo/graphql-modules/blob/master/packages/graphql-modules/src/module/types.ts)
 
 Module's configuration object. Represents the first argument of `createModule` function.
 
- - `id` - Unique identifier of a module
- - `dirname` - Pass `__dirname` variable as a value to get better error messages.
- - `typeDefs` - An object or a list of GraphQL type definitions (SDL).
- - `resolvers` - An object or a list of GraphQL resolve functions.
- - `middlewares` - A map of middlewares - read the ["Middlewares"](./advanced/middlewares) chapter.
- - `providers` - A list of Providers - read the ["Providers and Tokens"](./di/providers) chapter.
-
+- `id` - Unique identifier of a module
+- `dirname` - Pass `__dirname` variable as a value to get better error messages.
+- `typeDefs` - An object or a list of GraphQL type definitions (SDL).
+- `resolvers` - An object or a list of GraphQL resolve functions.
+- `middlewares` - A map of middlewares - read the ["Middlewares"](./advanced/middlewares) chapter.
+- `providers` - A list of Providers - read the ["Providers and Tokens"](./di/providers) chapter.

website/docusaurus.config.js

@@ -16,7 +16,6 @@ module.exports = {
       defaultMode: 'light',
       disableSwitch: true,
     },
-    sidebarCollapsible: true,
     image: 'img/logo.svg',
     prism: {
       theme: require('prism-react-renderer/themes/nightOwl'),
@@ -45,83 +44,6 @@ module.exports = {
         },
       ],
     },
-    footer: {
-      style: 'dark',
-      copyright: `Copyright © ${new Date().getFullYear()} The Guild`,
-      logo: {
-        alt: 'GraphQL Modules Logo',
-        src: 'img/logo.svg',
-      },
-      links: [
-        {
-          title: 'Docs',
-          items: [
-            {
-              label: 'Getting Started',
-              to: 'docs/get-started',
-            },
-            {
-              label: `Essentials`,
-              to: 'docs/essentials/type-definitions',
-            },
-            {
-              label: 'Dependency Injection',
-              to: 'docs/di/introduction',
-            },
-            {
-              label: 'Advanced',
-              to: 'docs//advanced/subscriptions',
-            },
-            {
-              label: 'Recipes',
-              to: 'docs/recipes/dataloader',
-            },
-          ],
-        },
-        {
-          title: 'Community',
-          items: [
-            {
-              label: 'Our website',
-              href: 'https://the-guild.dev',
-            },
-            {
-              label: 'Discord',
-              href: 'https://the-guild.dev/discord',
-            },
-            {
-              label: 'Other projects',
-              href: 'https://the-guild.dev/open-source',
-            },
-            {
-              label: 'Community Meetings',
-              href: 'https://github.com/the-guild-org/community-meetings',
-            },
-          ],
-        },
-        {
-          title: 'Social',
-          items: [
-            {
-              label: 'Blog',
-              href: 'https://the-guild.dev/blog',
-            },
-            {
-              label: 'GitHub',
-              href: 'https://github.com/Urigo/graphql-modules',
-            },
-            {
-              label: 'Twitter',
-              href: 'https://the-guild.dev/twitter',
-            },
-            {
-              label: 'LinkedIn',
-              href: 'https://the-guild.dev/linkedin',
-            },
-          ],
-        },
-      ],
-    },
     announcementBar: {
       id: 'legacy-docs',
       content:
@@ -136,10 +58,7 @@ module.exports = {
       trackingID: 'UA-128969121-4',
     },
   },
-  scripts: [
-    'https://the-guild.dev/static/crisp.js',
-    '/js/force-light.js',
-  ],
+  scripts: ['https://the-guild.dev/static/crisp.js', '/js/force-light.js'],
   stylesheets: [
     'https://fonts.googleapis.com/css?family=Lato:300,400,500,600,700,800,900&display=swap',
   ],

website/package.json

@@ -13,6 +13,7 @@
     "@docusaurus/plugin-client-redirects": "2.0.0-beta.4",
     "@docusaurus/plugin-ideal-image": "2.0.0-beta.4",
     "@docusaurus/preset-classic": "2.0.0-beta.4",
+    "@theguild/components": "1.4.3",
     "@phenomnomnominal/tsquery": "4.1.1",
     "globby": "11.0.4",
     "patch-package": "6.4.7",

website/patches/@docusaurus+theme-classic+2.0.0-alpha.72.patch

@@ -1,23 +1,51 @@
 import React from 'react';
-import BrowserOnly from '@docusaurus/BrowserOnly';
-import { ThemeProvider, Header } from 'the-guild-components';
+import {
+  ThemeProvider,
+  GlobalStyles,
+  Header,
+  FooterExtended,
+} from '@theguild/components';
 
 // Default implementation, that you can customize
 function Root({ children }) {
   return (
-    <>
-      <BrowserOnly>
-        {() => (
-          <ThemeProvider>
-            <Header
-              activeLink={'/open-source'}
-              accentColor="var(--ifm-color-primary)"
-            />
-          </ThemeProvider>
-        )}
-      </BrowserOnly>
+    <ThemeProvider>
+      <GlobalStyles includeFonts />
+      <Header
+        activeLink={'/open-source'}
+        accentColor="var(--ifm-color-primary)"
+      />
       {children}
-    </>
+      <FooterExtended
+        resources={[
+          {
+            children: 'Getting Started',
+            title: 'Get started',
+            href: '/docs/get-started',
+          },
+          {
+            children: 'Essentials',
+            title: 'Learn about Essentials',
+            href: '/docs/essentials/type-definitions',
+          },
+          {
+            children: 'Dependency Injection',
+            title: 'Learn about Dependency Injection',
+            href: '/docs/di/introduction',
+          },
+          {
+            children: 'Advanced',
+            title: 'Learn about Advanced',
+            href: '/docs/advanced/subscriptions',
+          },
+          {
+            children: 'Recipes',
+            title: 'Learn about Recipes',
+            href: '/docs/recipes/dataloader',
+          },
+        ]}
+      />
+    </ThemeProvider>
   );
 }