<div class="inner-scroll bg-gray-white flex-grow">
  <div class="card-block overflow-visible">
    <c8y-list-group>
      <c8y-li-timeline *ngFor="let archive of archives" [ngClass]="{ active: isActive(archive) }">
        {{ archive.created | date: 'd MMM YYYY' }}
        {{ archive.created | date: 'shortTime' }}
        <c8y-li>
          <c8y-li-icon
            [icon]="checkIfLast(archive) ? 'flag-checkered' : 'file-zip-o'"
          ></c8y-li-icon>
          <c8y-li-body>
            <div class="d-flex a-i-start">
              <div style="min-width: 0; flex: 1">
                <span class="text-truncate-wrap" title=" {{ archive.description || archive.name }}">
                  {{ archive.description || archive.name }}
                </span>
                <small *ngIf="archive.description" class="text-muted">{{
                  archive.description
                }}</small>
              </div>
              <i
                *ngIf="isLoading && toActivate(archive)"
                [c8yIcon]="'circle-o-notch'"
                class="icon-spin"
                title="{{ 'Activating' | translate }}"
              ></i>

              <span *ngIf="isActive(archive)" class="label label-primary m-l-auto m-t-4">{{
                'Active' | translate
              }}</span>
            </div>
          </c8y-li-body>
          <c8y-li-action
            (click)="setActive(archive)"
            *ngIf="hasAdminPermissions && !isLoading && !isActive(archive)"
            icon="check-square-o"
          >
            {{ 'Set as active`archive`' | translate }}
          </c8y-li-action>
          <c8y-li-action (click)="downloadArchive(archive)" icon="download">
            {{ 'Download`archive`' | translate }}
          </c8y-li-action>
          <c8y-li-action
            (click)="deleteArchive(archive)"
            *ngIf="
              hasAdminPermissions &&
              archives.length > 1 &&
              !checkIfLast(archive) &&
              !isActive(archive)
            "
            icon="trash"
          >
            {{ 'Delete`archive`' | translate }}
          </c8y-li-action>
          <c8y-li-action
            (click)="reactivateArchive()"
            *ngIf="hasAdminPermissions && canReactivate && isActive(archive)"
            icon="undo"
          >
            {{ 'Reactivate archive' | translate }}
          </c8y-li-action>
        </c8y-li>
      </c8y-li-timeline>
    </c8y-list-group>
  </div>
</div>
<div class="card-footer">
  <c8y-form-group *ngIf="!isLoading && hasAdminPermissions" class="m-auto">
    <c8y-upload-archive [(application)]="application" (refresh)="onRefresh()"></c8y-upload-archive>
  </c8y-form-group>
</div>