timemanager/frontend/src/app/app.component.html

<mat-toolbar color="primary">
  <span>TimeManager</span>

  <button mat-button aria-label="Organize" *ngIf="authService.hasKey" [matMenuTriggerFor]="organizeMenu">Organize &#9662;</button>
  <mat-menu #organizeMenu=matMenu>
    <button mat-menu-item routerLink="taskgroups/" aria-label="Task groups">Taskgroups</button>
  </mat-menu>
  <span class="example-spacer"></span>



  <button mat-icon-button aria-label="Login" (click)="loginDialogService.openLoginDialog()" *ngIf="!authService.hasKey()">
    <mat-icon>login</mat-icon>
  </button>
  <button mat-icon-button aria-label="Logout" (click)="authService.clearAccessToken()" *ngIf="authService.hasKey()">
    <mat-icon>logout</mat-icon>
  </button>
  <button mat-icon-button [matMenuTriggerFor]="menu" *ngIf="authService.hasKey()">
    <mat-icon>account_circle</mat-icon>
  </button>

  <mat-menu #menu=matMenu>
    <button mat-menu-item routerLink="/user/settings" aria-label="Usersettings">
      <mat-icon>account_circle</mat-icon>
      <span>Profile</span>
    </button>
    <button mat-menu-item routerLink="/admin" aria-label="Adminbereich" *ngIf="authService.isAdmin()">
      <mat-icon>settings</mat-icon>
      <span>Settings</span>
    </button>
  </mat-menu>
</mat-toolbar>

<router-outlet></router-outlet>