added legacy plugins section

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,

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],

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],

backend/src/plugins/ZeppelinPluginBlueprint.ts

@@ -27,6 +27,7 @@ export interface ZeppelinGuildPluginBlueprint<TPluginData extends GuildPluginDat
     description?: TMarkdown;
     usageGuide?: TMarkdown;
     configurationGuide?: TMarkdown;
+    legacy?: boolean;
   };
 
   configPreprocessor?: (

backend/src/types.ts

@@ -49,6 +49,7 @@ export interface ZeppelinPluginInfo {
   description?: TMarkdown;
   usageGuide?: TMarkdown;
   configurationGuide?: TMarkdown;
+  legacy?: boolean;
 }
 
 export interface CommandInfo {

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,80 +58,80 @@
 </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 = {
+type TMenuItem = {
   to: string;
   label: string;
-  };
-  type TMenuGroup = {
+};
+type TMenuGroup = {
   label: string;
   items: TMenuItem[];
-  };
-  type TMenu = TMenuGroup[];
+};
+type TMenu = TMenuGroup[];
 
-  const menu: TMenu = [
+const menu: TMenu = [
   {
-      label: 'General',
+    label: "General",
     items: [
       {
-          to: '/docs/introduction',
-          label: 'Introduction',
+        to: "/docs/introduction",
+        label: "Introduction",
       },
     ],
   },
 
   {
-      label: 'Configuration',
+    label: "Configuration",
     items: [
       {
-          to: '/docs/configuration/configuration-format',
-          label: 'Configuration format',
+        to: "/docs/configuration/configuration-format",
+        label: "Configuration format",
       },
       {
-          to: '/docs/configuration/plugin-configuration',
-          label: 'Plugin configuration',
+        to: "/docs/configuration/plugin-configuration",
+        label: "Plugin configuration",
       },
       {
-          to: '/docs/configuration/permissions',
-          label: 'Permissions',
+        to: "/docs/configuration/permissions",
+        label: "Permissions",
       },
     ],
   },
 
   {
-      label: 'Reference',
+    label: "Reference",
     items: [
       {
-          to: '/docs/reference/argument-types',
-          label: 'Argument types',
+        to: "/docs/reference/argument-types",
+        label: "Argument types",
       },
     ],
   },
 
   {
-      label: 'Setup guides',
+    label: "Setup guides",
     items: [
       {
-          to: '/docs/setup-guides/logs',
-          label: 'Logs',
+        to: "/docs/setup-guides/logs",
+        label: "Logs",
       },
       {
-          to: '/docs/setup-guides/moderation',
-          label: 'Moderation',
+        to: "/docs/setup-guides/moderation",
+        label: "Moderation",
       },
       {
-          to: '/docs/setup-guides/counters',
-          label: 'Counters',
+        to: "/docs/setup-guides/counters",
+        label: "Counters",
       },
     ],
   },
-  ];
+];
 
-  export default {
+export default {
   components: { Menu, Title },
   async mounted() {
     await this.$store.dispatch("docs/loadAllPlugins");
@@ -131,7 +139,7 @@
 
   data() {
     return {
-        mobileMenuOpen: false
+      mobileMenuOpen: false,
     };
   },
 
@@ -142,26 +150,39 @@
 
     onChooseMenuItem() {
       this.mobileMenuOpen = false;
-        this.$refs['main-anchor'].focus();
+      this.$refs["main-anchor"].focus();
     },
   },
 
   computed: {
-      ...mapState('docs', {
-        plugins: 'allPlugins',
+    ...mapState("docs", {
+      plugins: "allPlugins",
     }),
     menu() {
+      console.log(this.plugins);
+
       return [
         ...menu,
         {
-            label: 'Plugins',
-            items: this.plugins.map(plugin => ({
+          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>