From ac098880a7fe6d58aa241381ee7bfcab05746442 Mon Sep 17 00:00:00 2001
From: Kristofer Selbekk <selbeezy@gmail.com>
Date: Sun, 7 Oct 2018 19:46:41 +0200
Subject: [PATCH] Move adding relay to its own file

---
 docusaurus/docs/adding-relay.md  | 36 ++++++++++++++++++++++++++++++++
 docusaurus/docs/user-guide.md    | 35 -------------------------------
 docusaurus/website/sidebars.json |  3 ++-
 3 files changed, 38 insertions(+), 36 deletions(-)
 create mode 100644 docusaurus/docs/adding-relay.md

diff --git a/docusaurus/docs/adding-relay.md b/docusaurus/docs/adding-relay.md
new file mode 100644
index 00000000..90e7eb33
--- /dev/null
+++ b/docusaurus/docs/adding-relay.md
@@ -0,0 +1,36 @@
+---
+id: adding-relay
+title: Adding Relay
+---
+
+Relay is a framework for building data-driven React applications powered by GraphQL. The current release candidate of Relay works with Create React App projects out of the box using Babel Macros. Simply set up your project as laid out in the [Relay documentation](https://facebook.github.io/relay/), then make sure you have a version of the babel plugin providing the macro.
+
+To add it, run:
+
+```sh
+npm install --save --dev babel-plugin-relay@dev
+```
+
+Alternatively you may use `yarn`:
+
+```sh
+yarn upgrade babel-plugin-relay@dev
+```
+
+Then, wherever you use the `graphql` template tag, import the macro:
+
+```js
+import graphql from 'babel-plugin-relay/macro';
+// instead of:
+//   import { graphql } from "babel-plugin-relay"
+
+graphql`
+  query UserQuery {
+    viewer {
+      id
+    }
+  }
+`;
+```
+
+To learn more about Relay, check out [its documentation](https://facebook.github.io/relay/).
diff --git a/docusaurus/docs/user-guide.md b/docusaurus/docs/user-guide.md
index 10573c70..67db4627 100644
--- a/docusaurus/docs/user-guide.md
+++ b/docusaurus/docs/user-guide.md
@@ -11,7 +11,6 @@ You can find the most recent version of this guide [here](https://github.com/fac
 
 ## Table of Contents
 
-- [Adding Relay](#adding-relay)
 - [Adding a Router](#adding-a-router)
 - [Adding Custom Environment Variables](#adding-custom-environment-variables)
   - [Referencing Environment Variables in the HTML](#referencing-environment-variables-in-the-html)
@@ -33,40 +32,6 @@ You can find the most recent version of this guide [here](https://github.com/fac
 - [Advanced Configuration](#advanced-configuration)
 - [Alternatives to Ejecting](#alternatives-to-ejecting)
 
-## Adding Relay
-
-Relay is a framework for building data-driven React applications powered by GraphQL. The current release candidate of Relay works with Create React App projects out of the box using Babel Macros. Simply set up your project as laid out in the [Relay documentation](https://facebook.github.io/relay/), then make sure you have a version of the babel plugin providing the macro.
-
-To add it, run:
-
-```sh
-npm install --save --dev babel-plugin-relay@dev
-```
-
-Alternatively you may use `yarn`:
-
-```sh
-yarn upgrade babel-plugin-relay@dev
-```
-
-Then, wherever you use the `graphql` template tag, import the macro:
-
-```js
-import graphql from 'babel-plugin-relay/macro';
-// instead of:
-//   import { graphql } from "babel-plugin-relay"
-
-graphql`
-  query UserQuery {
-    viewer {
-      id
-    }
-  }
-`;
-```
-
-To learn more about Relay, check out [its documentation](https://facebook.github.io/relay/).
-
 ## Adding a Router
 
 Create React App doesn't prescribe a specific routing solution, but [React Router](https://reacttraining.com/react-router/web/) is the most popular one.
diff --git a/docusaurus/website/sidebars.json b/docusaurus/website/sidebars.json
index f15b7622..b4373e75 100644
--- a/docusaurus/website/sidebars.json
+++ b/docusaurus/website/sidebars.json
@@ -29,7 +29,8 @@
       "using-the-public-folder",
       "using-global-variables",
       "adding-bootstrap",
-      "adding-flow"
+      "adding-flow",
+      "adding-relay"
     ],
     "Testing": ["running-tests", "debugging-tests"],
     "Deployment": ["publishing-components-to-npm", "deployment"],