Add version header link and change current docs to be version 'next'

lib/core/nav/HeaderNav.js

@@ -7,11 +7,20 @@
  * of patent rights can be found in the PATENTS file in the same directory.
  */
 
-const React = require("react");
+const CWD = process.cwd();
 
-const siteConfig = require(process.cwd() + "/siteConfig.js");
+const React = require("react");
+const fs = require("fs");
+const siteConfig = require(CWD + "/siteConfig.js");
 const translation = require("../../server/translation.js");
 
+const ENABLE_TRANSLATION = fs.existsSync(CWD + "/languages.js");
+const ENABLE_VERSIONING = fs.existsSync(CWD + "/versions.json");
+let versions;
+if (ENABLE_VERSIONING) {
+  versions = require(CWD + "/versions.json");
+}
+
 class LanguageDropDown extends React.Component {
   render() {
     const enabledLanguages = [];
@@ -135,6 +144,11 @@ class HeaderNav extends React.Component {
   }
 
   render() {
+    const versionsLink =
+      this.props.baseUrl +
+      (ENABLE_TRANSLATION
+        ? this.props.language + "/versions.html"
+        : "versions.html");
     return (
       <div className="fixedHeaderContainer">
         <div className="headerWrapper wrapper">
@@ -146,6 +160,12 @@ class HeaderNav extends React.Component {
                   {this.props.title}
                 </h2>}
             </a>
+            {ENABLE_VERSIONING &&
+              <a href={versionsLink}>
+                <h3>
+                  {this.props.version || versions[0]}
+                </h3>
+              </a>}
             {this.renderResponsiveNav()}
           </header>
         </div>

lib/server/generate.js

@@ -23,8 +23,10 @@ function execute() {
   const versionFallback = require("./versionFallback.js");
 
   const ENABLE_TRANSLATION = fs.existsSync(CWD + "/languages.js");
+  const ENABLE_VERSIONING = fs.existsSync(CWD + "/versions.json");
+
   let languages;
-  if (fs.existsSync(CWD + "/languages.js")) {
+  if (ENABLE_TRANSLATION) {
     languages = require(CWD + "/languages.js");
   } else {
     languages = [
@@ -84,10 +86,11 @@ function execute() {
   const mdToHtml = {};
   Object.keys(Metadata).forEach(id => {
     const metadata = Metadata[id];
-    if (metadata.language !== "en" || metadata.version) {
+    if (metadata.language !== "en" || metadata.original_id) {
       return;
     }
-    let htmlLink = siteConfig.baseUrl + metadata.permalink;
+    let htmlLink =
+      siteConfig.baseUrl + metadata.permalink.replace("/next/", "/");
     if (htmlLink.includes("/docs/en/")) {
       htmlLink = htmlLink.replace("/docs/en/", "/docs/en/VERSION/");
     } else {
@@ -105,7 +108,7 @@ function execute() {
     const metadata = Metadata[id];
 
     let file;
-    if (metadata.version) {
+    if (metadata.original_id) {
       if (ENABLE_TRANSLATION && metadata.language !== "en") {
         file =
           CWD + "/translated_docs/" + metadata.language + "/" + metadata.source;
@@ -135,13 +138,22 @@ function execute() {
       rawContent = insertTableOfContents(rawContent);
     }
 
+    let latestVersion;
+    if (ENABLE_VERSIONING) {
+      latestVersion = JSON.parse(
+        fs.readFileSync(CWD + "/versions.json", "utf8")
+      )[0];
+    }
+
     /* replace any links to markdown files to their website html links */
     Object.keys(mdToHtml).forEach(function(key, index) {
       let link = mdToHtml[key];
       link = link.replace("/en/", "/" + language + "/");
       link = link.replace(
         "/VERSION/",
-        metadata.version ? "/" + metadata.version + "/" : "/"
+        metadata.version && (metadata.version !== latestVersion)
+          ? "/" + metadata.version + "/"
+          : "/"
       );
       rawContent = rawContent.replace(new RegExp(key, "g"), link);
     });

lib/server/readMetadata.js

@@ -14,7 +14,10 @@ const fs = require("fs");
 const os = require("os");
 const glob = require("glob");
 const siteConfig = require(CWD + "/siteConfig.js");
-const versionFallback = require("./versionFallback");
+const versionFallback = require("./versionFallback.js");
+
+const ENABLE_VERSIONING = fs.existsSync(CWD + "/versions.json");
+
 let languages;
 if (fs.existsSync(CWD + "/languages.js")) {
   languages = require(CWD + "/languages.js");
@@ -94,6 +97,7 @@ function extractMetadata(content) {
   return { metadata, rawContent: both.content };
 }
 
+// process the metadata for a document found in the docs folder
 function processMetadata(file) {
   const result = extractMetadata(fs.readFileSync(file, "utf8"));
   if (!result.metadata || !result.rawContent) {
@@ -118,6 +122,18 @@ function processMetadata(file) {
     metadata.permalink = "docs/" + language + "/" + metadata.id + ".html";
   }
 
+  if (ENABLE_VERSIONING) {
+    metadata.version = "next";
+    if (languages.length === 1 && !siteConfig.useEnglishUrl) {
+      metadata.permalink = metadata.permalink.replace("docs/", "docs/next/");
+    } else {
+      metadata.permalink = metadata.permalink.replace(
+        "docs/" + language + "/",
+        "docs/" + language + "/next/"
+      );
+    }
+  }
+
   // change ids previous, next
   metadata.localized_id = metadata.id;
   metadata.id = language + "-" + metadata.id;

lib/server/server.js

@@ -24,6 +24,7 @@ function execute(port) {
 
   const CWD = process.cwd();
   const ENABLE_TRANSLATION = fs.existsSync(CWD + "/languages.js");
+  const ENABLE_VERSIONING = fs.existsSync(CWD + "/versions.json");
 
   let siteConfig = require(CWD + "/siteConfig.js");
 
@@ -142,10 +143,11 @@ function execute(port) {
     const mdToHtml = {};
     Object.keys(Metadata).forEach(id => {
       const metadata = Metadata[id];
-      if (metadata.language !== "en" || metadata.version) {
+      if (metadata.language !== "en" || metadata.original_id) {
         return;
       }
-      let htmlLink = siteConfig.baseUrl + metadata.permalink;
+      let htmlLink =
+        siteConfig.baseUrl + metadata.permalink.replace("/next/", "/");
       if (htmlLink.includes("/docs/en/")) {
         htmlLink = htmlLink.replace("/docs/en/", "/docs/en/VERSION/");
       } else {
@@ -158,7 +160,7 @@ function execute(port) {
     const language = metadata.language;
 
     let file;
-    if (metadata.version) {
+    if (metadata.original_id) {
       if (ENABLE_TRANSLATION && metadata.language !== "en") {
         file =
           CWD + "/translated_docs/" + metadata.language + "/" + metadata.source;
@@ -187,13 +189,22 @@ function execute(port) {
       rawContent = insertTableOfContents(rawContent);
     }
 
+    let latestVersion;
+    if (ENABLE_VERSIONING) {
+      latestVersion = JSON.parse(
+        fs.readFileSync(CWD + "/versions.json", "utf8")
+      )[0];
+    }
+
     /* replace any links to markdown files to their website html links */
     Object.keys(mdToHtml).forEach(function(key, index) {
       let link = mdToHtml[key];
       link = link.replace("/en/", "/" + language + "/");
       link = link.replace(
         "/VERSION/",
-        metadata.version ? "/" + metadata.version + "/" : "/"
+        metadata.version && (metadata.version !== latestVersion)
+          ? "/" + metadata.version + "/"
+          : "/"
       );
       rawContent = rawContent.replace(new RegExp(key, "g"), link);
     });

lib/server/versionFallback.js

@@ -152,12 +152,23 @@ function diffLatestDoc(file, id) {
 function processVersionMetadata(file, version, useVersion, language) {
   const metadata = extractMetadata(fs.readFileSync(file, "utf8")).metadata;
   metadata.source = "version-" + useVersion + "/" + path.basename(file);
+
+  const latestVersion = versions[0];
+
   if (!ENABLE_TRANSLATION && !siteConfig.useEnglishUrl) {
     metadata.permalink =
-      "docs/" + version + "/" + metadata.original_id + ".html";
+      "docs/" +
+      (version !== latestVersion ? version + "/" : "") +
+      metadata.original_id +
+      ".html";
   } else {
     metadata.permalink =
-      "docs/" + language + "/" + version + "/" + metadata.original_id + ".html";
+      "docs/" +
+      language +
+      "/" +
+      (version !== latestVersion ? version + "/" : "") +
+      metadata.original_id +
+      ".html";
   }
   metadata.id = metadata.id.replace(
     "version-" + useVersion + "-",

lib/static/css/main.css

@@ -512,6 +512,13 @@ header h2 {
   position: relative;
   z-index: 9999;
 }
+.fixedHeaderContainer header h3 {
+  text-decoration: underline;
+  font-family: "Helvetica Neue", Arial, sans-serif;
+  color: white;
+  margin-left: 10px;
+  font-size: 16px;
+}
 
 .promoSection {
   display: flex;