<div class="bubble-main" (click)="onClickOpenViewer()">
  <div class="file-thumbimg">
    <img *ngIf="!!fileInfo.thumbUrl" [src]="fileInfo.thumbUrl" />
  </div>
  <div
    *ngIf="!fileInfo.thumbUrl"
    [ngClass]="['mime-icon', 'light', 'ico-' + fileInfo.fileExt]"
  >
    <div class="ico"></div>
  </div>
  <ul class="file-info">
    <li class="file-name">{{ fileInfo.fileName }}</li>
    <li class="file-size">
      {{ fileInfo.attachmentSize | ucapBytes }}
    </li>
    <li class="file-ext">
      {{ fileInfo.fileExt }}
    </li>
  </ul>
</div>
<div class="btn-box">
  <ul *ngIf="expired" class="expired">
    <li>{{ 'common.file.errors.expired' | translate }}</li>
  </ul>
  <ul *ngIf="!expired && fileInfo && fileInfo.attachmentSeq">
    <li>
      <button mat-button (click)="onClickSave()">
        {{ 'common.file.save' | translate }}
      </button>
    </li>
    <li>
      <button mat-button (click)="onClickSaveAs()">
        {{ 'common.file.saveAs' | translate }}
      </button>
    </li>
  </ul>
</div>
