<div class="wrapper">
    <div class="content">
        <h1>Nazwa: {{group?.name}}</h1>
        <p>Klucz: {{group?.groupKey}}</p>
        <br/>
        <div class="buttons-container">
            <button class="button" (click)="goToGroup()"><i class="fas fa-arrow-left"></i> Wróć do grupy</button>
            <button class="button" (click)="newKeyGenerate()"><i class="fas fa-key"></i> Generuj nowy klucz</button>
            <button class="button" (click)="showWaitingResources()"><i class="fas fa-stopwatch"></i> Oczekujące zasoby</button>
            <button class="button" (click)="showDialog()"><i class="fas fa-trash-alt"></i> Usuń grupę</button>
        </div>
        <br/>

      <h2> Lista użytkowników </h2>
      <ag-grid-angular style="width: 100%; height: 475px;" class="ag-theme-dark" [rowData]="group?.users" [columnDefs]="columnDefs"
      [enableSorting]="true" [enableFilter]="true" (gridReady)="onGridReady($event)" [gridOptions]="gridOptions"
      [pagination]="true" [paginationAutoPageSize]="true" [localeText]="localeText"
      (gridColumnsChanged)="onGridColumnsChanged($event)" (rowClicked)="onRowClicked($event)" (gridSizeChanged)="onGridSizeChanged($event)">
    </ag-grid-angular>
    </div>
</div>

<p-dialog header="Potwierdź" [(visible)]="display">
  Czy chcesz usunąć grupę?
  <p-footer>
      <button type="button" pButton icon="pi pi-check" (click)="deleteGroup()" label="TAK"></button>
      <button type="button" pButton icon="pi pi-close" (click)="display=false" label="NIE" class="ui-button-secondary"></button>
  </p-footer>
</p-dialog>
