feat(authz): align role-based route/menu/page access with backend policies

Author: Diogo-Ferraz

src/app/app.routes.ts

@@ -30,9 +30,9 @@ export const routes: Routes = [
   { path: 'dashboard', component: DashboardComponent, canActivate: [authGuard] },
   { path: 'projects', component: ProjectListComponent, canActivate: [authGuard] },
   { path: 'projects/kanban', component: ProjectKanbanComponent, canActivate: [authGuard] },
-  { path: 'projects/create', component: ProjectCreateComponent, canActivate: [authGuard] },
+  { path: 'projects/create', component: ProjectCreateComponent, canActivate: [authGuard, managerOrAdminGuard] },
   { path: 'projects/members', component: ProjectMembersComponent, canActivate: [authGuard] },
-  { path: 'projects/details', component: ProjectDetailsComponent, canActivate: [authGuard] },
+  { path: 'projects/details', component: ProjectDetailsComponent, canActivate: [authGuard, managerOrAdminGuard] },
   { path: 'tasks', component: TaskItemListComponent, canActivate: [authGuard] },
   { path: 'search', component: SearchFiltersComponent, canActivate: [authGuard] },
   { path: 'docs', component: ProjectDocsComponent, canActivate: [authGuard] },

src/app/core/layout/component/app-menu/app-menu.component.ts

@@ -25,9 +25,19 @@ export class AppMenuComponent {
         label: 'Workspaces',
         items: [
           { label: 'All Projects', icon: 'pi pi-fw pi-list', routerLink: ['/projects'] },
-          { label: 'Project Details', icon: 'pi pi-fw pi-folder-open', routerLink: ['/projects/details'] },
+          {
+            label: 'Project Details',
+            icon: 'pi pi-fw pi-folder-open',
+            routerLink: ['/projects/details'],
+            visible: this.authService.hasAnyRole(['Administrator', 'ProjectManager'])
+          },
           { label: 'Project Members', icon: 'pi pi-fw pi-users', routerLink: ['/projects/members'] },
-          { label: 'Create Project', icon: 'pi pi-fw pi-plus', routerLink: ['/projects/create'] },
+          {
+            label: 'Create Project',
+            icon: 'pi pi-fw pi-plus',
+            routerLink: ['/projects/create'],
+            visible: this.authService.hasAnyRole(['Administrator', 'ProjectManager'])
+          },
           { label: 'Kanban Board', icon: 'pi pi-fw pi-th-large', routerLink: ['/projects/kanban'] }
         ]
       },
@@ -36,7 +46,12 @@ export class AppMenuComponent {
         items: [
           { label: 'All Tasks', icon: 'pi pi-fw pi-list', routerLink: ['/tasks'] },
           { label: 'My Tasks', icon: 'pi pi-fw pi-user', routerLink: ['/tasks/my-tasks'] },
-          { label: 'Create Task', icon: 'pi pi-fw pi-plus', routerLink: ['/tasks/create'] }
+          {
+            label: 'Create Task',
+            icon: 'pi pi-fw pi-plus',
+            routerLink: ['/tasks/create'],
+            visible: this.authService.hasAnyRole(['Administrator', 'ProjectManager', 'User'])
+          }
         ]
       },
       {

src/app/features/projects/components/project-list/project-list.component.html

@@ -15,7 +15,7 @@ <h2>All Projects</h2>
 
       <div class="projects-header__actions">
         <button pButton type="button" label="Refresh" icon="pi pi-refresh" class="p-button-outlined" (click)="refreshProjects()" [loading]="loading"></button>
-        <button pButton type="button" label="Create Project" icon="pi pi-plus" (click)="createProject()"></button>
+        <button *ngIf="canManageProjects" pButton type="button" label="Create Project" icon="pi pi-plus" (click)="createProject()"></button>
       </div>
     </div>
   </p-card>

src/app/features/projects/components/project-list/project-list.component.ts

@@ -62,6 +62,10 @@ export class ProjectListComponent implements OnInit, OnDestroy {
     return this.preferencesService.preferences().defaultTablePageSize;
   }
 
+  get canManageProjects(): boolean {
+    return this.authService.hasAnyRole(['Administrator', 'ProjectManager']);
+  }
+
   trackByProjectId(_: number, project: ProjectDto): string {
     return project.id;
   }
@@ -84,6 +88,10 @@ export class ProjectListComponent implements OnInit, OnDestroy {
   }
 
   createProject(): void {
+    if (!this.canManageProjects) {
+      return;
+    }
+
     void this.router.navigate(['/projects/create']);
   }