TCVP-2687 Fixed the role permissions

src/frontend/staff-portal/src/app/app-routing.module.ts

@@ -16,7 +16,7 @@ let routes: Routes = [
   {
     path: AppRoutes.STAFF,
     canActivate: [AuthorizationGuard],
-    data: { expectedRole: UserGroup.VTC_STAFF },
+    data: { roles: [UserGroup.VTC_STAFF, UserGroup.SUPPORT_STAFF] },
     children: [
       {
         path: '',
@@ -28,7 +28,7 @@ let routes: Routes = [
   {
     path: AppRoutes.JJ,
     canActivate: [AuthorizationGuard],
-    data: { expectedRole: UserGroup.JUDICIAL_JUSTICE },
+    data: { roles: [UserGroup.JUDICIAL_JUSTICE, UserGroup.ADMIN_JUDICIAL_JUSTICE, UserGroup.SUPPORT_STAFF] },
     children: [
       {
         path: '',

src/frontend/staff-portal/src/app/components/error/unauthorized/unauthorized.component.html

@@ -1,7 +1,7 @@
 <app-page>
     <div class="container">
         <br />
-        <h1 class="BC-Gov-32px-blue-text">You are not authorized to access Ticket Resolution Management</h1>
+        <h1 class="BC-Gov-32px-blue-text">You are not authorized to access the TCO - {{application}} Workbench</h1>
         <hr style="opacity: 1; color: #fcba19" />
     </div>
 </app-page>

src/frontend/staff-portal/src/app/components/error/unauthorized/unauthorized.component.ts

@@ -1,11 +1,17 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'app-unauthorized',
   templateUrl: './unauthorized.component.html',
   styleUrls: ['./unauthorized.component.scss']
 })
-export class UnauthorizedComponent {
-  constructor() {
+export class UnauthorizedComponent implements OnInit {
+  application: string;
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit() {
+    this.application = this.route.snapshot.queryParamMap.get('application');
   }
 }

src/frontend/staff-portal/src/app/components/staff-workbench/staff-workbench-dashboard/staff-workbench-dashboard.component.html

@@ -5,22 +5,22 @@
         <div class="content">
           <mat-tab-group class="dashTabs" mat-align-tabs="start" [selectedIndex]="tabSelected.value"
             (selectedIndexChange)="tabSelected.setValue($event)">
-            <mat-tab>
+            <mat-tab *ngIf="hasTicketValidationPermission">
               <ng-template mat-tab-label>
                 <h2>Ticket Validation</h2>
               </ng-template>
             </mat-tab>
-            <mat-tab>
+            <mat-tab *ngIf="hasDecisionValidationPermission">
               <ng-template mat-tab-label>
                 <h2>Decision Validation</h2>
               </ng-template>
             </mat-tab>
-            <mat-tab>
+            <mat-tab *ngIf="hasUpdateRequestsPermission">
               <ng-template mat-tab-label>
                 <h2>Update Requests</h2>
               </ng-template>
             </mat-tab>
-            <mat-tab #DCF>
+            <mat-tab #DCF *ngIf="hasDCFPermission">
               <ng-template mat-tab-label>
                 <h2>DCF</h2>
               </ng-template>

src/frontend/staff-portal/src/app/components/staff-workbench/staff-workbench-dashboard/staff-workbench-dashboard.component.ts

@@ -10,7 +10,8 @@ import { DisputeService } from 'app/services/dispute.service';
 import { UpdateRequestInboxComponent } from '../update-request-inbox/update-request-inbox.component';
 import { Store } from '@ngrx/store';
 import { JJDisputeStore } from 'app/store';
-import { BusyService } from '@core/services/busy.service';
+import { AuthService } from 'app/services/auth.service';
+import { UserGroup } from '@shared/enums/user-group.enum';
 
 @Component({
   selector: 'app-staff-workbench-dashboard',
@@ -28,19 +29,31 @@ export class StaffWorkbenchDashboardComponent implements OnInit {
   data$: Observable<JJDispute[]>;
   jjDisputeInfo: JJDispute;
 
+  hasTicketValidationPermission: boolean = false;
+  hasDecisionValidationPermission: boolean = false;
+  hasUpdateRequestsPermission: boolean = false;
+  hasDCFPermission: boolean = false;
+
   @ViewChild(DisputeDecisionInboxComponent) disputeChild: DisputeDecisionInboxComponent;
   @ViewChild(TicketInboxComponent) ticketChild: TicketInboxComponent;
   @ViewChild(UpdateRequestInboxComponent) updateRequestChild: UpdateRequestInboxComponent;
 
   constructor(
+    private authService: AuthService,
     private disputeService: DisputeService,
-    private busyService: BusyService,
     private store: Store
   ) {
   }
 
   ngOnInit(): void {
-    // this.busyService.busy$.subscribe(i => this.busy = i);
+    this.authService.userProfile$.subscribe(userProfile => {
+      if (userProfile) {        
+        this.hasTicketValidationPermission = this.authService.checkRoles([UserGroup.VTC_STAFF, UserGroup.SUPPORT_STAFF]);
+        this.hasDecisionValidationPermission = this.authService.checkRoles([UserGroup.VTC_STAFF, UserGroup.SUPPORT_STAFF]);
+        this.hasUpdateRequestsPermission = this.authService.checkRoles([UserGroup.VTC_STAFF, UserGroup.SUPPORT_STAFF]);
+        this.hasDCFPermission = this.authService.checkRoles([UserGroup.VTC_STAFF, UserGroup.SUPPORT_STAFF]);
+      }
+    });
     this.data$ = this.store.select(JJDisputeStore.Selectors.JJDisputes).pipe(filter(i => !!i));
   }
 

src/frontend/staff-portal/src/app/core/guards/auth-guard.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
+import { AppRoutes } from 'app/app.routes';
 import { AuthService } from 'app/services/auth.service';
 import { KeycloakAuthGuard, KeycloakService } from 'keycloak-angular';
 
@@ -17,20 +18,40 @@ export class AuthorizationGuard extends KeycloakAuthGuard {
 
   public async isAccessAllowed(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
     // Force the user to log in if currently unauthenticated.
+    let permission;
     if (!this.authenticated) {
       this.authService.login();
     }
 
-
     // Get the roles required from the route.
     const requiredRoles = route.data.roles;
 
     // Allow the user to to proceed if no additional roles are required to access the route.
-    if (!(requiredRoles instanceof Array) || requiredRoles.length === 0) {
-      return true;
+    if (!requiredRoles || requiredRoles.length === 0) {
+      permission = true;
+    } else {
+      if (!this.roles || this.roles.length === 0) {
+        permission = false;
+      }
+      // Allow the user to proceed if any of the required role(s) is/are present.
+      if (requiredRoles.some((role) => this.roles.indexOf(role) > -1))
+      {
+        permission = true;
+      } else {
+        permission = false;
+      };
+    }
+
+    if(!permission){
+      let application;
+      if(state.url.indexOf(AppRoutes.JJ) > -1) {
+        application = "JJ";
+      } else {
+        application = "Staff";
+      }
+      this.router.navigate([AppRoutes.UNAUTHORIZED], {queryParams: {application: application}});
     }
 
-    // Allow the user to proceed if all the required roles are present.
-    return requiredRoles.some(role => this.roles.includes(role));
+    return permission;
   }
 }