<div fxLayout="row wrap" fxFlex="100" class="ucap-file-upload-queue-container">
  <div *ngFor="let fileUploadItem of fileUploadItems" class="file-upload-item">
    <div fxLayout="row" class="file-upload-info">
      <!--<mat-icon>image</mat-icon>-->
      <!--파일이미지 svg-->
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="16"
        height="16"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="1.5"
        stroke-linecap="butt"
        stroke-linejoin="round"
      >
        <path
          d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"
        ></path>
      </svg>

      <div class="file-upload-name">{{ fileUploadItem.file.name }}</div>
      <!-- <div (click)="onClickClear(fileUploadItem)">
        <mat-icon>clear</mat-icon>
      </div> -->
    </div>

    <div fxLayout="row" class="file-upload-progress">
      <mat-progress-bar
        mode="determinate"
        [value]="fileUploadItem.uploadingProgress$ | async"
      >
      </mat-progress-bar>
    </div>
  </div>

  <div *ngIf="uploadItems" fxLayout="column" class="uploadItems">
    <div class="msg-guide">
      <span class="icon-img"><i class="mid mdi-arrow-expand-all"></i></span
      >{{ 'common.file.dropZoneForUpload' | translate }}
    </div>
    <div></div>
  </div>
</div>