<ng-container *ngVar="(bitstreamRD$ | async) as bitstreamRD">
  <div class="container">
    @if (bitstreamRD?.hasSucceeded) {
      <div class="row">
        <div class="col-md-2">
          <ds-thumbnail [thumbnail]="bitstreamRD?.payload"></ds-thumbnail>
        </div>
        <div class="col-md-10">
          <div class="container">
            <div class="row">
              <div class="col-12">
                <h1 class="h2 dont-break-out">{{dsoNameService.getName(bitstreamRD?.payload)}} <span class="text-muted">({{bitstreamRD?.payload?.sizeBytes | dsFileSize}})</span></h1>
              </div>
            </div>
          </div>
          @if (formGroup) {
            <ds-form [formId]="'edit-bitstream-form-id'"
              [formGroup]="formGroup"
              [formModel]="formModel"
              [formLayout]="formLayout"
              [submitLabel]="'form.save'"
              (submitForm)="onSubmit()"
              (cancel)="onCancel()"
              (dfChange)="onChange($event)">
              <div additional class="container py-3">
                <a [routerLink]="['/bitstreams', bitstreamRD?.payload?.id, 'authorizations']">{{'bitstream.edit.authorizations.link' | translate}}</a>
              </div>
            </ds-form>
          }
        </div>
      </div>
    }
    @if (bitstreamRD?.hasFailed) {
      <ds-error message="{{'error.bitstream' | translate}}"></ds-error>
    }
    @if (!bitstreamRD || bitstreamRD?.isLoading) {
      <ds-loading
      message="{{'loading.bitstream' | translate}}"></ds-loading>
    }
  </div>
</ng-container>
