<tabset *ngIf="selection.hasSingleSelection">
  <tab i18n-heading heading="Details">
    <div *ngIf="bucket">
      <table class="table table-striped table-bordered">
        <tbody>
          <tr>
            <td i18n
                class="bold col-sm-1">Name</td>
            <td class="col-sm-3">{{ bucket.bucket }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">ID</td>
            <td>{{ bucket.id }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Owner</td>
            <td>{{ bucket.owner }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Index type</td>
            <td>{{ bucket.index_type }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Placement rule</td>
            <td>{{ bucket.placement_rule }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Marker</td>
            <td>{{ bucket.marker }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Maximum marker</td>
            <td>{{ bucket.max_marker }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Version</td>
            <td>{{ bucket.ver }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Master version</td>
            <td>{{ bucket.master_ver }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Modification time</td>
            <td>{{ bucket.mtime }}</td>
          </tr>
          <tr>
            <td i18n
                class="bold col-sm-1">Zonegroup</td>
            <td>{{ bucket.zonegroup }}</td>
          </tr>
        </tbody>
      </table>

      <!-- Bucket quota -->
      <div *ngIf="bucket.bucket_quota">
        <legend i18n>Bucket quota</legend>
        <table class="table table-striped table-bordered">
          <tbody>
            <tr>
              <td i18n
                  class="bold col-sm-1">Enabled</td>
              <td class="col-sm-3">{{ bucket.bucket_quota.enabled ? "Yes" : "No" }}</td>
            </tr>
            <tr>
              <td i18n
                  class="bold col-sm-1">Maximum size</td>
              <td *ngIf="bucket.bucket_quota.max_size <= -1"
                  i18n
                  class="col-sm-3">Unlimited</td>
              <td *ngIf="bucket.bucket_quota.max_size > -1"
                  class="col-sm-3">
                {{ bucket.bucket_quota.max_size | dimless }}
              </td>
            </tr>
            <tr>
              <td i18n
                  class="bold col-sm-1">Maximum objects</td>
              <td *ngIf="bucket.bucket_quota.max_objects <= -1"
                  i18n
                  class="col-sm-3">Unlimited</td>
              <td *ngIf="bucket.bucket_quota.max_objects > -1"
                  class="col-sm-3">
                {{ bucket.bucket_quota.max_objects }}
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </tab>
</tabset>
