Ajusta layout

src/auth/roles.js

@@ -1,3 +1,35 @@
-export default {
-  VIDEOS_LIST: "role_videos_6550",
+const ROLES = {
+  ADMIN: "ADMIN",
+  USER: "USER",
 };
+
+export const ROLE_ALIASES = {
+  [ROLES.ADMIN]: [
+    "ADMIN",
+    "ROLE_ADMIN",
+    "REALM_ADMIN",
+    "MASTER_ADMIN",
+    "APP_ADMIN",
+    "CLIPPER_ADMIN",
+    "ADMINISTRATOR",
+    "SUPERUSER",
+  ],
+  [ROLES.USER]: [
+    "USER",
+    "ROLE_USER",
+    "DEFAULT_USER",
+    "DEFAULT_ROLES",
+    "DEFAULT-ROLES",
+    "CLIPPER_USER",
+    "VIDEO_USER",
+    "ROLE_VIDEOS_6550",
+    "ROLE_VIDEOS",
+    "ROLE_VIEWER",
+  ],
+};
+
+export const ROLE_INHERITANCE = {
+  [ROLES.ADMIN]: [ROLES.USER],
+};
+
+export default ROLES;

src/auth/router.js

@@ -3,9 +3,11 @@ import Cookies from "js-cookie";
 import { createWebHistory, createRouter } from "vue-router";
 
 import roles from "@/auth/roles";
+import { extractRolesFromToken } from "@/utils/keycloak";
 
 import Videos from "@/routes/videos";
 import NewVideo from "@/routes/videos/new";
+import Users from "@/routes/users/index.vue";
 import Login from "@/routes/auth/Login";
 
 export const MENUS = {
@@ -14,9 +16,27 @@ export const MENUS = {
 };
 
 const getUserRoles = () => {
-  const rolesFromCookie = Cookies.get("user_roles"); // TODO: Tirar as permissões do usuário
+  const rolesFromCookie = Cookies.get("user_roles");
 
-  return rolesFromCookie ? JSON.parse(rolesFromCookie) : [];
+  if (rolesFromCookie) {
+    try {
+      const parsed = JSON.parse(rolesFromCookie);
+      if (Array.isArray(parsed)) {
+        return parsed;
+      }
+    } catch (error) {
+      console.warn("Invalid roles cookie", error);
+    }
+  }
+
+  const token = Cookies.get("token");
+  const decodedRoles = extractRolesFromToken(token);
+
+  if (decodedRoles.length) {
+    Cookies.set("user_roles", JSON.stringify(decodedRoles), { sameSite: "lax" });
+  }
+
+  return decodedRoles;
 };
 
 export const routes = [
@@ -36,9 +56,17 @@ export const routes = [
     meta: {
       requiresAuth: true,
       title: "Vídeos",
-      permissions: [roles.VIDEOS_LIST],
+      permissions: [roles.USER, roles.ADMIN],
       showinModal: true,
       menu: MENUS.VIDEOS,
+      icon: "sym_o_video_library",
+      description: "Acompanhe e gerencie os vídeos capturados automaticamente.",
+      quickAction: {
+        label: "Novo vídeo",
+        to: "/videos/new",
+        icon: "sym_o_add",
+      },
+      order: 1,
     },
   },
   {
@@ -48,9 +76,29 @@ export const routes = [
     meta: {
       requiresAuth: true,
       title: "Novo Vídeo",
-      permissions: [roles.VIDEOS_LIST],
+      permissions: [roles.USER, roles.ADMIN],
       showinModal: false,
       menu: MENUS.VIDEOS,
+      icon: "sym_o_add_to_queue",
+      description: "Cole o link do YouTube e deixe a IA preparar seus cortes.",
+      quickAction: false,
+      order: 2,
+    },
+  },
+  {
+    path: "/users",
+    name: "Users",
+    component: Users,
+    meta: {
+      requiresAuth: true,
+      title: "Usuários",
+      permissions: [roles.ADMIN],
+      showinModal: true,
+      menu: MENUS.USUARIOS,
+      icon: "sym_o_groups",
+      description: "Gerencie quem tem acesso ao Clipper IA.",
+      quickAction: false,
+      order: 1,
     },
   },
   {