[ACS-6699] cleanup user info menu and details (#3625)

* cleanup user menu

* cleanup user info component

projects/aca-content/src/lib/components/common/user-info/user-info.component.html

@@ -1,9 +1,11 @@
-<div mat-menu-item class="aca-user-info" [routerLink]="['/profile']" title="{{'APP.TOOLTIPS.MY_PROFILE' | translate}}">
+<div mat-menu-item class="aca-user-info" [routerLink]="['/profile']" title="{{ 'APP.TOOLTIPS.MY_PROFILE' | translate }}">
+  <ng-container *ngIf="user$ | async as user">
     <button class="aca-user-info-button">
-    <div>{{ (displayName$ | async)?.initials }}</div>
+      <div>{{ user.initials || 'U' }}</div>
     </button>
-  <div class="aca-user-info-name-email">
+    <div class="aca-user-info-details">
-    <div>{{ (displayName$ | async)?.firstName }}</div>
+      <div>{{ user.userName }}</div>
-    <div>{{ (displayName$ | async)?.email }}</div>
+      <div>{{ user.email }}</div>
     </div>
+  </ng-container>
 </div>

projects/aca-content/src/lib/components/common/user-info/user-info.component.scss

@@ -18,7 +18,7 @@
     border: none;
   }
 
-  &-name-email {
+  &-details {
     line-height: 24px;
     margin-left: 10px;
   }

projects/aca-content/src/lib/components/common/user-info/user-info.component.spec.ts

@@ -1,149 +0,0 @@
-/*!
- * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
- *
- * Alfresco Example Content Application
- *
- * This file is part of the Alfresco Example Content Application.
- * If the software was purchased under a paid Alfresco license, the terms of
- * the paid license agreement will prevail. Otherwise, the software is
- * provided under the following open source license terms:
- *
- * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Lesser General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * The Alfresco Example Content Application is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
- */
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { AuthenticationService, IdentityUserService } from '@alfresco/adf-core';
-import { PeopleContentService } from '@alfresco/adf-content-services';
-import { UserInfoComponent } from './user-info.component';
-import { AppTestingModule } from '../../../testing/app-testing.module';
-import { of } from 'rxjs';
-
-describe('UserInfoComponent', () => {
-  let component: UserInfoComponent;
-  let fixture: ComponentFixture<UserInfoComponent>;
-  let authServiceStub: Partial<AuthenticationService>;
-  let peopleContentServiceStub: Partial<PeopleContentService>;
-  let identityUserServiceStub: Partial<IdentityUserService>;
-
-  beforeEach(() => {
-    authServiceStub = {
-      isOauth: () => true,
-      isECMProvider: () => true,
-      isEcmLoggedIn: () => true,
-      isKerberosEnabled: () => false,
-      isLoggedIn: () => true
-    };
-
-    peopleContentServiceStub = {
-      getCurrentUserInfo: () =>
-        of({
-          firstName: 'John',
-          email: 'john@example.com',
-          id: 'johnDoe1',
-          enabled: true,
-          company: {
-            organization: 'ABC Organization',
-            address1: 'XYZ Road',
-            address2: 'Ohio',
-            address3: 'Westlake',
-            postcode: '44145',
-            telephone: '456876',
-            fax: '323984',
-            email: 'contact.us@abc.com'
-          },
-          isAdmin: () => true
-        })
-    };
-
-    identityUserServiceStub = {
-      getCurrentUserInfo: () => ({
-        firstName: 'John',
-        email: 'john@example.com',
-        id: 'johnDoe1',
-        enabled: true,
-        company: {
-          organization: 'ABC Organization',
-          address1: 'XYZ Road',
-          address2: 'Ohio',
-          address3: 'Westlake',
-          postcode: '44145',
-          telephone: '456876',
-          fax: '323984',
-          email: 'contact.us@abc.com'
-        },
-        isAdmin: () => true
-      })
-    };
-
-    TestBed.configureTestingModule({
-      imports: [AppTestingModule, UserInfoComponent],
-      providers: [
-        { provide: AuthenticationService, useValue: authServiceStub },
-        { provide: PeopleContentService, useValue: peopleContentServiceStub },
-        { provide: IdentityUserService, useValue: identityUserServiceStub }
-      ]
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(UserInfoComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should check if user is logged in', async () => {
-    const loggedIn = component.isLoggedIn;
-    expect(loggedIn).toBeTrue();
-  });
-
-  it('should return an object with empty strings for all properties when the input model is empty', () => {
-    const result = component.parseDisplayName({});
-    expect(result.firstName).toEqual('');
-    expect(result.initials).toEqual('');
-    expect(result.email).toEqual('');
-  });
-
-  it('should return an object with the correct firstName and initials when the input model has only the firstName property', () => {
-    const result = component.parseDisplayName({ firstName: 'John' });
-    expect(result.firstName).toEqual('John');
-    expect(result.initials).toEqual('J');
-    expect(result.email).toEqual('');
-  });
-
-  it('should return an object with the correct firstName and initials when the input model has only the lastName property', () => {
-    const result = component.parseDisplayName({ lastName: 'Doe' });
-    expect(result.firstName).toEqual(' Doe');
-    expect(result.initials).toEqual('D');
-    expect(result.email).toEqual('');
-  });
-
-  it('should return an object with the correct email property when the input model has only the email property', () => {
-    const result = component.parseDisplayName({ email: 'john.doe@example.com' });
-    expect(result.firstName).toEqual('');
-    expect(result.initials).toEqual('');
-    expect(result.email).toEqual('john.doe@example.com');
-  });
-
-  it('should return an object with the correct firstName, initials, and lastName concatenated when the input model has both firstName and lastName properties', () => {
-    const result = component.parseDisplayName({ firstName: 'John', lastName: 'Doe' });
-    expect(result.firstName).toEqual('John Doe');
-    expect(result.initials).toEqual('JD');
-    expect(result.email).toEqual('');
-  });
-
-  it('should return an object with all properties correctly parsed when the input model has all three properties', () => {
-    const result = component.parseDisplayName({ firstName: 'John', lastName: 'Doe', email: 'john.doe@example.com' });
-    expect(result.firstName).toEqual('John Doe');
-    expect(result.initials).toEqual('JD');
-    expect(result.email).toEqual('john.doe@example.com');
-  });
-});

projects/aca-content/src/lib/components/common/user-info/user-info.component.ts

@@ -22,15 +22,13 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { IdentityUserService, AuthenticationService } from '@alfresco/adf-core';
+import { Component, ViewEncapsulation, inject } from '@angular/core';
-import { Component, OnInit, ViewEncapsulation } from '@angular/core';
-import { Observable, of } from 'rxjs';
-import { PeopleContentService } from '@alfresco/adf-content-services';
-import { map } from 'rxjs/operators';
 import { CommonModule } from '@angular/common';
 import { RouterModule } from '@angular/router';
 import { MatMenuModule } from '@angular/material/menu';
 import { TranslateModule } from '@ngx-translate/core';
+import { AppStore, getUserProfile } from '@alfresco/aca-shared/store';
+import { Store } from '@ngrx/store';
 
 @Component({
   standalone: true,
@@ -40,63 +38,7 @@ import { TranslateModule } from '@ngx-translate/core';
   styleUrls: ['./user-info.component.scss'],
   encapsulation: ViewEncapsulation.None
 })
-export class UserInfoComponent implements OnInit {
+export class UserInfoComponent {
-  displayName$: Observable<{ firstName: string; initials: string; email: string }>;
+  private store = inject<Store<AppStore>>(Store<AppStore>);
-
+  user$ = this.store.select(getUserProfile);
-  constructor(
-    private peopleContentService: PeopleContentService,
-    private identityUserService: IdentityUserService,
-    private authService: AuthenticationService
-  ) {}
-
-  ngOnInit() {
-    this.getUserInfo();
-  }
-
-  getUserInfo() {
-    if (this.authService.isOauth()) {
-      this.loadIdentityUserInfo();
-
-      if (this.authService.isECMProvider() && this.authService.isEcmLoggedIn()) {
-        this.loadEcmUserInfo();
-      }
-    } else if (this.isEcmLoggedIn()) {
-      this.loadEcmUserInfo();
-    }
-  }
-
-  get isLoggedIn(): boolean {
-    if (this.authService.isKerberosEnabled()) {
-      return true;
-    }
-    return this.authService.isLoggedIn();
-  }
-
-  private loadEcmUserInfo(): void {
-    this.displayName$ = this.peopleContentService.getCurrentUserInfo().pipe(map((model) => this.parseDisplayName(model)));
-  }
-
-  private loadIdentityUserInfo() {
-    this.displayName$ = of(this.identityUserService.getCurrentUserInfo()).pipe(map((model) => this.parseDisplayName(model)));
-  }
-
-  parseDisplayName(model: { firstName?: string; lastName?: string; email?: string }): { firstName: string; initials: string; email: string } {
-    const result = { firstName: '', initials: '', email: '' };
-    if (model.firstName) {
-      result.firstName = model.firstName;
-      result.initials = model.firstName.charAt(0).toUpperCase();
-    }
-    if (model.lastName) {
-      result.firstName += ' ' + model.lastName;
-      result.initials += model.lastName.charAt(0).toUpperCase();
-    }
-    if (model.email) {
-      result.email = `${model.email}`;
-    }
-    return result;
-  }
-
-  private isEcmLoggedIn() {
-    return this.authService.isEcmLoggedIn() || (this.authService.isECMProvider() && this.authService.isKerberosEnabled());
-  }
 }

projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.html

@@ -4,7 +4,7 @@
   [matMenuTriggerFor]="menu"
   title="{{'APP.TOOLTIPS.OPTIONS_SETTINGS' | translate}}"
 >
-  <div>{{ (displayName$ | async)?.initials }}</div>
+  <div>{{ (user$ | async)?.initials }}</div>
 </button>
 
 <mat-menu #menu="matMenu" xPosition="before">

projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.spec.ts

@@ -1,142 +0,0 @@
-/*!
- * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
- *
- * Alfresco Example Content Application
- *
- * This file is part of the Alfresco Example Content Application.
- * If the software was purchased under a paid Alfresco license, the terms of
- * the paid license agreement will prevail. Otherwise, the software is
- * provided under the following open source license terms:
- *
- * The Alfresco Example Content Application is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Lesser General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * The Alfresco Example Content Application is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
- */
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { AuthenticationService, IdentityUserService } from '@alfresco/adf-core';
-import { PeopleContentService } from '@alfresco/adf-content-services';
-import { AppTestingModule } from '../../../testing/app-testing.module';
-import { UserMenuComponent } from './user-menu.component';
-import { of } from 'rxjs';
-
-describe('UserMenuComponent', () => {
-  let component: UserMenuComponent;
-  let fixture: ComponentFixture<UserMenuComponent>;
-  let authServiceStub: Partial<AuthenticationService>;
-  let peopleContentServiceStub: Partial<PeopleContentService>;
-  let identityUserServiceStub: Partial<IdentityUserService>;
-
-  const menuItems = [
-    {
-      id: 'menu1',
-      title: 'Menu Item 1',
-      icon: 'icon1',
-      actions: {
-        click: 'action1'
-      }
-    },
-    {
-      id: 'menu2',
-      title: 'Menu Item 2',
-      icon: 'icon2',
-      actions: {
-        click: 'action2'
-      }
-    }
-  ];
-
-  beforeEach(() => {
-    authServiceStub = {
-      isOauth: () => true,
-      isECMProvider: () => true,
-      isEcmLoggedIn: () => true,
-      isKerberosEnabled: () => false,
-      isLoggedIn: () => true
-    };
-
-    peopleContentServiceStub = {
-      getCurrentUserInfo: () =>
-        of({
-          firstName: 'John',
-          email: 'john@example.com',
-          id: 'johnDoe1',
-          enabled: true,
-          company: {
-            organization: 'ABC Organization',
-            address1: 'XYZ Road',
-            address2: 'Ohio',
-            address3: 'Westlake',
-            postcode: '44145',
-            telephone: '456876',
-            fax: '323984',
-            email: 'contact.us@abc.com'
-          },
-          isAdmin: () => true
-        })
-    };
-
-    identityUserServiceStub = {
-      getCurrentUserInfo: () => ({
-        firstName: 'John',
-        email: 'john@example.com',
-        id: 'johnDoe1',
-        enabled: true,
-        company: {
-          organization: 'ABC Organization',
-          address1: 'XYZ Road',
-          address2: 'Ohio',
-          address3: 'Westlake',
-          postcode: '44145',
-          telephone: '456876',
-          fax: '323984',
-          email: 'contact.us@abc.com'
-        },
-        isAdmin: () => true
-      })
-    };
-
-    TestBed.configureTestingModule({
-      imports: [AppTestingModule, UserMenuComponent],
-      providers: [
-        { provide: AuthenticationService, useValue: authServiceStub },
-        { provide: PeopleContentService, useValue: peopleContentServiceStub },
-        { provide: identityUserServiceStub, useValue: identityUserServiceStub }
-      ]
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(UserMenuComponent);
-    component = fixture.componentInstance;
-    component.data = { items: menuItems };
-    fixture.detectChanges();
-  });
-
-  it('should return an object with empty strings for all properties when the input model is empty', () => {
-    const result = component.parseDisplayName({});
-    expect(result.initials).toEqual('');
-  });
-
-  it('should return an object with the correct initials when the input model has only the firstName property', () => {
-    const result = component.parseDisplayName({ firstName: 'John' });
-    expect(result.initials).toEqual('J');
-  });
-
-  it('should return an object with the correct initials when the input model has only the lastName property', () => {
-    const result = component.parseDisplayName({ lastName: 'Doe' });
-    expect(result.initials).toEqual('D');
-  });
-
-  it('should return an object with the correct initials concatenated when the input model has both firstName and lastName properties', () => {
-    const result = component.parseDisplayName({ firstName: 'John', lastName: 'Doe' });
-    expect(result.initials).toEqual('JD');
-  });
-});

projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.ts

@@ -22,17 +22,15 @@
  * from Hyland Software. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { PeopleContentService } from '@alfresco/adf-content-services';
+import { Component, Input, OnInit, ViewEncapsulation, inject } from '@angular/core';
-import { AuthenticationService, IdentityUserService } from '@alfresco/adf-core';
-import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
-import { Observable, of } from 'rxjs';
-import { map } from 'rxjs/operators';
 import { ContentActionRef } from '@alfresco/adf-extensions';
 import { CommonModule } from '@angular/common';
 import { MatButtonModule } from '@angular/material/button';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatMenuModule } from '@angular/material/menu';
 import { ToolbarMenuItemComponent } from '@alfresco/aca-shared';
+import { AppStore, getUserProfile } from '@alfresco/aca-shared/store';
+import { Store } from '@ngrx/store';
 
 @Component({
   standalone: true,
@@ -43,64 +41,18 @@ import { ToolbarMenuItemComponent } from '@alfresco/aca-shared';
   encapsulation: ViewEncapsulation.None
 })
 export class UserMenuComponent implements OnInit {
-  displayName$: Observable<{ firstName: string; initials: string }>;
+  private store = inject<Store<AppStore>>(Store<AppStore>);
+  user$ = this.store.select(getUserProfile);
+
   @Input()
   actionRef: ContentActionRef;
+
   @Input()
   data: { items: any[] };
 
-  constructor(
-    private peopleContentService: PeopleContentService,
-    private identityUserService: IdentityUserService,
-    private authService: AuthenticationService
-  ) {}
-
   ngOnInit() {
-    this.getUserInfo();
     if (this.data?.items) {
       this.data.items.sort((a, b) => a.order - b.order);
     }
   }
-
-  getUserInfo() {
-    if (this.authService.isOauth()) {
-      this.loadIdentityUserInfo();
-
-      if (this.authService.isECMProvider() && this.authService.isEcmLoggedIn()) {
-        this.loadEcmUserInfo();
-      }
-    } else if (this.isEcmLoggedIn()) {
-      this.loadEcmUserInfo();
-    }
-  }
-
-  get isLoggedIn(): boolean {
-    if (this.authService.isKerberosEnabled()) {
-      return true;
-    }
-    return this.authService.isLoggedIn();
-  }
-
-  private loadEcmUserInfo(): void {
-    this.displayName$ = this.peopleContentService.getCurrentUserInfo().pipe(map((model) => this.parseDisplayName(model)));
-  }
-
-  private loadIdentityUserInfo() {
-    this.displayName$ = of(this.identityUserService.getCurrentUserInfo()).pipe(map((model) => this.parseDisplayName(model)));
-  }
-
-  parseDisplayName(model: { firstName?: string; lastName?: string }): { firstName: string; initials: string } {
-    const result = { firstName: '', initials: '' };
-    if (model.firstName) {
-      result.initials = model.firstName.charAt(0).toUpperCase();
-    }
-    if (model.lastName) {
-      result.initials += model.lastName.charAt(0).toUpperCase();
-    }
-    return result;
-  }
-
-  private isEcmLoggedIn() {
-    return this.authService.isEcmLoggedIn() || (this.authService.isECMProvider() && this.authService.isKerberosEnabled());
-  }
 }

projects/aca-content/src/lib/store/reducers/app.reducer.ts

@@ -105,6 +105,7 @@ function updateUser(state: AppState, action: SetUserProfileAction): AppState {
   const lastName = user.lastName || '';
   const userName = `${firstName} ${lastName}`;
   const initials = [firstName[0], lastName[0]].join('');
+  const email = user.email;
 
   const capabilities = user.capabilities;
   const isAdmin = capabilities ? capabilities.isAdmin : true;
@@ -116,7 +117,8 @@ function updateUser(state: AppState, action: SetUserProfileAction): AppState {
     initials,
     isAdmin,
     id,
-    groups
+    groups,
+    email
   };
 
   return newState;