From ad2667a86f74bb2ab80e780b4676cc1979306fc9 Mon Sep 17 00:00:00 2001
From: Stuart Clark <stu@rtclark.net>
Date: Mon, 30 Aug 2021 10:20:27 +0000
Subject: [PATCH] feat(#179): add Modules section to docs site

---
 docs/components/app/icon/Modules.vue | 16 ++++++++++++
 docs/pages/modules.vue               |  7 +++++
 docs/pages/modules/_.vue             | 38 ++++++++++++++++++++++++++++
 docs/pages/modules/index.vue         |  7 +++++
 docs/store/index.js                  | 28 ++++++++++++++------
 docs/store/state.js                  | 13 +++++++---
 6 files changed, 98 insertions(+), 11 deletions(-)
 create mode 100644 docs/components/app/icon/Modules.vue
 create mode 100644 docs/pages/modules.vue
 create mode 100644 docs/pages/modules/_.vue
 create mode 100644 docs/pages/modules/index.vue

diff --git a/docs/components/app/icon/Modules.vue b/docs/components/app/icon/Modules.vue
new file mode 100644
index 000000000..7d4370d72
--- /dev/null
+++ b/docs/components/app/icon/Modules.vue
@@ -0,0 +1,16 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    class="h-6 w-6"
+    fill="none"
+    viewBox="0 0 24 24"
+    stroke="currentColor"
+  >
+    <path
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      stroke-width="2"
+      d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4"
+    />
+  </svg>
+</template>
diff --git a/docs/pages/modules.vue b/docs/pages/modules.vue
new file mode 100644
index 000000000..0810a8967
--- /dev/null
+++ b/docs/pages/modules.vue
@@ -0,0 +1,7 @@
+<template>
+  <div class="container mx-auto my-20 px-5">
+    <h1 class="text-4xl text-secondary border-b mb-10">Modules</h1>
+
+    <NuxtChild />
+  </div>
+</template>
diff --git a/docs/pages/modules/_.vue b/docs/pages/modules/_.vue
new file mode 100644
index 000000000..391957d48
--- /dev/null
+++ b/docs/pages/modules/_.vue
@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <!-- TODO: Add breadcrumb / path -->
+    <h2 class="mb-5 text-3xl">{{ document.title }}</h2>
+
+    <NuxtContent
+      v-if="document"
+      class="prose prose-sm sm:prose lg:prose-lg xl:prose-xl"
+      :document="document"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: "AppGuideDocument",
+
+  async asyncData({ $content, error, params, store, route }) {
+    const path = params.pathMatch || "README";
+    let response;
+    try {
+      response = await $content("modules/", params.pathMatch || "README").fetch();
+    } catch (e) {
+      return error({ message: "Document not found" });
+    }
+
+    store.commit("addRecent", { text: response.title, to: route.path });
+
+    return { document: response, path };
+  },
+
+  head() {
+    return {
+      title: this.document.title,
+    };
+  },
+};
+</script>
diff --git a/docs/pages/modules/index.vue b/docs/pages/modules/index.vue
new file mode 100644
index 000000000..cf1fb7062
--- /dev/null
+++ b/docs/pages/modules/index.vue
@@ -0,0 +1,7 @@
+<script>
+import Default from "./_.vue";
+
+export default {
+  extends: Default,
+};
+</script>
diff --git a/docs/store/index.js b/docs/store/index.js
index 415e8b2e6..fb0b74d74 100644
--- a/docs/store/index.js
+++ b/docs/store/index.js
@@ -1,23 +1,35 @@
 export const actions = {
-  async nuxtServerInit ({ commit }, { $content }) {
+  async nuxtServerInit({ commit }, { $content }) {
     try {
+      // Add Modules menu children to the vuex store.
+      const moduleIndex = await $content("modules").sortBy("title").only(["path", "title"]).fetch();
+      const modules = moduleIndex
+        .filter((o) => !o.path.endsWith("/README"))
+        .map((o) => ({
+          component: "NuxtLink",
+          text: o.title,
+          props: { to: o.path },
+        }));
+      commit("addMenuChildren", { children: modules, parent: "/modules" });
+
       // Add Guide menu children to the vuex store.
-      const apiIndex = await $content("api").only(["path", "title"]).fetch();
-      const apiChildren = apiIndex.map((o) => ({
+      const guideIndex = await $content("guide").only(["path", "title"]).fetch();
+      const guideChildren = guideIndex.map((o) => ({
         component: "NuxtLink",
         text: o.title,
         props: { to: o.path.replace("/README", "") },
       }));
-      commit("addMenuChildren", { children: apiChildren, parent: "/api" });
+      commit("addMenuChildren", { children: guideChildren, parent: "/guide" });
 
-      // Add Guide menu children to the vuex store.
-      const guideIndex = await $content("guide").only(["path", "title"]).fetch();
-      const guideChildren = guideIndex.map((o) => ({
+      // Add API menu children to the vuex store.
+      const apiIndex = await $content("api").only(["path", "title"]).fetch();
+      const apiChildren = apiIndex.map((o) => ({
         component: "NuxtLink",
         text: o.title,
         props: { to: o.path.replace("/README", "") },
       }));
-      commit("addMenuChildren", { children: guideChildren, parent: "/guide" });
+      commit("addMenuChildren", { children: apiChildren, parent: "/api" });
+
     } catch (err) {
       console.log(err)
     }
diff --git a/docs/store/state.js b/docs/store/state.js
index 64cd03a1a..57c495858 100644
--- a/docs/store/state.js
+++ b/docs/store/state.js
@@ -9,9 +9,9 @@ export default () => ({
   },
   {
     component: "NuxtLink",
-    text: "API",
-    icon: "api",
-    props: { to: "/api" },
+    text: "Modules",
+    icon: "modules",
+    props: { to: "/modules" },
     children: [],
   },
   {
@@ -21,6 +21,13 @@ export default () => ({
     props: { to: "/guide" },
     children: [],
   },
+  {
+    component: "NuxtLink",
+    text: "API",
+    icon: "api",
+    props: { to: "/api" },
+    children: [],
+  },
   {
     component: "a",
     text: "GitHub",