src/app/components/body/leaderboards/leaderboards.component.html

<div>
  <mat-card>

    <!--
      make a header with the task name, if the task is not '', align the text to the center
    -->
    <br>
    <h1 *ngIf="task && showTask" style="text-align: center">
      {{task}} Leaderboards
    </h1>

    <mat-tab-group>
      <mat-tab
       *ngFor="let dataset of datasets | async"
       [label]="this.task? dataset.name : dataset.name + '(' + dataset.task + ')'"
      >
        <br>
        <p>{{dataset.description}}</p>
        <br>
        <app-leaderboard
          [task]="task"
          [dataset]="dataset.name"
          >
        </app-leaderboard>
      </mat-tab>
    </mat-tab-group>
  </mat-card>
</div>