<!--
  ~ Copyright (C) 2023 StApps
  ~ This program is free software: you can redistribute it and/or modify it
  ~ under the terms of the GNU General Public License as published by the Free
  ~ Software Foundation, version 3.
  ~
  ~ This program is distributed in the hope that it will be useful, but WITHOUT
  ~ ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
  ~ FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
  ~ more details.
  ~
  ~ You should have received a copy of the GNU General Public License along with
  ~ this program. If not, see <https://www.gnu.org/licenses/>.
  -->

<ion-item (click)="modified.emit(); selection.click()" class="list-header" lines="none">
  <ion-list-header>
    <ion-label>{{ 'data.chips.add_events.popover.ALL' | translate }}</ion-label>
  </ion-list-header>
  <ion-checkbox slot="end" [checked]="selection.checked" [indeterminate]="selection.indeterminate">
  </ion-checkbox>
</ion-item>
<ng-container *ngFor="let frequency of selection.children">
  <ion-list inset="true" lines="full">
    <ion-item lines="none" (click)="modified.emit(); frequency.click()" class="list-header">
      <ion-list-header>
        <ion-label
          >{{ frequency.children[0].item.repeatFrequency ? (frequency.children[0].item.repeatFrequency |
          durationLocalized: true | sentencecase) : ('data.chips.add_events.popover.SINGLE' | translate |
          titlecase) }}</ion-label
        >
        <ion-button></ion-button>
      </ion-list-header>
      <ion-checkbox slot="end" [checked]="frequency.checked" [indeterminate]="frequency.indeterminate">
      </ion-checkbox>
    </ion-item>
    <ion-item
      *ngFor="let date of frequency.children"
      (click)="modified.emit(); date.selected = !date.selected; frequency.notifyChildChanged()"
    >
      <ion-label>
        <ng-container *ngIf="date.item.dates.length > 1; else single_event">
          <ion-text>
            {{ date.item.dates[0] | amDateFormat: 'dddd, LT' }} - {{ date.item.dates[0] | amAdd:
            date.item.duration | amDateFormat: 'LT' }}
          </ion-text>
          <br />
          <ion-text>
            {{ date.item.dates[0] | amDateFormat: 'LL' }} - {{ date.item.dates[date.item.dates.length - 1] |
            amDateFormat: 'LL' }}
          </ion-text>
        </ng-container>
        <ng-template #single_event>
          <ion-text *ngIf="date.item.dates[0] as time; else noDates">
            {{ time | amDateFormat: 'LL, LT' }} - {{ time | amAdd: date.item.duration | amDateFormat: 'LT' }}
          </ion-text>
          <ng-template #noDates>
            <ion-text color="danger">{{ 'data.chips.add_events.popover.DATA_ERROR' | translate }}</ion-text>
            <br />
            <ion-text *ngFor="let id of date.item.identifiers | keyvalue">
              {{ id.key }}: {{ id.value }}
            </ion-text>
          </ng-template>
        </ng-template>
        <ng-container class="ion-align-items-center" *ngIf="date.item.inPlace">
          <br />
          <ion-text color="medium" class="place">
            <ion-icon name="pin_drop"></ion-icon>
            <span> {{ 'inPlace.name' | thingTranslate: date.item }}</span>
          </ion-text>
        </ng-container>
      </ion-label>
      <ion-checkbox slot="end" [checked]="date.selected"> </ion-checkbox>
    </ion-item>
  </ion-list>
</ng-container>
