<!--
~ Copyright (C) 2022 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/>.
-->
<div>
  <ion-card-header>
    <ion-card-title>{{ 'schedule.toCalendar.reviewModal.TITLE' | translate }}</ion-card-title>
    <ion-button fill="clear" (click)="dismissAction()">
      <ion-label>{{ 'modal.DISMISS' | translate }}</ion-label>
    </ion-button>
  </ion-card-header>

  <ion-card-content>
    <ion-list lines="none">
      @for (event of iCalEvents; track event) {
        <ion-item-group>
          <ion-item-divider>
            <ion-label>{{ event.title }}</ion-label>
            @if (event.events.length > 1) {
              <ion-note slot="start">
                <ion-icon name="insert_page_break"></ion-icon>
              </ion-note>
            }
          </ion-item-divider>
          @for (iCalEvent of event.events; track iCalEvent) {
            <ion-item>
              <ion-label>
                @if (iCalEvent.cancelled) {
                  <s><ng-container [ngTemplateOutlet]="date"></ng-container> </s>
                } @else {
                  {{ moment(iCalEvent.start) | amDateFormat: 'll, HH:mm' }}
                }
                <ng-template #date> {{ moment(iCalEvent.start) | amDateFormat: 'll, HH:mm' }} </ng-template>
              </ion-label>
              @if (iCalEvent.rrule) {
                <ion-note>
                  {{ iCalEvent.rrule.interval }} {{ iCalEvent.rrule.freq | sentencecase }}
                </ion-note>
              }
              @if (iCalEvent.rrule) {
                <ion-icon name="event_repeat"></ion-icon>
              }
            </ion-item>
          }
        </ion-item-group>
      }
    </ion-list>
  </ion-card-content>

  <div class="horizontal-flex">
    <ion-item lines="none">
      <ion-checkbox [(ngModel)]="includeCancelled">{{
        'schedule.toCalendar.reviewModal.INCLUDE_CANCELLED' | translate
      }}</ion-checkbox>
    </ion-item>
  </div>
  <div class="horizontal-flex">
    <ion-button fill="clear" (click)="export()">
      {{ 'share' | translate }}
      <ion-icon slot="end" name="share"></ion-icon>
    </ion-button>
    @if (isWeb) {
      <ion-button fill="outline" (click)="download()">
        {{ 'schedule.toCalendar.reviewModal.DOWNLOAD' | translate }}
        <ion-icon slot="end" name="download"></ion-icon>
      </ion-button>
    } @else {
      <ion-button fill="outline" (click)="toCalendar()">
        {{ 'schedule.toCalendar.reviewModal.EXPORT' | translate }}
        <ion-icon slot="end" name="event_upcoming"></ion-icon>
      </ion-button>
    }
  </div>
</div>
