@if (items$ | async) {}
@if (distributeResult$ | async) {}

<fast-overlay />

@if ((loading$ | async) || (gridData.length !== 0)) {
<fast-window title="Please Confirm" [width]="1200 | winWidth" [height]="800 | winHeight" (close)="closedClicked()">
  @if (loading$ | async) {
  <fast-spinner />
  }
  <div class="flex flex-col grow overflow-hidden">
    <div class="flex ml-2">
      <fast-label>You are about to send {{gridData.length}} invoice(s) to customers.</fast-label>
    </div>
    <div class="flex ml-2">
      <fast-label>Are you sure you want to continue?</fast-label>
    </div>
    <div class="flex flex-col h-full overflow-auto">
      <fast-grid class="flex flex-col h-full overflow-auto" #grid [gridBinding]="gridData" [resizable]="true" scrollable="virtual">
        <fast-grid-col type="text" field="invoiceNum" [width]="100" [title]="'Invoice #'"></fast-grid-col>
        <fast-grid-col type="text" field="counterparty" [width]="225" [title]="'Counterparty'"></fast-grid-col>
        <fast-grid-col type="text" field="internalEntity" [width]="225" [title]="'Entity'"></fast-grid-col>
        <fast-grid-col type="text" field="counterpartyEmailAddresses" [width]="200" [title]="'Email Addresses'"></fast-grid-col>
      </fast-grid>
    </div>
    <fast-hr />
    <div class="flex flex-row bottomSection">
      <div class="flex flex-col grow mt-1 mr-2.5 mb-2 ml-0">

      </div>
      <div class="flex flex-col grow-0 items-stretch justify-end mt-1 mr-2.5 mb-2 ml-0">
        <fast-button class="w-37.5" type="primary" (click)="finishDistribute()" [disabled]="loading$ | async">
          <fast-svg icon="share" />Distribute
        </fast-button>
      </div>
      <div class="flex flex-col grow-0 items-stretch justify-end mt-1 mr-2.5 mb-2 ml-0">
        <fast-button class="w-37.5" type="basic" (click)="closedClicked()" [disabled]="loading$ | async">
          <fast-svg icon="cancel" /> Cancel
        </fast-button>
      </div>
    </div>
  </div>
</fast-window>
}