<h1 mat-dialog-title>{{ 'clientPropertiesTitle' | translate }}</h1>
<mat-dialog-content>
  <mat-tab-group dynamicHeight>
    
    <mat-tab label="{{ 'generalDataTab' | translate }}">
      <table mat-table [dataSource]="generalData" class="mat-elevation-z8">
        <ng-container matColumnDef="property">
          <th mat-header-cell *matHeaderCellDef class="fixed-column">{{ 'propertyHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element" class="fixed-column"> {{ element.property }} </td>
        </ng-container>
        <ng-container matColumnDef="value">
          <th mat-header-cell *matHeaderCellDef>{{ 'valueHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element"> {{ element.value }} </td>
        </ng-container>
        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
      </table>
    </mat-tab>
    
    <mat-tab label="{{ 'networkPropertiesTab' | translate }}">
      <table mat-table [dataSource]="networkData" class="mat-elevation-z8">
        <ng-container matColumnDef="property">
          <th mat-header-cell *matHeaderCellDef class="fixed-column">{{ 'propertyHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element" class="fixed-column"> {{ element.property }} </td>
        </ng-container>
        <ng-container matColumnDef="value">
          <th mat-header-cell *matHeaderCellDef>{{ 'valueHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element"> {{ element.value }} </td>
        </ng-container>
        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
      </table>
    </mat-tab>
    
    <mat-tab label="{{ 'classroomPropertiesTab' | translate }}">
      <table mat-table [dataSource]="classroomData" class="mat-elevation-z8">
        <ng-container matColumnDef="property">
          <th mat-header-cell *matHeaderCellDef class="fixed-column">{{ 'propertyHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element" class="fixed-column"> {{ element.property }} </td>
        </ng-container>
        <ng-container matColumnDef="value">
          <th mat-header-cell *matHeaderCellDef>{{ 'valueHeader' | translate }}</th>
          <td mat-cell *matCellDef="let element"> {{ element.value }} </td>
        </ng-container>
        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
      </table>
    </mat-tab>
    
    <mat-tab label="{{ 'partitionsTab' | translate }}">
    </mat-tab>
  </mat-tab-group>
</mat-dialog-content>
<mat-dialog-actions align="end">
  <button mat-button mat-dialog-close (click)="onNoClick()">{{ 'closeButton' | translate }}</button>
</mat-dialog-actions>
