
<ng-container *ngIf="subvolumeGroup$ | async as subvolumeGroup">
  <cd-table *ngIf="subvolumeGroup"
            [data]="subvolumeGroup"
            columnMode="flex"
            [columns]="columns"
            selectionType="single"
            [hasDetails]="false"
            (fetchData)="fetchData()"
            (updateSelection)="updateSelection($event)">

    <div class="table-actions">
      <cd-table-actions [permission]="permissions.cephfs"
                        [selection]="selection"
                        class="btn-group"
                        id="cephfs-subvolumegropup-actions"
                        [tableActions]="tableActions">
      </cd-table-actions>
    </div>
  </cd-table>
</ng-container>

<ng-template #quotaUsageTpl
             let-row="data.row">
  <cd-usage-bar *ngIf="row.info.bytes_pcent && row.info.bytes_pcent !== 'undefined'; else noLimitTpl"
                [total]="row.info.bytes_quota"
                [used]="row.info.bytes_used"
                [title]="row.name"
                [showFreeToolTip]="false"
                customLegend="Quota"
                [customLegendValue]="row.info.bytes_quota"
                decimals="2"></cd-usage-bar>

  <ng-template #noLimitTpl>
    <span ngbTooltip="Quota limit is not set"
          *ngIf="row.info.bytes_pcent === 'undefined'"
          i18n-ngbTooltip>
      {{row.info.bytes_used | dimlessBinary}}</span>
  </ng-template>
</ng-template>

<ng-template #typeTpl
             let-value="data.value">
  <cd-label [value]="value"></cd-label>
</ng-template>

<ng-template #modeToHumanReadableTpl
             let-value="data.value">
  <span *ngFor="let result of (value | octalToHumanReadable)"
        [ngClass]="result.class"
        [ngbTooltip]="result.toolTip">
    {{ result.content }}
  </span>
</ng-template>
