
    <mat-tab-group>
      <mat-tab *ngFor="let season of tv.seasonRequests">

        <ng-template mat-tab-label>
          <div attr.data-test="classStatus{{season.seasonNumber}}" class="{{getStatusClass(season)}} top-right">
          <span>{{ 'Requests.Season' | translate }} {{season.seasonNumber}}</span>
        </div>
        </ng-template>

        <mat-card *ngIf="season.overview" class="mat-elevation-z8">
          <mat-card-content>
              <p>{{season.overview}}</p>
          </mat-card-content>
      </mat-card>


        <table mat-table [dataSource]="season.episodes" class="mat-elevation-z8">

          <ng-container matColumnDef="select">
            <th mat-header-cell *matHeaderCellDef>
              <mat-checkbox attr.data-test="masterCheckbox{{season.seasonNumber}}" *ngIf="isSeasonCheckable(season)" (change)="$event ? masterToggle(season.episodes) : null"
                            [checked]="selection.hasValue() && isAllSelected(season.episodes)"
                            [indeterminate]="selection.hasValue() && !isAllSelected(season.episodes)">
              </mat-checkbox>
            </th>
            <td mat-cell *matCellDef="let row">
              <mat-checkbox attr.data-test="episodeCheckbox{{season.seasonNumber}}{{row.episodeNumber}}" *ngIf="!row.available && !row.requested && !row.approved" (click)="$event.stopPropagation()"
                            (change)="$event ? selection.toggle(row) : null"
                            [checked]="selection.isSelected(row)">
              </mat-checkbox>
            </td>
          </ng-container>

          <ng-container matColumnDef="number">
            <th mat-header-cell *matHeaderCellDef> # </th>
            <td mat-cell *matCellDef="let element"> {{element.episodeNumber}} </td>
          </ng-container>

          <ng-container matColumnDef="title">
            <th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridTitle' | translate }} </th>
            <td mat-cell *matCellDef="let element"> {{element.title}} </td>
          </ng-container>

          <ng-container matColumnDef="airDate">
            <th mat-header-cell *matHeaderCellDef> {{ 'Requests.AirDate' | translate }} </th>
            <td mat-cell *matCellDef="let element"> {{element.airDate | amLocal | amUserLocale | amDateFormat: 'L' }}</td>
          </ng-container>

          <ng-container matColumnDef="status">
            <th mat-header-cell *matHeaderCellDef> {{ 'Requests.GridStatus' | translate }} </th>
            <td mat-cell *matCellDef="let ep">
              <div attr.data-test="episodeStatus{{season.seasonNumber}}{{ep.episodeNumber}}" class="{{getEpisodeStatusClass(ep)}} top-right">
                <span>{{ep.requestStatus | translate}}</span>
              </div>
            </td>
          </ng-container>

          <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
          <tr mat-row *matRowDef="let row; columns: displayedColumns;"
          (click)="selection.toggle(row)">
      </tr>
        </table>
      </mat-tab>

    </mat-tab-group>

<!-- <div *ngIf="isAdmin">
    <button *ngIf="!request.approved" mat-raised-button color="accent" (click)="approve(request);"> {{ 'Common.Approve' | translate }}</button>
    <button *ngIf="!request.available" mat-raised-button color="warn" (click)="changeAvailability(request, true);">{{ 'Requests.MarkAvailable' | translate }}</button>
    <button *ngIf="request.available" mat-raised-button color="warn" (click)="changeAvailability(request, false);">{{ 'Requests.MarkUnavailable' | translate }}</button>
    <button *ngIf="!request.denied" mat-raised-button color="danger" (click)="deny(request);">{{ 'Requests.Deny' | translate }}</button>
</div>
 -->


<button *ngIf="!tv.fullyAvailable && requestable" mat-fab color="accent" id="addFabBtn" class="floating-fab" [matMenuTriggerFor]="aboveMenu">
  <i class="fas fa-plus fa-lg"></i>
<mat-menu #aboveMenu="matMenu" yPosition="above">

  <button id="requestAll" mat-menu-item (click)="requestAllSeasons()">{{'Search.TvShows.AllSeasons' | translate }}</button>

  <button id="requestFirst" mat-menu-item (click)="requestFirstSeason()">{{ 'Search.TvShows.FirstSeason' | translate }}</button>

  <button id="requestLatest" mat-menu-item (click)="requestLatestSeason()">{{ 'Search.TvShows.LatestSeason' | translate }}</button>

  <button id="requestSelected" mat-menu-item (click)="submitRequests()">{{ 'Common.Request' | translate }}</button>
</mat-menu>