export markdown from docs (#1358)

Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>
2020-12-09 10:41:05 +05:30
parent 27d71fb10f
commit bfa7eb0c19
5 changed files with 372 additions and 15 deletions
--- a/assets/md/docs.md
+++ b/assets/md/docs.md
@@ -0,0 +1,221 @@
+{{#collections}}
+
+# {{name}}
+
+## {{#folders}}
+
+## Folder: {{name}}
+
+{{#requests}}
+
+### {{name}}
+
+**Method**: {{method}}
+
+**RequestURL**: `{{{url}}}{{{path}}}`
+
+{{#isHeaders}}
+**Headers**:
+
+<table>
+<tr>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#headers}}
+<tr>
+<td>{{{key}}}</td>
+<td>`{{{value}}}`</td>
+</tr>
+{{/headers}}
+</table>
+{{/isHeaders}}
+
+{{#isParams}}
+**Params**:
+
+<table>
+<tr>
+<th>type</th>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#params}}
+<tr>
+<td>{{type}}</td>
+<td>{{{key}}}</td>
+<td>{{{value}}}</td>
+</tr>
+{{/params}}
+</table>
+{{/isParams}}
+
+{{#isAuth}}
+**Authentication Type**: {{{auth}}}  
+{{/isAuth}}
+
+{{#bearerToken}}
+**BearerToken**: `{{{.}}}`
+{{/bearerToken}}
+
+{{#isAuthBasic}}
+Username: `{{{httpUser}}}`  
+Password: `{{{httpPassword}}}`
+{{/isAuthBasic}}
+
+{{#isRawParams}}
+**RawParams**:
+
+```json
+{{{rawParams}}}
+```
+
+{{/isRawParams}}
+
+{{#contentType}}
+**ContentType**: `{{{contentType}}}`
+{{/contentType}}
+
+{{#preRequestScript}}
+**Pre Request Script**:
+
+```js
+{
+  {
+    {
+      preRequestScript
+    }
+  }
+}
+```
+
+{{/preRequestScript}}
+
+{{#testScript}}
+**Test Script**:
+
+```js
+{
+  {
+    {
+      testScript
+    }
+  }
+}
+```
+
+{{/testScript}}
+
+{{/requests}}
+
+---
+
+{{/folders}}
+
+{{#requests}}
+
+## {{name}}
+
+**Method**: {{method}}
+
+**RequestURL**: `{{{url}}}{{{path}}}`
+
+{{#isHeaders}}
+**Headers**:
+
+<table>
+<tr>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#headers}}
+<tr>
+<td>{{{key}}}</td>
+<td>`{{{value}}}`</td>
+</tr>
+{{/headers}}
+</table>
+{{/isHeaders}}
+
+{{#isParams}}
+**Params**:
+
+<table>
+<tr>
+<th>type</th>
+<th>Key</th>
+<th>Value</th>
+</tr>
+{{#params}}
+<tr>
+<td>{{type}}</td>
+<td>{{{key}}}</td>
+<td>{{{value}}}</td>
+</tr>
+{{/params}}
+</table>
+{{/isParams}}
+
+{{#isAuth}}
+**Authentication Type**: {{{auth}}}  
+{{/isAuth}}
+
+{{#bearerToken}}
+**BearerToken**: `{{{.}}}`
+{{/bearerToken}}
+
+{{#isAuthBasic}}
+Username: `{{{httpUser}}}`  
+Password: `{{{httpPassword}}}`
+{{/isAuthBasic}}
+
+{{#isRawParams}}
+**RawParams**:
+
+```json
+{{{rawParams}}}
+```
+
+{{/isRawParams}}
+
+{{#contentType}}
+**ContentType**: `{{{contentType}}}`
+{{/contentType}}
+
+{{#preRequestScript}}
+**Pre Request Script**:
+
+```js
+{
+  {
+    {
+      preRequestScript
+    }
+  }
+}
+```
+
+{{/preRequestScript}}
+
+{{#testScript}}
+**Test Script**:
+
+```js
+{
+  {
+    {
+      testScript
+    }
+  }
+}
+```
+
+{{/testScript}}
+
+{{/requests}}
+
+{{/collections}}
+
+---
+
+Made with [Hoppscotch](https://github.com/hoppscotch/hoppscotch)
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -321,6 +321,11 @@ export default {
          use: { loader: "worker-loader" },
          exclude: /(node_modules)/,
        })
+        config.module.rules.push({
+          test: /\.md$/i,
+          use: { loader: "raw-loader" },
+          exclude: /(node_modules)/,
+        })
      }
    },
    parallel: true,
--- a/package-lock.json
+++ b/package-lock.json
@@ -3382,6 +3382,11 @@
          "version": "0.3.1",
          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
          "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
+        },
+        "mustache": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.2.tgz",
+          "integrity": "sha512-KpMNwdQsYz3O/SBS1qJ/o3sqUJ5wSb8gb0pul8CO0S56b9Y2ALm8zCfsjPXsqGFfoNBkDwZuZIAjhsZI03gYVQ=="
        }
      }
    },
@@ -11454,9 +11459,9 @@
      }
    },
    "mustache": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.2.tgz",
-      "integrity": "sha512-KpMNwdQsYz3O/SBS1qJ/o3sqUJ5wSb8gb0pul8CO0S56b9Y2ALm8zCfsjPXsqGFfoNBkDwZuZIAjhsZI03gYVQ=="
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.0.1.tgz",
+      "integrity": "sha512-yL5VE97+OXn4+Er3THSmTdCFCtx5hHWzrolvH+JObZnUYwuaG7XV+Ch4fR2cIrcYI0tFHxS7iyFYl14bW8y2sA=="
    },
    "mute-stream": {
      "version": "0.0.8",
@@ -13914,6 +13919,52 @@
        "unpipe": "1.0.0"
      }
    },
+    "raw-loader": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-4.0.2.tgz",
+      "integrity": "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==",
+      "dev": true,
+      "requires": {
+        "loader-utils": "^2.0.0",
+        "schema-utils": "^3.0.0"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "6.12.6",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+          "dev": true,
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "fast-json-stable-stringify": "^2.0.0",
+            "json-schema-traverse": "^0.4.1",
+            "uri-js": "^4.2.2"
+          }
+        },
+        "loader-utils": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
+          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "schema-utils": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
+          "integrity": "sha512-6D82/xSzO094ajanoOSbe4YvXWMfn2A//8Y1+MUqFAJul5Bs+yn36xbK9OtNDcRVSBJ9jjeoXftM6CfztsjOAA==",
+          "dev": true,
+          "requires": {
+            "@types/json-schema": "^7.0.6",
+            "ajv": "^6.12.5",
+            "ajv-keywords": "^3.5.2"
+          }
+        }
+      }
+    },
    "rc9": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/rc9/-/rc9-1.2.0.tgz",
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
    "firebase": "^8.1.2",
    "graphql": "^15.4.0",
    "graphql-language-service-interface": "^2.4.3",
+    "mustache": "^4.0.1",
    "nuxt": "^2.14.10",
    "nuxt-i18n": "^6.15.4",
    "paho-mqtt": "^1.1.0",
@@ -62,6 +63,7 @@
    "jest-serializer-vue": "^2.0.2",
    "prettier": "^2.2.1",
    "pretty-quick": "^3.1.0",
+    "raw-loader": "^4.0.2",
    "sass": "^1.30.0",
    "sass-loader": "^10.1.0",
    "vue-jest": "^3.0.7",
--- a/pages/doc.vue
+++ b/pages/doc.vue
@@ -72,6 +72,28 @@
          <p v-if="this.items.length === 0" class="info">
            {{ $t("generate_docs_first") }}
          </p>
+          <div v-else class="row-wrapper">
+            <div
+              v-tooltip.bottom="{
+                content: !fb.currentUser
+                  ? $t('login_with_github_to') + $t('create_secret_gist')
+                  : fb.currentUser.provider !== 'github.com'
+                  ? $t('login_with_github_to') + $t('create_secret_gist')
+                  : null,
+              }"
+            >
+              <button
+                :disabled="
+                  !fb.currentUser ? true : fb.currentUser.provider !== 'github.com' ? true : false
+                "
+                class="icon"
+                @click="createDocsGist"
+              >
+                <i class="material-icons">code</i>
+                <span>{{ $t("create_secret_gist") }}</span>
+              </button>
+            </div>
+          </div>
          <div>
            <span class="collection" v-for="(collection, index) in this.items" :key="index">
              <h2>
@@ -147,9 +169,9 @@
                      </span>
                    </p>
                  </span>
-                  <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
-                  <span v-if="request.bodyParam">
-                    <p v-for="payload in request.bodyParam" :key="payload.key" class="doc-desc">
+                  <h4 v-if="request.bodyParams">{{ $t("payload") }}</h4>
+                  <span v-if="request.bodyParams">
+                    <p v-for="payload in request.bodyParams" :key="payload.key" class="doc-desc">
                      <span>
                        {{ payload.key || $t("none") }}:
                        <code>{{ payload.value || $t("none") }}</code>
@@ -243,9 +265,9 @@
                    </span>
                  </p>
                </span>
-                <h4 v-if="request.bodyParam">{{ $t("payload") }}</h4>
-                <span v-if="request.bodyParam">
-                  <p v-for="payload in request.bodyParam" :key="payload.key" class="doc-desc">
+                <h4 v-if="request.bodyParams">{{ $t("payload") }}</h4>
+                <span v-if="request.bodyParams">
+                  <p v-for="payload in request.bodyParams" :key="payload.key" class="doc-desc">
                    <span>
                      {{ payload.key || $t("none") }}:
                      <code>{{ payload.value || $t("none") }}</code>
@@ -292,27 +314,27 @@
  @apply flex-col;
  @apply justify-center;
  @apply flex-1;
-  @apply p-8;
+  @apply p-4;

  .material-icons {
-    @apply mr-8;
+    @apply mr-4;
  }
 }

 .folder {
  @apply border-l;
  @apply border-brdColor;
-  @apply mt-8;
+  @apply mt-4;
 }

 .request {
  @apply border;
  @apply border-brdColor;
  @apply rounded-lg;
-  @apply mt-8;
+  @apply mt-4;

  h4 {
-    @apply mt-8;
+    @apply mt-4;
  }
 }

@@ -330,16 +352,53 @@
 </style>

 <script>
+import { fb } from "~/helpers/fb"
+import Mustache from "mustache"
+import DocsTemplate from "~/assets/md/docs.md"
+
 export default {
  data() {
    return {
+      fb,
      collectionJSON: "[]",
      items: [],
+      docsMarkdown: "",
    }
  },
  methods: {
+    async createDocsGist() {
+      await this.$axios
+        .$post(
+          "https://api.github.com/gists",
+          {
+            files: {
+              "api-docs.md": {
+                content: this.docsMarkdown,
+              },
+            },
+          },
+          {
+            headers: {
+              Authorization: `token ${fb.currentUser.accessToken}`,
+              Accept: "application/vnd.github.v3+json",
+            },
+          }
+        )
+        .then((response) => {
+          this.$toast.success(this.$t("gist_created"), {
+            icon: "done",
+          })
+          window.open(response.html_url)
+        })
+        .catch((error) => {
+          this.$toast.error(this.$t("something_went_wrong"), {
+            icon: "error",
+          })
+          console.log(error)
+        })
+    },
+
    uploadCollection() {
-      this.rawInput = true
      let file = this.$refs.collectionUpload.files[0]
      if (file !== undefined && file !== null) {
        let reader = new FileReader()
@@ -365,6 +424,25 @@ export default {
        this.$toast.info(this.$t("docs_generated"), {
          icon: "book",
        })
+        const docsMarkdown = Mustache.render(DocsTemplate, {
+          collections: this.items,
+          isHeaders() {
+            return this.headers.length
+          },
+          isParams() {
+            return this.params.length
+          },
+          isAuth() {
+            return this.auth !== "None"
+          },
+          isAuthBasic() {
+            return this.httpUser && this.httpPassword
+          },
+          isRawParams() {
+            return this.rawParams && this.rawParams !== "{}"
+          },
+        })
+        this.docsMarkdown = docsMarkdown.replace(/^\s*[\r\n]/gm, "\n")
      } catch (e) {
        this.$toast.error(e, {
          icon: "code",