Visual improvements

src/router/navlinks.ts

@@ -1,3 +1,5 @@
+import { useAuthStore } from 'src/stores/auth';
+
 export const links = [
   {
     name: 'Home',
@@ -81,11 +83,20 @@ export const links = [
   },
 ];
 
+const authStore = useAuthStore();
+
+function hasRole(roles: string[] | undefined) {
+  if (roles === undefined) return true;
+  const hasRole = authStore.hasRequiredRole(roles);
+  return hasRole;
+}
 export const enabledLinks = links
   .filter((link) => link.enabled)
   .map((link) => {
     if (link.sublinks) {
-      link.sublinks = link.sublinks.filter((sublink) => sublink.enabled);
+      link.sublinks = link.sublinks.filter(
+        (sublink) => sublink.enabled && hasRole(sublink.requiredRoles)
+      );
     }
     return link;
   });