fix menu population, user info

2025-10-01 14:41:14 +00:00 · 2023-02-25 14:05:26 -05:00
parent a25cd8a1d5
commit ddb1b264b0
9 changed files with 62 additions and 102 deletions
--- a/projects/aca-content/assets/app.extensions.json
+++ b/projects/aca-content/assets/app.extensions.json
@@ -85,19 +85,19 @@
        "component": "app.notification-center",
        "order": 50
      },
-      {
-        "id": "app.header.user",
-        "type": "custom",
-        "component": "app.user",
-        "order": 100
-      },
      {
        "id": "app.header.more",
        "type": "menu",
        "order": 10000,
-        "icon": "more_vert",
+        "icon": "apps",
        "title": "APP.ACTIONS.MORE",
        "children": [
+          {
+            "id": "app.header.user",
+            "type": "custom",
+            "component": "app.user",
+            "order": 100
+          },
          {
            "id": "app.languagePicker",
            "order": 100,
--- a/projects/aca-content/src/lib/components/common/common.module.ts
+++ b/projects/aca-content/src/lib/components/common/common.module.ts
@@ -34,9 +34,10 @@ import { LanguagePickerComponent } from './language-picker/language-picker.compo
 import { LogoutComponent } from './logout/logout.component';
 import { ContentModule } from '@alfresco/adf-content-services';
 import { UserInfoComponent } from './user-info/user-info.component';
+import { RouterModule } from '@angular/router';

@NgModule({
-  imports: [CommonModule, CoreModule.forChild(), ContentModule.forChild(), ExtensionsModule, GenericErrorModule],
+  imports: [CommonModule, CoreModule.forChild(), ContentModule.forChild(), ExtensionsModule, GenericErrorModule, RouterModule],
  declarations: [LocationLinkComponent, ToggleSharedComponent, LanguagePickerComponent, LogoutComponent, UserInfoComponent],
  exports: [
    ExtensionsModule,
--- a/projects/aca-content/src/lib/components/common/user-info/user-info.component.html
+++ b/projects/aca-content/src/lib/components/common/user-info/user-info.component.html
@@ -1,14 +1,4 @@
-<ng-container>
-    <adf-content-user-info 
-        *ngIf="mode === userInfoMode.CONTENT || mode === userInfoMode.CONTENT_SSO"
-        [ecmUser]="ecmUser$ | async"
-        [identityUser]="identityUser$ | async"
-        [isLoggedIn]="isLoggedIn"
-        [mode]="mode"
-    ></adf-content-user-info>
-    <adf-identity-user-info 
-        *ngIf="mode === userInfoMode.SSO"
-        [identityUser]="identityUser$ | async"
-        [isLoggedIn]="isLoggedIn"
-    ></adf-identity-user-info>
-</ng-container>
+<button mat-menu-item [routerLink]="['/profile']" title="{{'APP.TOOLTIPS.MY_PROFILE' | translate}}">
+  <mat-icon>account_circle</mat-icon>
+  <span>{{ (displayName$ | async) }}</span>
+</button>
--- a/projects/aca-content/src/lib/components/common/user-info/user-info.component.ts
+++ b/projects/aca-content/src/lib/components/common/user-info/user-info.component.ts
@@ -6,21 +6,18 @@
 * agreement is prohibited.
 */

-import { IdentityUserModel, IdentityUserService, AuthenticationService, UserInfoMode } from '@alfresco/adf-core';
+import { IdentityUserService, AuthenticationService } from '@alfresco/adf-core';
 import { Component, OnInit } from '@angular/core';
 import { Observable, of } from 'rxjs';
-import { EcmUserModel, PeopleContentService } from '@alfresco/adf-content-services';
+import { PeopleContentService } from '@alfresco/adf-content-services';
+import { map } from 'rxjs/operators';

@Component({
  selector: 'app-user-info',
  templateUrl: './user-info.component.html'
 })
 export class UserInfoComponent implements OnInit {
-  mode: UserInfoMode;
-  ecmUser$: Observable<EcmUserModel>;
-  identityUser$: Observable<IdentityUserModel>;
-  selectedIndex: number;
-  userInfoMode = UserInfoMode;
+  displayName$: Observable<string>;

  constructor(
    private peopleContentService: PeopleContentService,
@@ -35,15 +32,12 @@ export class UserInfoComponent implements OnInit {
  getUserInfo() {
    if (this.authService.isOauth()) {
      this.loadIdentityUserInfo();
-      this.mode = UserInfoMode.SSO;

      if (this.authService.isECMProvider() && this.authService.isEcmLoggedIn()) {
-        this.mode = UserInfoMode.CONTENT_SSO;
        this.loadEcmUserInfo();
      }
    } else if (this.isEcmLoggedIn()) {
      this.loadEcmUserInfo();
-      this.mode = UserInfoMode.CONTENT;
    }
  }

@@ -55,11 +49,21 @@ export class UserInfoComponent implements OnInit {
  }

  private loadEcmUserInfo(): void {
-    this.ecmUser$ = this.peopleContentService.getCurrentUserInfo();
+    this.displayName$ = this.peopleContentService.getCurrentUserInfo().pipe(map((model) => this.parseDisplayName(model)));
  }

  private loadIdentityUserInfo() {
-    this.identityUser$ = of(this.identityUserService.getCurrentUserInfo());
+    this.displayName$ = of(this.identityUserService.getCurrentUserInfo()).pipe(map((model) => this.parseDisplayName(model)));
+  }
+
+  private parseDisplayName(model: { firstName?: string; email?: string }): string {
+    let result = model.firstName;
+
+    if (model.email) {
+      result = `${model.firstName} (${model.email})`;
+    }
+
+    return result;
  }

  private isEcmLoggedIn() {
--- a/projects/aca-content/src/lib/components/sidenav/components/sidenav-header.component.html
+++ b/projects/aca-content/src/lib/components/sidenav/components/sidenav-header.component.html
@@ -13,7 +13,8 @@
      {{ appName$ | async | translate }}
    </div>

-    <adf-notification-history></adf-notification-history>
-    <app-navigation-menu></app-navigation-menu>
+    <ng-container *ngFor="let actionRef of actions; trackBy: trackByActionId">
+      <aca-toolbar-action [actionRef]="actionRef"></aca-toolbar-action>
+    </ng-container>
  </div>
 </div>
--- a/projects/aca-content/src/lib/components/sidenav/components/sidenav-header.component.ts
+++ b/projects/aca-content/src/lib/components/sidenav/components/sidenav-header.component.ts
@@ -23,11 +23,14 @@
 * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
 */

-import { Component, EventEmitter, Output, ViewEncapsulation } from '@angular/core';
+import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewEncapsulation } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { Observable } from 'rxjs';
+import { Observable, Subject } from 'rxjs';
 import { AppStore, getAppName, getLogoPath } from '@alfresco/aca-shared/store';
 import { AppConfigService } from '@alfresco/adf-core';
+import { ContentActionRef } from '@alfresco/adf-extensions';
+import { AppExtensionService } from '@alfresco/aca-shared';
+import { takeUntil } from 'rxjs/operators';

@Component({
  selector: 'app-sidenav-header',
@@ -35,17 +38,38 @@ import { AppConfigService } from '@alfresco/adf-core';
  encapsulation: ViewEncapsulation.None,
  host: { class: 'app-sidenav-header' }
 })
-export class SidenavHeaderComponent {
+export class SidenavHeaderComponent implements OnInit, OnDestroy {
+  private onDestroy$ = new Subject<boolean>();
+
  appName$: Observable<string>;
  logo$: Observable<string>;
  landingPage: string;
+  actions: Array<ContentActionRef> = [];

  @Output()
  toggleNavBar = new EventEmitter();

-  constructor(public store: Store<AppStore>, private appConfigService: AppConfigService) {
+  constructor(public store: Store<AppStore>, private appConfigService: AppConfigService, private appExtensions: AppExtensionService) {
    this.appName$ = store.select(getAppName);
    this.logo$ = store.select(getLogoPath);
    this.landingPage = this.appConfigService.get('landingPage', '/personal-files');
  }
+
+  ngOnInit() {
+    this.appExtensions
+      .getHeaderActions()
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((actions) => {
+        this.actions = actions;
+      });
+  }
+
+  ngOnDestroy() {
+    this.onDestroy$.next(true);
+    this.onDestroy$.complete();
+  }
+
+  trackByActionId(_: number, action: ContentActionRef) {
+    return action.id;
+  }
 }
--- a/projects/aca-content/src/lib/components/sidenav/navigation-menu/navigation-menu.component.html
+++ b/projects/aca-content/src/lib/components/sidenav/navigation-menu/navigation-menu.component.html
@@ -1,26 +0,0 @@
-<button mat-icon-button [matMenuTriggerFor]="menu" aria-label="matMenu">
-    <mat-icon title="{{'APP.TOOLTIPS.OPTIONS_SETTINGS' | translate}}">apps</mat-icon>
-</button>
-<mat-menu #menu="matMenu" xPosition="before">
-    <div *ngIf="displayName" mat-menu-item [routerLink]="['/profile']" title="{{'APP.TOOLTIPS.MY_PROFILE' | translate}}">
-        <mat-icon>account_circle</mat-icon>
-        <span>{{ displayName }}</span>
-    </div>
-    <mat-divider></mat-divider>
-    <button mat-menu-item data-automation-id="language-menu-button" [matMenuTriggerFor]="langMenu">
-        <mat-icon>language</mat-icon>
-        <span>{{ 'APP.LANGUAGE' | translate }}</span>
-    </button>
-    <mat-menu #langMenu="matMenu" class="adf-menu">
-        <adf-language-menu></adf-language-menu>
-    </mat-menu>
-    <button mat-menu-item data-automation-id="about" [routerLink]="['/about']">
-        <mat-icon>info</mat-icon>
-        {{ 'APP.BROWSE.ABOUT.TITLE' | translate }}
-    </button>
-    <mat-divider></mat-divider>
-    <button mat-menu-item data-automation-id="sign-out" adf-logout>
-        <mat-icon>exit_to_app</mat-icon>
-        {{ 'APP.SIGN_OUT' | translate }}
-    </button>
-</mat-menu>
--- a/projects/aca-content/src/lib/components/sidenav/navigation-menu/navigation-menu.component.ts
+++ b/projects/aca-content/src/lib/components/sidenav/navigation-menu/navigation-menu.component.ts
@@ -1,33 +0,0 @@
-/*
- * Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved.
- *
- * License rights for this program may be obtained from Alfresco Software, Ltd.
- * pursuant to a written agreement and any use of this program without such an
- * agreement is prohibited.
- */
-
-import { Component, OnInit, ViewEncapsulation } from '@angular/core';
-import { ContentApiService } from '@alfresco/aca-shared';
-
-@Component({
-  selector: 'app-navigation-menu',
-  templateUrl: './navigation-menu.component.html',
-  encapsulation: ViewEncapsulation.None
-})
-export class NavigationMenuComponent implements OnInit {
-  displayName = '';
-
-  constructor(private contentApi: ContentApiService) {}
-
-  ngOnInit() {
-    this.contentApi.getPerson('-me-').subscribe((person) => {
-      const personDetails = person?.entry;
-
-      this.displayName = personDetails.displayName;
-
-      if (personDetails.email) {
-        this.displayName = `${personDetails.displayName} (${personDetails.email})`;
-      }
-    });
-  }
-}
--- a/projects/aca-content/src/lib/components/sidenav/sidenav.module.ts
+++ b/projects/aca-content/src/lib/components/sidenav/sidenav.module.ts
@@ -35,11 +35,11 @@ import { ActiveLinkDirective } from './directives/active-link.directive';
 import { ExpandMenuComponent } from './components/expand-menu.component';
 import { ButtonMenuComponent } from './components/button-menu.component';
 import { ActionDirective } from './directives/action.directive';
-import { NavigationMenuComponent } from './navigation-menu/navigation-menu.component';
 import { SidenavHeaderComponent } from './components/sidenav-header.component';
+import { SharedToolbarModule } from '@alfresco/aca-shared';

@NgModule({
-  imports: [CoreModule.forChild(), ExtensionsModule.forChild(), RouterModule, AppCreateMenuModule],
+  imports: [CoreModule.forChild(), ExtensionsModule.forChild(), RouterModule, AppCreateMenuModule, SharedToolbarModule],
  declarations: [
    MenuPanelDirective,
    ExpansionPanelDirective,
@@ -48,7 +48,6 @@ import { SidenavHeaderComponent } from './components/sidenav-header.component';
    ExpandMenuComponent,
    ButtonMenuComponent,
    SidenavComponent,
-    NavigationMenuComponent,
    SidenavHeaderComponent
  ],
  exports: [