<div *ngIf="object" layoutDirection="column" class="fl-content fl-content-min-height">
    <p class="fl-detail" i18n>ID: {{ object.id }}</p>
    <p class="fl-detail" i18n>Region: {{ object.region }}</p>
    <p class="fl-detail" i18n>Size: {{ object.size | number }} GB</p>
    <p class="fl-detail" i18n>Created at: <app-date-displayer [date]="object.created_at" withTime></app-date-displayer></p>
    <p *ngIf="authSvc.feature('ui.openstack.volumes.snapshots.show-client') && object.client"
       class="fl-detail" i18n>Client:
      <a class="active-link" [routerLink]="[config.getPanelUrl('clients-users/clients'), object.client.id]">
        {{ object.client.display || object.client.name }}
      </a>
    </p>
    <p class="fl-detail" *ngIf="object.volume" i18n>
      Related volume:
      <a class="active-link" [routerLink]="[config.getPanelUrl('openstack/volumes'), object.volume]">
        {{ object.related_volume_name || object.volume }}
      </a>
    </p>
    <p class="fl-detail" *ngIf="object.description" i18n>Description: {{ object.description | nullValue }}</p>
</div>
