<div id="TipPageFilesInfoBox" class="card card-default" data-ng-init="collapsed = false">
  <div class="card-header clearfix" data-ng-click="collapsed = !collapsed; $event.stopPropagation();">
    <span data-translate>Attachments</span>
    <span class="float-right">
      <i data-ng-if="!collapsed" class="fa-solid fa-chevron-up" data-uib-tooltip="{{'Collapse' | translate}}"></i>
      <i data-ng-if="collapsed" class="fa-solid fa-chevron-down" data-uib-tooltip="{{'Expand' | translate}}"></i>
    </span>
  </div>
  <div class="card-body" data-ng-show="!collapsed">
    <div data-ng-show="tip.rfiles.length" class="table-responsive">
      <table class="table table-striped" id="fileList">
        <thead>
          <tr>
            <th data-translate>Filename</th>
            <th data-translate>Download</th>
            <th data-translate>Upload date</th>
            <th data-translate>Type</th>
            <th data-translate>File size</th>
          </tr>
        </thead>
        <tbody id="fileListBody">
          <tr id="file-{{$index}}" data-ng-repeat="file in tip.rfiles">
            <td>{{file.name}}</td>
            <td>
              <button class="btn btn-sm btn-primary tip-action-download-file"
                      data-uib-tooltip="{{'Download' | translate}}"
                      data-ng-click="downloadRFile(file)">
                <i class="fa-solid fa-download"></i>
              </button>
            </td>
            <td>{{file.creation_date | date:'dd-MM-yyyy HH:mm'}}</td>
            <td>{{file.type}}</td>
            <td>{{file.size | byteFmt:2}}</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div data-ng-if="Authentication.session.role === 'receiver' && !tip.context.enable_attachments" class="form-group">
      <label class="inline-checkbox">
        <input data-ng-model="tip.enable_attachments" data-ng-change="tip.operation('set', {'key': 'enable_attachments', 'value': tip.enable_attachments})" type="checkbox" />
        <span data-translate>Allow the whistleblower to add attachments</span>
      </label>
    </div>
  </div>
</div>
