update

src/app/@theme/components/header/header.component.html

@@ -29,7 +29,7 @@
                nbContextMenuTag="user-menu"
                [onlyPicture]="userPictureOnly"
                [name]="user?.preferred_username"
-               [title]="user?.realm_access?.roles.join(' | ')"
+               [title]="user?.roles.join(' | ')"
                [picture]="'assets/images/default_user.png'">
       </nb-user>
     </nb-action>

src/app/app-routing.module.ts

@@ -11,7 +11,7 @@ export const routes: Routes = [
     path: 'pages',
     loadChildren: () => import('./pages/pages.module')
       .then(m => m.PagesModule),
-    
+    canActivate: [AuthGuard]
   },
   {
     path: 'auth',

src/app/auth/oidc/oidc.ts

@@ -13,10 +13,8 @@ export interface UserClaims {
     picture: string;
     sub: string;
     updated_at: string;
-    realm_access: {
     roles: string[];
 }
-}
 
 
 export interface OidcToken {

src/app/auth/services/oidc-user-information.service.ts

@@ -29,7 +29,7 @@ export class OidcUserInformationService {
   }
 
   getRole(): Observable<string[]> {
-    return this.user ? observableOf(this.user.realm_access.roles.map(role => role.toUpperCase())) : observableOf(['CITIZEN']);
+    return this.user ? observableOf(this.user.roles.map(role => role.toUpperCase())) : observableOf(['CITIZEN']);
   }
 
   getUser(): Observable<UserClaims> {