<span class="chat-composer-upload">
  <span class="preview">
    {{#if (eq this.type this.IMAGE_TYPE)}}
      {{#if this.isDone}}
        <img class="preview-img" src={{this.upload.short_path}} />
      {{else}}
        {{d-icon "far-image"}}
      {{/if}}
    {{else}}
      {{d-icon "file-alt"}}
    {{/if}}
  </span>

  <span class="data">
    <div class="top-data">
      <span class="file-name">{{this.fileName}}</span>
      <DButton
        @class="btn-flat remove-upload"
        @action={{this.onCancel}}
        @icon="times"
        @title="chat.remove_upload"
      />
    </div>

    <div class="bottom-data">
      {{#if this.isDone}}
        <span class="extension-pill">{{this.upload.extension}}</span>
      {{else}}
        {{#if this.upload.processing}}
          <span class="processing">{{i18n "processing"}}</span>
        {{else}}
          <span class="uploading">{{i18n "uploading"}}</span>
        {{/if}}

        <progress
          class="upload-progress"
          id="file"
          max="100"
          value={{this.upload.progress}}
        ></progress>
      {{/if}}
    </div>
  </span>
</span>