Add user dropdown to Portal

portal-frontend/src/app/services/authentication/authentication.dto.ts

@@ -9,4 +9,5 @@ export interface UserDto {
   government?: string;
   isLocalGovernment: boolean;
   isFirstNationGovernment: boolean;
+  businessName?: string | null;
 }

portal-frontend/src/app/shared/header/header.component.html

@@ -25,6 +25,20 @@ <h5 class="center">
     </div>
 
     <div *ngIf="isAuthenticated" class="controls">
+      <button
+        mat-button
+        color="primary"
+        [class.open]="menuTrigger.menuOpen"
+        #menuTrigger="matMenuTrigger"
+        [matMenuTriggerFor]="userMenu"
+      >
+        <div class="center">{{ user?.name }} <mat-icon> arrow_drop_down </mat-icon></div>
+      </button>
+      <mat-menu class="user-menu" #userMenu="matMenu">
+        <div class="item">User ID: {{ user?.bceidUserName }}</div>
+        <div class="item">Business: {{ user?.businessName }}</div>
+        <div class="item">Type: {{ user?.businessName ? 'BCeID Business' : 'BCeID Basic' }}</div>
+      </mat-menu>
       <button class="inbox-btn" routerLink="/home" mat-flat-button color="primary">Portal Inbox</button>
       <button class="logout-btn" (click)="onLogout()" mat-stroked-button color="primary">Log Out</button>
     </div>

portal-frontend/src/app/shared/header/header.component.scss

@@ -1,6 +1,12 @@
 @use '../../../styles/functions' as *;
 @use '../../../styles/colors' as colors;
 
+::ng-deep {
+  .user-menu {
+    max-width: unset !important;
+  }
+}
+
 .top-nav {
   background-color: colors.$primary-color-dark;
   padding: rem(8) rem(24);
@@ -125,3 +131,8 @@ header {
     }
   }
 }
+
+.item {
+  padding: rem(12) rem(16);
+  min-width: rem(212);
+}

portal-frontend/src/app/shared/header/header.component.spec.ts

@@ -2,6 +2,7 @@ import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { createMock, DeepMocked } from '@golevelup/ts-jest';
 import { BehaviorSubject } from 'rxjs';
+import { UserDto } from '../../services/authentication/authentication.dto';
 import { AuthenticationService, ICurrentUser } from '../../services/authentication/authentication.service';
 
 import { HeaderComponent } from './header.component';
@@ -13,7 +14,7 @@ describe('HeaderComponent', () => {
 
   beforeEach(async () => {
     mockAuthService = createMock();
-    mockAuthService.$currentTokenUser = new BehaviorSubject<ICurrentUser | undefined>(undefined);
+    mockAuthService.$currentProfile = new BehaviorSubject<UserDto | undefined>(undefined);
 
     await TestBed.configureTestingModule({
       declarations: [HeaderComponent],

portal-frontend/src/app/shared/header/header.component.ts

@@ -1,7 +1,8 @@
 import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { Subject, takeUntil } from 'rxjs';
-import { AuthenticationService } from '../../services/authentication/authentication.service';
+import { UserDto } from '../../services/authentication/authentication.dto';
+import { AuthenticationService, ICurrentUser } from '../../services/authentication/authentication.service';
 
 @Component({
   selector: 'app-header',
@@ -15,6 +16,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
   isOnSearch = false;
 
   title = 'Provincial Agricultural Land Commission Portal';
+  user: UserDto | undefined;
 
   constructor(
     private authenticationService: AuthenticationService,
@@ -23,8 +25,9 @@ export class HeaderComponent implements OnInit, OnDestroy {
   ) {}
 
   ngOnInit(): void {
-    this.authenticationService.$currentTokenUser.pipe(takeUntil(this.$destroy)).subscribe((user) => {
+    this.authenticationService.$currentProfile.pipe(takeUntil(this.$destroy)).subscribe((user) => {
       this.isAuthenticated = !!user;
+      this.user = user;
       this.changeDetectorRef.detectChanges();
     });
 

services/apps/alcs/src/common/authorization/authorization.service.ts

@@ -46,6 +46,7 @@ export type BCeIDBasicToken = BaseToken & {
   bceid_user_guid: string;
   bceid_username: string;
   bceid_business_guid?: string;
+  bceid_business_name?: string;
 };
 
 @Injectable()
@@ -161,6 +162,7 @@ export class AuthorizationService {
         bceidBusinessGuid: bceidToken.bceid_business_guid,
         bceidUserName: bceidToken.bceid_username,
         clientRoles: bceidToken.client_roles || [],
+        businessName: bceidToken.bceid_business_name,
       };
     }
     throw new Error(

services/apps/alcs/src/providers/typeorm/migrations/1696358673288-add_user_business.ts

@@ -0,0 +1,17 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class addUserBusiness1696358673288 implements MigrationInterface {
+  name = 'addUserBusiness1696358673288';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "alcs"."user" ADD "business_name" character varying`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "alcs"."user" DROP COLUMN "business_name"`,
+    );
+  }
+}

services/apps/alcs/src/user/user.dto.ts

@@ -39,6 +39,9 @@ export class UserDto extends UpdateUserDto {
   @AutoMap()
   prettyName?: string | null;
 
+  @AutoMap(() => String)
+  businessName?: string | null;
+
   government?: string;
   isLocalGovernment: boolean;
   isFirstNationGovernment: boolean;
@@ -58,6 +61,7 @@ export class CreateUserDto {
   idirUserGuid?: string;
   bceidGuid?: string;
   bceidBusinessGuid?: string | null;
+  businessName?: string | null;
 }
 
 export class AssigneeDto {

services/apps/alcs/src/user/user.entity.ts

@@ -46,6 +46,10 @@ export class User extends Base {
   @Column({ nullable: true })
   familyName: string;
 
+  @AutoMap(() => String)
+  @Column({ type: 'varchar', nullable: true })
+  businessName: string | null;
+
   @AutoMap()
   @Index({ unique: true })
   @Column({ nullable: true })