<div class="isa-card">
  <h3 class="heading">{{ group.items[0].firstName }} {{ group.items[0].lastName }}</h3>
  <ng-container *ngFor="let byOrderNumber of group.items | groupBy: byOrderNumberFn; let lastOrder = last">
    <ng-container *ngFor="let byProcessingStatus of byOrderNumber.items | groupBy: byProcessingStatusFn; let lastStatus = last">
      <ng-container *ngFor="let groupedBy of byProcessingStatus.items | groupBy: byCompartmentCodeFn; let lastCompartment = last">
        <div class="isa-mb-12 isa-mt-12">
          <app-search-result-group-item
            *ngFor="let item of groupedBy.items; let firstItem = first; let lastItem = last"
            [item]="item"
            [class.group-item-bottom-space]="!lastItem"
            (click)="selectOrderItemListItem.emit(item)"
            [displayCompartmentCode]="firstItem"
          >
          </app-search-result-group-item>
        </div>
        <div class="divider" *ngIf="!lastCompartment"></div>
      </ng-container>
      <div class="divider" *ngIf="!lastStatus"></div>
    </ng-container>
    <div class="divider" *ngIf="!lastOrder"></div>
  </ng-container>
</div>
