From 5b1a2ca7a376b5bb03daea08466a42112e027800 Mon Sep 17 00:00:00 2001
From: Almeida <almeidx@pm.me>
Date: Fri, 7 May 2021 21:21:51 +0100
Subject: [PATCH 1/2] added legacy plugins section

---
 backend/src/api/docs.ts                       |   2 +-
 backend/src/plugins/Censor/CensorPlugin.ts    |   1 +
 backend/src/plugins/Spam/SpamPlugin.ts        |   1 +
 .../src/plugins/ZeppelinPluginBlueprint.ts    |   1 +
 backend/src/types.ts                          |   1 +
 dashboard/src/components/docs/DocsLayout.vue  | 243 ++++++++++--------
 6 files changed, 137 insertions(+), 112 deletions(-)

diff --git a/backend/src/api/docs.ts b/backend/src/api/docs.ts
index 3009a4e1..8dbeb116 100644
--- a/backend/src/api/docs.ts
+++ b/backend/src/api/docs.ts
@@ -37,7 +37,7 @@ export function initDocs(app: express.Express) {
   app.get("/docs/plugins", (req: express.Request, res: express.Response) => {
     res.json(
       docsPlugins.map(plugin => {
-        const thinInfo = plugin.info ? { prettyName: plugin.info.prettyName } : {};
+        const thinInfo = plugin.info ? { prettyName: plugin.info.prettyName, legacy: plugin.info.legacy ?? false } : {};
         return {
           name: plugin.name,
           info: thinInfo,
diff --git a/backend/src/plugins/Censor/CensorPlugin.ts b/backend/src/plugins/Censor/CensorPlugin.ts
index f8401f54..27f8ed9f 100644
--- a/backend/src/plugins/Censor/CensorPlugin.ts
+++ b/backend/src/plugins/Censor/CensorPlugin.ts
@@ -52,6 +52,7 @@ export const CensorPlugin = zeppelinGuildPlugin<CensorPluginType>()({
       Censor words, tokens, links, regex, etc.
       For more advanced filtering, check out the Automod plugin!
     `),
+    legacy: true,
   },
 
   dependencies: [LogsPlugin],
diff --git a/backend/src/plugins/Spam/SpamPlugin.ts b/backend/src/plugins/Spam/SpamPlugin.ts
index ddf45a0b..87dc50ad 100644
--- a/backend/src/plugins/Spam/SpamPlugin.ts
+++ b/backend/src/plugins/Spam/SpamPlugin.ts
@@ -51,6 +51,7 @@ export const SpamPlugin = zeppelinGuildPlugin<SpamPluginType>()({
       Basic spam detection and auto-muting.
       For more advanced spam filtering, check out the Automod plugin!
     `),
+    legacy: true,
   },
 
   dependencies: [LogsPlugin],
diff --git a/backend/src/plugins/ZeppelinPluginBlueprint.ts b/backend/src/plugins/ZeppelinPluginBlueprint.ts
index 7a1dd44a..9bcd3417 100644
--- a/backend/src/plugins/ZeppelinPluginBlueprint.ts
+++ b/backend/src/plugins/ZeppelinPluginBlueprint.ts
@@ -27,6 +27,7 @@ export interface ZeppelinGuildPluginBlueprint<TPluginData extends GuildPluginDat
     description?: TMarkdown;
     usageGuide?: TMarkdown;
     configurationGuide?: TMarkdown;
+    legacy?: boolean;
   };
 
   configPreprocessor?: (
diff --git a/backend/src/types.ts b/backend/src/types.ts
index 9f9c1a53..6f24a7fd 100644
--- a/backend/src/types.ts
+++ b/backend/src/types.ts
@@ -49,6 +49,7 @@ export interface ZeppelinPluginInfo {
   description?: TMarkdown;
   usageGuide?: TMarkdown;
   configurationGuide?: TMarkdown;
+  legacy?: boolean;
 }
 
 export interface CommandInfo {
diff --git a/dashboard/src/components/docs/DocsLayout.vue b/dashboard/src/components/docs/DocsLayout.vue
index e8657d8a..00fae071 100644
--- a/dashboard/src/components/docs/DocsLayout.vue
+++ b/dashboard/src/components/docs/DocsLayout.vue
@@ -5,17 +5,14 @@
     <!-- Top bar -->
     <nav class="flex items-stretch pl-4 pr-2 py-1 border border-gray-700 rounded bg-gray-800 shadow-xl">
       <div class="flex-initial flex items-center">
-        <img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true">
+        <img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true" />
 
         <router-link to="/docs">
           <h1 class="flex-auto font-semibold">Zeppelin Documentation</h1>
         </router-link>
       </div>
       <div class="flex-1 flex items-center justify-end">
-        <router-link
-          to="/dashboard"
-          role="menuitem"
-          class="py-1 px-2 rounded hover:bg-gray-700 hidden lg:block">
+        <router-link to="/dashboard" role="menuitem" class="py-1 px-2 rounded hover:bg-gray-700 hidden lg:block">
           Go to dashboard
         </router-link>
         <button class="link-button text-2xl leading-zero lg:hidden" v-on:click="toggleMobileMenu()" aria-hidden="true">
@@ -29,12 +26,23 @@
     <!-- Content wrapper -->
     <div class="flex flex-wrap items-start mt-8">
       <!-- Sidebar -->
-      <nav class="docs-sidebar px-4 pt-2 pb-3 mr-8 mb-4 border border-gray-700 rounded bg-gray-800 shadow-md flex-full lg:flex-none lg:block" v-bind:class="{ closed: !mobileMenuOpen }">
+      <nav
+        class="docs-sidebar px-4 pt-2 pb-3 mr-8 mb-4 border border-gray-700 rounded bg-gray-800 shadow-md flex-full lg:flex-none lg:block"
+        v-bind:class="{ closed: !mobileMenuOpen }"
+      >
         <div role="none" v-for="(group, index) in menu">
-          <h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{'mt-4': index !== 0}">{{ group.label }}</h1>
+          <h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{ 'mt-4': index !== 0 }">
+            {{ group.label }}
+          </h1>
           <ul v-bind:id="'menu-group-' + index" role="group" class="list-none pl-2">
             <li role="none" v-for="item in group.items">
-              <router-link role="menuitem" :to="item.to" class="text-gray-300 hover:text-gray-500" v-on:click.native="onChooseMenuItem()">{{ item.label }}</router-link>
+              <router-link
+                role="menuitem"
+                :to="item.to"
+                class="text-gray-300 hover:text-gray-500"
+                v-on:click.native="onChooseMenuItem()"
+                >{{ item.label }}</router-link
+              >
             </li>
           </ul>
         </div>
@@ -50,118 +58,131 @@
 </template>
 
 <script lang="ts">
-  import Vue from "vue";
-  import {mapState} from "vuex";
-  import Menu from 'vue-material-design-icons/Menu.vue';
-  import Title from "../Title.vue";
+import Vue from "vue";
+import { mapState } from "vuex";
+import Menu from "vue-material-design-icons/Menu.vue";
+import Title from "../Title.vue";
 
-  type TMenuItem = {
-    to: string;
-    label: string;
-  };
-  type TMenuGroup = {
-    label: string;
-    items: TMenuItem[];
-  };
-  type TMenu = TMenuGroup[];
+type TMenuItem = {
+  to: string;
+  label: string;
+};
+type TMenuGroup = {
+  label: string;
+  items: TMenuItem[];
+};
+type TMenu = TMenuGroup[];
 
-  const menu: TMenu = [
-    {
-      label: 'General',
-      items: [
-        {
-          to: '/docs/introduction',
-          label: 'Introduction',
-        },
-      ],
-    },
-
-    {
-      label: 'Configuration',
-      items: [
-        {
-          to: '/docs/configuration/configuration-format',
-          label: 'Configuration format',
-        },
-        {
-          to: '/docs/configuration/plugin-configuration',
-          label: 'Plugin configuration',
-        },
-        {
-          to: '/docs/configuration/permissions',
-          label: 'Permissions',
-        },
-      ],
-    },
-
-    {
-      label: 'Reference',
-      items: [
-        {
-          to: '/docs/reference/argument-types',
-          label: 'Argument types',
-        },
-      ],
-    },
-
-    {
-      label: 'Setup guides',
-      items: [
-        {
-          to: '/docs/setup-guides/logs',
-          label: 'Logs',
-        },
-        {
-          to: '/docs/setup-guides/moderation',
-          label: 'Moderation',
-        },
-        {
-          to: '/docs/setup-guides/counters',
-          label: 'Counters',
-        },
-      ],
-    },
-  ];
-
-  export default {
-    components: { Menu, Title },
-    async mounted() {
-      await this.$store.dispatch("docs/loadAllPlugins");
-    },
-
-    data() {
-      return {
-        mobileMenuOpen: false
-      };
-    },
-
-    methods: {
-      toggleMobileMenu() {
-        this.mobileMenuOpen = !this.mobileMenuOpen;
+const menu: TMenu = [
+  {
+    label: "General",
+    items: [
+      {
+        to: "/docs/introduction",
+        label: "Introduction",
       },
+    ],
+  },
 
-      onChooseMenuItem() {
-        this.mobileMenuOpen = false;
-        this.$refs['main-anchor'].focus();
+  {
+    label: "Configuration",
+    items: [
+      {
+        to: "/docs/configuration/configuration-format",
+        label: "Configuration format",
       },
+      {
+        to: "/docs/configuration/plugin-configuration",
+        label: "Plugin configuration",
+      },
+      {
+        to: "/docs/configuration/permissions",
+        label: "Permissions",
+      },
+    ],
+  },
+
+  {
+    label: "Reference",
+    items: [
+      {
+        to: "/docs/reference/argument-types",
+        label: "Argument types",
+      },
+    ],
+  },
+
+  {
+    label: "Setup guides",
+    items: [
+      {
+        to: "/docs/setup-guides/logs",
+        label: "Logs",
+      },
+      {
+        to: "/docs/setup-guides/moderation",
+        label: "Moderation",
+      },
+      {
+        to: "/docs/setup-guides/counters",
+        label: "Counters",
+      },
+    ],
+  },
+];
+
+export default {
+  components: { Menu, Title },
+  async mounted() {
+    await this.$store.dispatch("docs/loadAllPlugins");
+  },
+
+  data() {
+    return {
+      mobileMenuOpen: false,
+    };
+  },
+
+  methods: {
+    toggleMobileMenu() {
+      this.mobileMenuOpen = !this.mobileMenuOpen;
     },
 
-    computed: {
-      ...mapState('docs', {
-        plugins: 'allPlugins',
-      }),
-      menu() {
-        return [
-          ...menu,
-          {
-            label: 'Plugins',
-            items: this.plugins.map(plugin => ({
+    onChooseMenuItem() {
+      this.mobileMenuOpen = false;
+      this.$refs["main-anchor"].focus();
+    },
+  },
+
+  computed: {
+    ...mapState("docs", {
+      plugins: "allPlugins",
+    }),
+    menu() {
+      console.log(this.plugins);
+
+      return [
+        ...menu,
+        {
+          label: "Plugins",
+          items: this.plugins
+            .filter(plugin => !plugin.info.legacy)
+            .map(plugin => ({
               label: plugin.info.prettyName || plugin.name,
               to: `/docs/plugins/${plugin.name}`,
             })),
-          }
-        ];
-      },
+        },
+        {
+          label: "Legacy Plugins",
+          items: this.plugins
+            .filter(plugin => plugin.info.legacy)
+            .map(plugin => ({
+              label: plugin.info.prettyName || plugin.name,
+              to: `/docs/plugins/${plugin.name}`,
+            })),
+        },
+      ];
     },
-  };
+  },
+};
 </script>

From f1330ad0625ba4250c7342ffc95f6c8cd0973761 Mon Sep 17 00:00:00 2001
From: Almeida <almeidx@pm.me>
Date: Fri, 7 May 2021 21:26:35 +0100
Subject: [PATCH 2/2] revert unnecessary linting changes

---
 dashboard/src/components/docs/DocsLayout.vue | 252 +++++++++----------
 1 file changed, 119 insertions(+), 133 deletions(-)

diff --git a/dashboard/src/components/docs/DocsLayout.vue b/dashboard/src/components/docs/DocsLayout.vue
index 00fae071..48c46183 100644
--- a/dashboard/src/components/docs/DocsLayout.vue
+++ b/dashboard/src/components/docs/DocsLayout.vue
@@ -5,14 +5,17 @@
     <!-- Top bar -->
     <nav class="flex items-stretch pl-4 pr-2 py-1 border border-gray-700 rounded bg-gray-800 shadow-xl">
       <div class="flex-initial flex items-center">
-        <img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true" />
+        <img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true">
 
         <router-link to="/docs">
           <h1 class="flex-auto font-semibold">Zeppelin Documentation</h1>
         </router-link>
       </div>
       <div class="flex-1 flex items-center justify-end">
-        <router-link to="/dashboard" role="menuitem" class="py-1 px-2 rounded hover:bg-gray-700 hidden lg:block">
+        <router-link
+          to="/dashboard"
+          role="menuitem"
+          class="py-1 px-2 rounded hover:bg-gray-700 hidden lg:block">
           Go to dashboard
         </router-link>
         <button class="link-button text-2xl leading-zero lg:hidden" v-on:click="toggleMobileMenu()" aria-hidden="true">
@@ -26,23 +29,12 @@
     <!-- Content wrapper -->
     <div class="flex flex-wrap items-start mt-8">
       <!-- Sidebar -->
-      <nav
-        class="docs-sidebar px-4 pt-2 pb-3 mr-8 mb-4 border border-gray-700 rounded bg-gray-800 shadow-md flex-full lg:flex-none lg:block"
-        v-bind:class="{ closed: !mobileMenuOpen }"
-      >
+      <nav class="docs-sidebar px-4 pt-2 pb-3 mr-8 mb-4 border border-gray-700 rounded bg-gray-800 shadow-md flex-full lg:flex-none lg:block" v-bind:class="{ closed: !mobileMenuOpen }">
         <div role="none" v-for="(group, index) in menu">
-          <h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{ 'mt-4': index !== 0 }">
-            {{ group.label }}
-          </h1>
+          <h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{'mt-4': index !== 0}">{{ group.label }}</h1>
           <ul v-bind:id="'menu-group-' + index" role="group" class="list-none pl-2">
             <li role="none" v-for="item in group.items">
-              <router-link
-                role="menuitem"
-                :to="item.to"
-                class="text-gray-300 hover:text-gray-500"
-                v-on:click.native="onChooseMenuItem()"
-                >{{ item.label }}</router-link
-              >
+              <router-link role="menuitem" :to="item.to" class="text-gray-300 hover:text-gray-500" v-on:click.native="onChooseMenuItem()">{{ item.label }}</router-link>
             </li>
           </ul>
         </div>
@@ -58,131 +50,125 @@
 </template>
 
 <script lang="ts">
-import Vue from "vue";
-import { mapState } from "vuex";
-import Menu from "vue-material-design-icons/Menu.vue";
-import Title from "../Title.vue";
+  import Vue from "vue";
+  import {mapState} from "vuex";
+  import Menu from 'vue-material-design-icons/Menu.vue';
+  import Title from "../Title.vue";
 
-type TMenuItem = {
-  to: string;
-  label: string;
-};
-type TMenuGroup = {
-  label: string;
-  items: TMenuItem[];
-};
-type TMenu = TMenuGroup[];
+  type TMenuItem = {
+    to: string;
+    label: string;
+  };
+  type TMenuGroup = {
+    label: string;
+    items: TMenuItem[];
+  };
+  type TMenu = TMenuGroup[];
 
-const menu: TMenu = [
-  {
-    label: "General",
-    items: [
-      {
-        to: "/docs/introduction",
-        label: "Introduction",
-      },
-    ],
-  },
-
-  {
-    label: "Configuration",
-    items: [
-      {
-        to: "/docs/configuration/configuration-format",
-        label: "Configuration format",
-      },
-      {
-        to: "/docs/configuration/plugin-configuration",
-        label: "Plugin configuration",
-      },
-      {
-        to: "/docs/configuration/permissions",
-        label: "Permissions",
-      },
-    ],
-  },
-
-  {
-    label: "Reference",
-    items: [
-      {
-        to: "/docs/reference/argument-types",
-        label: "Argument types",
-      },
-    ],
-  },
-
-  {
-    label: "Setup guides",
-    items: [
-      {
-        to: "/docs/setup-guides/logs",
-        label: "Logs",
-      },
-      {
-        to: "/docs/setup-guides/moderation",
-        label: "Moderation",
-      },
-      {
-        to: "/docs/setup-guides/counters",
-        label: "Counters",
-      },
-    ],
-  },
-];
-
-export default {
-  components: { Menu, Title },
-  async mounted() {
-    await this.$store.dispatch("docs/loadAllPlugins");
-  },
-
-  data() {
-    return {
-      mobileMenuOpen: false,
-    };
-  },
-
-  methods: {
-    toggleMobileMenu() {
-      this.mobileMenuOpen = !this.mobileMenuOpen;
-    },
-
-    onChooseMenuItem() {
-      this.mobileMenuOpen = false;
-      this.$refs["main-anchor"].focus();
-    },
-  },
-
-  computed: {
-    ...mapState("docs", {
-      plugins: "allPlugins",
-    }),
-    menu() {
-      console.log(this.plugins);
-
-      return [
-        ...menu,
+  const menu: TMenu = [
+    {
+      label: 'General',
+      items: [
         {
-          label: "Plugins",
-          items: this.plugins
-            .filter(plugin => !plugin.info.legacy)
-            .map(plugin => ({
+          to: '/docs/introduction',
+          label: 'Introduction',
+        },
+      ],
+    },
+
+    {
+      label: 'Configuration',
+      items: [
+        {
+          to: '/docs/configuration/configuration-format',
+          label: 'Configuration format',
+        },
+        {
+          to: '/docs/configuration/plugin-configuration',
+          label: 'Plugin configuration',
+        },
+        {
+          to: '/docs/configuration/permissions',
+          label: 'Permissions',
+        },
+      ],
+    },
+
+    {
+      label: 'Reference',
+      items: [
+        {
+          to: '/docs/reference/argument-types',
+          label: 'Argument types',
+        },
+      ],
+    },
+
+    {
+      label: 'Setup guides',
+      items: [
+        {
+          to: '/docs/setup-guides/logs',
+          label: 'Logs',
+        },
+        {
+          to: '/docs/setup-guides/moderation',
+          label: 'Moderation',
+        },
+        {
+          to: '/docs/setup-guides/counters',
+          label: 'Counters',
+        },
+      ],
+    },
+  ];
+
+  export default {
+    components: { Menu, Title },
+    async mounted() {
+      await this.$store.dispatch("docs/loadAllPlugins");
+    },
+
+    data() {
+      return {
+        mobileMenuOpen: false
+      };
+    },
+
+    methods: {
+      toggleMobileMenu() {
+        this.mobileMenuOpen = !this.mobileMenuOpen;
+      },
+
+      onChooseMenuItem() {
+        this.mobileMenuOpen = false;
+        this.$refs['main-anchor'].focus();
+      },
+    },
+
+    computed: {
+      ...mapState('docs', {
+        plugins: 'allPlugins',
+      }),
+      menu() {
+        return [
+          ...menu,
+          {
+            label: 'Plugins',
+            items: this.plugins.filter(plugin => !plugin.info.legacy).map(plugin => ({
               label: plugin.info.prettyName || plugin.name,
               to: `/docs/plugins/${plugin.name}`,
             })),
-        },
-        {
-          label: "Legacy Plugins",
-          items: this.plugins
-            .filter(plugin => plugin.info.legacy)
-            .map(plugin => ({
+          },
+          {
+            label: "Legacy Plugins",
+            items: this.plugins.filter(plugin => plugin.info.legacy).map(plugin => ({
               label: plugin.info.prettyName || plugin.name,
               to: `/docs/plugins/${plugin.name}`,
             })),
-        },
-      ];
+          }
+        ];
+      },
     },
-  },
-};
+  };
 </script>