Support link-modules and add docs link (#368)

* Allow link type modules

* Add docs module

* Allow buttons to render as <a>

* Update button readme

* Use link buttons in module sidebar when needed

src/modules/define.ts

@@ -13,17 +13,19 @@ export function defineModule(
 		options = config;
 	}
 
-	options.routes = options.routes.map((route) => {
-		if (route.path) {
-			route.path = `/:project/${options.id}${route.path}`;
-		}
+	if (options.routes !== undefined) {
+		options.routes = options.routes.map((route) => {
+			if (route.path) {
+				route.path = `/:project/${options.id}${route.path}`;
+			}
 
-		if (route.redirect) {
-			route.redirect = `/:project/${options.id}${route.redirect}`;
-		}
+			if (route.redirect) {
+				route.redirect = `/:project/${options.id}${route.redirect}`;
+			}
 
-		return route;
-	});
+			return route;
+		});
+	}
 
 	return options;
 }

src/modules/docs/index.ts

@@ -0,0 +1,8 @@
+import { defineModule } from '@/modules/define';
+
+export default defineModule(({ i18n }) => ({
+	id: 'docs',
+	name: i18n.t('help_and_docs'),
+	icon: 'help',
+	link: 'https://docs.directus.io',
+}));

src/modules/index.ts

@@ -2,6 +2,7 @@ import CollectionsModule from './collections/';
 import FilesModule from './files/';
 import UsersModule from './users/';
 import ActivityModule from './activity/';
+import DocsModule from './docs/';
 import SettingsModule from './settings/';
 
 export const modules = [
@@ -9,6 +10,8 @@ export const modules = [
 	CollectionsModule,
 	UsersModule,
 	FilesModule,
+	DocsModule,
 	SettingsModule,
 ];
+
 export default modules;

src/modules/register.ts

@@ -2,7 +2,10 @@ import { RouteConfig } from 'vue-router';
 import { replaceRoutes } from '@/router';
 import modules from './index';
 
-const moduleRoutes: RouteConfig[] = modules.map((module) => module.routes).flat();
+const moduleRoutes: RouteConfig[] = modules
+	.map((module) => module.routes)
+	.filter((r) => r)
+	.flat();
 
 replaceRoutes((routes) => insertBeforeProjectWildcard(routes, moduleRoutes));
 

src/modules/types.ts

@@ -7,7 +7,8 @@ export type ModuleConfig = {
 	hidden?: boolean | Ref<boolean>;
 	icon: string;
 	name: string | VueI18n.TranslateResult;
-	routes: RouteConfig[];
+	routes?: RouteConfig[];
+	link?: string;
 };
 
 export type ModuleContext = { i18n: VueI18n };