<div *ngIf="items?.length" class="p-t-8 p-b-8">
  <ul class="list-unstyled m-b-0">
    <ng-container *ngFor="let item of items">
      <ng-container *ngIf="item.template">
        <ng-container *c8yOutlet="item.template"></ng-container>
      </ng-container>
      <ng-container *ngIf="!item.template">
        <li>
          <button
            [attr.aria-label]="item.label | translate"
            type="button"
            class="c8y-right-drawer__link"
            (click)="item.click()"
            [attr.href]="item.link"
            [attr.target]="item.target"
          >
            {{ item.label | translate }}
          </button>
        </li>
      </ng-container>
    </ng-container>
  </ul>
</div>

<!-- the default items -->
<c8y-user-menu-item
  *ngIf="ui.currentUser | async"
  [icon]="'user-menu-male'"
  [label]="'User settings' | translate"
  [priority]="20"
  [dataCy]="'user-menu-user-settings-button'"
  (click)="editUser()"
></c8y-user-menu-item>
<c8y-user-menu-item
  *ngIf="ui.currentUser | async"
  [icon]="'sign-out'"
  [label]="'Logout' | translate"
  [dataCy]="'user-menu-logout-button'"
  (click)="logout()"
></c8y-user-menu-item>
<c8y-user-menu-item
  *ngIf="!(ui.currentUser | async)?.supportUserEnabled && ((ui.state$ | async).activateSupportUserAvailable)"
  [icon]="'c8y-c8y-support'"
  [label]="'Activate support' | translate"
  [dataCy]="'user-menu-activate-support-button'"
  (click)="activateSupportAccess()"
></c8y-user-menu-item>
<c8y-user-menu-item
  *ngIf="(ui.currentUser | async)?.supportUserEnabled && ((ui.state$ | async).activateSupportUserAvailable)"
  [icon]="'c8y-c8y-support'"
  [label]="'Deactivate support' | translate"
  [dataCy]="'user-menu-deactivate-support-button'"
  (click)="deactivateSupportAccess()"
></c8y-user-menu-item>
<c8y-user-menu-item
  *ngIf="hasAdminPermissions"
  [icon]="'account-disable'"
  [label]="'Revoke tokens' | translate"
  (click)="revokeTokens()"
></c8y-user-menu-item>
<c8y-user-menu-item
  *ngIf="(ui.state$ | async).supportUrl"
  [icon]="'question-circle'"
  [link]="(ui.state$ | async).supportUrl"
  [target]="'_blank'"
  [label]="'Request support' | translate"
  [dataCy]="'user-menu-request-support-button'"
></c8y-user-menu-item>