<ng-container *ngIf="menuItem && authService.feature(menuItem.feature) &&
                     (!menuItem.activeClientItem ||
                     (authService?.userData?.user?.clients?.length && authService?.userData?.user?.clients?.length > 1))">
  <a mat-button class="menu-link fl-ellipsis-text"
     [class.ellipse-menu-item]="menuItem.ellipse"
     [class.active-client-menu-item]="menuItem.activeClientItem"
     *ngIf="menuItem.angular_route !== null"
     [routerLink]="[menuItem.route]"
     [queryParams]="menuItem.queryParams"
     [state]="{'menuNavigation':true}"
     [attr.title]="menuItem.activeClientItem ? currentClientTooltip : null"
     [class.active-link]="isActive && !menuItem.activeClientItem">
    <mat-icon [ngClass]="menuItem.icon_class">{{menuItem.icon}}</mat-icon>{{menuItem.label}}
    <app-client-avatar *ngIf="menuItem.activeClient" [client]="menuItem.activeClient"
                       [cssClass]="'menu-item-client-avatar'"></app-client-avatar>
    <span *ngIf="menuItem.activeClientItem" class="menu-item-hint" i18n>Current client</span>
    <mat-icon class="active-client-arrow" *ngIf="menuItem.activeClientItem">keyboard_arrow_right</mat-icon>
  </a>
  <a mat-button class="menu-link" *ngIf="!menuItem.angular_route && menuItem.href"
     href="{{menuItem.href}}"
     target="{{menuItem.open_in_new_tab ? '_blank' : '_self'}}">
    <mat-icon [ngClass]="menuItem.icon_class">{{menuItem.icon}}</mat-icon>{{menuItem.label}}
  </a>
</ng-container>
