From 318ea5fbb59f3cde83e25a35b1e730152cc983c3 Mon Sep 17 00:00:00 2001
From: endiliey <endiliey@gmail.com>
Date: Sat, 15 Sep 2018 00:25:12 +0800
Subject: [PATCH] feat: add next/prev button for docs according to sidebar

---
 lib/load/docs/metadata.js |  6 +++---
 lib/theme/Docs/index.js   | 28 ++++++++++++++++++++++++++--
 website/sidebars.json     | 13 +++++++++++++
 3 files changed, 42 insertions(+), 5 deletions(-)
 create mode 100644 website/sidebars.json

diff --git a/lib/load/docs/metadata.js b/lib/load/docs/metadata.js
index a3e1d9bb46..a4d13d1eb3 100644
--- a/lib/load/docs/metadata.js
+++ b/lib/load/docs/metadata.js
@@ -144,14 +144,14 @@ module.exports = async function processMetadata(
     metadata.id = `version-${version}-${metadata.id}`;
   }
 
+  /* save localized id before adding language on it*/
+  metadata.localized_id = metadata.id;
+
   /* if language */
   if (language) {
     metadata.id = `${language}-${metadata.id}`;
   }
 
-  /* localize id */
-  metadata.localized_id = metadata.id;
-
   /* Determine order */
   const id = metadata.localized_id;
   if (order[id]) {
diff --git a/lib/theme/Docs/index.js b/lib/theme/Docs/index.js
index e74b8586b3..32670ad907 100644
--- a/lib/theme/Docs/index.js
+++ b/lib/theme/Docs/index.js
@@ -6,13 +6,37 @@ import Layout from '@theme/Layout'; // eslint-disable-line
 
 export default class Docs extends React.Component {
   render() {
-    const {route, siteConfig, metadata} = this.props;
+    const {route, siteConfig, docsMetadata, metadata} = this.props;
     return (
       <Layout {...this.props}>
         <Helmet>
           <title>{(metadata && metadata.title) || siteConfig.title}</title>
         </Helmet>
-        <div className={styles.mainContainer}>{this.props.children}</div>
+        <div className="docs-prevnext">
+          {metadata.previous &&
+            docsMetadata[metadata.previous] && (
+              <a
+                className="docs-prev button"
+                href={docsMetadata[metadata.previous].permalink}>
+                <span className="arrow-prev">← </span>
+                <span>{metadata.previous_title}</span>
+              </a>
+            )}
+        </div>
+        <div className="docs-prevnext">
+          {metadata.next &&
+            docsMetadata[metadata.next] && (
+              <a
+                className="docs-prev button"
+                href={docsMetadata[metadata.next].permalink}>
+                <span>{metadata.next_title}</span>
+                <span className="arrow-prev">→ </span>
+              </a>
+            )}
+        </div>
+        <div className={styles.mainContainer}>
+        {this.props.children}
+        </div>
       </Layout>
     );
   }
diff --git a/website/sidebars.json b/website/sidebars.json
new file mode 100644
index 0000000000..0c61221124
--- /dev/null
+++ b/website/sidebars.json
@@ -0,0 +1,13 @@
+{
+  "docs": {
+    "Foo": [
+      "foo/bar",
+      "foo/baz"
+    ],
+    "Endi": [
+      "docusaurus",
+      "highlight",
+      "hello"
+    ]
+  }
+}