@if (!(showEmptyMessage$ | async)) {
  <ui-scroll-container
    class="mt-2"
    skeletonTemplate="task-calendar"
    [loading]="fetching$ | async"
    (reachEnd)="search()"
    [itemLength]="searchResultsLength$ | async"
    [deltaEnd]="250"
    >
    @for (group of displayItems$ | async; track group) {
      <div class="task-list search-list" [id]="group.group">
        <page-task-list-group
          header="{{ todayKey === group.group ? 'Heute, ' : '' }}{{ group.group | date: 'EEEE' }}, {{ group.group | date }}"
          [items]="group.items"
        ></page-task-list-group>
      </div>
    }
  </ui-scroll-container>
} @else {
  <div class="empty-message">Keine Suchergebnisse</div>
}


@if (previousBreadcrumb$ | async; as breadcrumb) {
  <div class="actions">
    <a class="cta-back cta-action-primary" [routerLink]="breadcrumb.path" [queryParams]="breadcrumb.params">Zurück zur Übersicht</a>
  </div>
}
