src/app/features/details/components/attachments/statement-details-attachments.component.html

<!-------------------------------------------------------------------------------
 * Copyright (c) 2020 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 *
 * SPDX-License-Identifier: EPL-2.0
 -------------------------------------------------------------------------------->

<app-collapsible
  [(appCollapsed)]="appCollapsed"
  [appTitle]="'details.attachments.title' | translate">

  <div *ngIf="(statementAttachments$| async)?.length > 0 || mailTextAttachment != null"
       class="attachments">

    <div *ngIf="mailTextAttachment"
         class="attachments--email">
      <app-attachment-display-list
        (appDownload)="downloadAttachment($event)"
        [appAttachments]="[mailTextAttachment]"
        [appTagList]="[]"
        [appTitle]="'details.attachments.email' | translate">
      </app-attachment-display-list>
    </div>

    <div
      *ngIf="(allAttachments$ | async)?.length > 0 || (statementAttachments$ | async)?.length > 0">
      <div *ngIf="availableTags?.length > 0"
           class="attachments--documents--filter-btns">
        <button (click)="deselectAllTags()"
                class="openk-button openk-button-rounded"
                type="button">
          <mat-icon>filter_list</mat-icon>
        </button>

        <ng-container *ngFor="let tag of availableTags">
          <button (click)="toggleTag(tag)"
                  [class.openk-info]="tag?.isSelected"
                  class="openk-button openk-chip">
            {{tag?.label}}
          </button>
        </ng-container>
      </div>


      <div class="attachments--documents--lists">
        <app-attachment-display-list
          (appDownload)="downloadAttachment($event)"
          [appAttachments]="allAttachments"
          [appTagList]="tags$ | async"
          [appTitle]="'details.attachments.emailDocuments' | translate"
          class="attachments--document--lists---half-size attachments--document--lists---space-between">
        </app-attachment-display-list>

        <app-attachment-display-list
          (appDownload)="downloadAttachment($event)"
          [appAttachments]="statementAttachments"
          [appTagList]="tags$ | async"
          [appTitle]="'Manuell hinzugefügte Anhänge'"
          class="attachments--document--lists---half-size">
        </app-attachment-display-list>
      </div>

    </div>
  </div>

  <div *ngIf="!((statementAttachments$| async)?.length > 0 || mailTextAttachment != null)"
       class="placeholder">
    {{"details.attachments.placeholder" | translate}}
  </div>

</app-collapsible>