feat: user user-menu.service into the current-user component

npm/ng-packs/packages/theme-basic/src/lib/components/index.ts

@@ -7,6 +7,6 @@ export * from './logo/logo.component';
 export * from './nav-items/current-user.component';
 export * from './nav-items/languages.component';
 export * from './nav-items/nav-items.component';
+export * from './page-alert-container/page-alert-container.component';
 export * from './routes/routes.component';
 export * from './validation-error/validation-error.component';
-export * from './page-alert-container/page-alert-container.component';

npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html

@@ -31,11 +31,19 @@
     aria-labelledby="dropdownMenuLink"
     [class.d-block]="smallScreen && currentUserDropdown.isOpen()"
   >
-    <a class="dropdown-item pointer" (click)="navigateToManageProfile()"
-      ><i class="fa fa-cog me-1"></i>{{ 'AbpAccount::MyAccount' | abpLocalization }}</a
-    >
-    <a class="dropdown-item" href="javascript:void(0)" (click)="logout()"
-      ><i class="fa fa-power-off me-1"></i>{{ 'AbpUi::Logout' | abpLocalization }}</a
-    >
+    <ng-container *ngFor="let item of userMenu.items$ | async; trackBy: trackByFn">
+      <ng-container *ngIf="item.visible && item.visible()">
+        <li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy">
+          <ng-container
+            *ngIf="item.component; else htmlTemplate"
+            [ngComponentOutlet]="item.component"
+          ></ng-container>
+
+          <ng-template #htmlTemplate>
+            <div [innerHTML]="item.html" (click)="item.action ? item.action() : null"></div>
+          </ng-template>
+        </li>
+      </ng-container>
+    </ng-container>
   </div>
 </div>

npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts

@@ -5,7 +5,8 @@ import {
   NAVIGATE_TO_MANAGE_PROFILE,
   SessionStateService,
 } from '@abp/ng.core';
-import { Component, Inject } from '@angular/core';
+import { UserMenu, UserMenuService } from '@abp/ng.theme.shared';
+import { Component, Inject, TrackByFunction } from '@angular/core';
 import { Observable } from 'rxjs';
 
 @Component({
@@ -16,12 +17,15 @@ export class CurrentUserComponent {
   currentUser$: Observable<CurrentUserDto> = this.configState.getOne$('currentUser');
   selectedTenant$ = this.sessionState.getTenant$();
 
+  trackByFn: TrackByFunction<UserMenu> = (_, element) => element.id;
+
   get smallScreen(): boolean {
     return window.innerWidth < 992;
   }
 
   constructor(
-    @Inject(NAVIGATE_TO_MANAGE_PROFILE) public navigateToManageProfile: () => void,
+    @Inject(NAVIGATE_TO_MANAGE_PROFILE) public readonly navigateToManageProfile: () => void,
+    public readonly userMenu: UserMenuService,
     private authService: AuthService,
     private configState: ConfigStateService,
     private sessionState: SessionStateService,