<mat-dialog-content>
  @if (isConfigReady()) {
    <datetime-picker
      [selectedDate]="selectedDate"
      [selectedTime]="selectedTime"
      [selectedReminderCfgId]="selectedReminderCfgId"
      [reminderOptions]="remindAvailableOptions"
      [minDate]="minDate"
      [showQuickAccess]="data.showQuickAccess !== false"
      [timeLabel]="T.F.TASK.D_SELECT_DATE_AND_TIME.TIME | translate"
      (dateSelected)="dateSelected($event)"
      (timeChanged)="selectedTime = $event"
      (reminderChanged)="selectedReminderCfgId = $event"
      (quickAccessClick)="onQuickAccessClick($event)"
      (enterSubmit)="submit()"
    ></datetime-picker>
  }

  <div class="dialog-actions-and-warnings">
    @if (
      selectedTime &&
      (scheduleWarnings().hasOverlap || scheduleWarnings().isOutsideWorkHours)
    ) {
      <div
        class="schedule-info"
        aria-live="polite"
      >
        <mat-icon>info</mat-icon>
        <div class="schedule-info-text">
          @if (scheduleWarnings().hasOverlap) {
            <div>{{ T.F.TASK.D_SCHEDULE_TASK.INFO_OVERLAP | translate }}</div>
          }
          @if (scheduleWarnings().isOutsideWorkHours) {
            <div>{{ T.F.TASK.D_SCHEDULE_TASK.INFO_OUTSIDE_WORK_HOURS | translate }}</div>
          }
        </div>
      </div>
    }

    <mat-dialog-actions align="start">
      <div class="schedule-actions">
        @if (
          !data.isSelectDueOnly &&
          data.task &&
          (data.task.dueWithTime || plannedDayForTask)
        ) {
          <button
            (click)="remove()"
            color="warn"
            mat-stroked-button
            type="button"
          >
            @if (selectedTime) {
              <mat-icon>alarm_off</mat-icon>
            } @else {
              <mat-icon>event_busy</mat-icon>
            }
            {{ T.F.TASK.D_SCHEDULE_TASK.UNSCHEDULE | translate }}
          </button>
        }
        <button
          color="primary"
          mat-flat-button
          [disabled]="!selectedDate"
          (click)="submit()"
          type="button"
          data-test-id="schedule-submit-btn"
        >
          @if (selectedTime) {
            <mat-icon>alarm</mat-icon>
          } @else {
            <mat-icon>today</mat-icon>
          }
          {{ T.F.TASK.D_SCHEDULE_TASK.SCHEDULE | translate }}
        </button>
      </div>
      <button
        class="dialog-cancel-btn"
        mat-button
        (click)="close()"
        type="button"
        data-test-id="schedule-cancel-btn"
      >
        {{ T.G.CANCEL | translate }}
      </button>
    </mat-dialog-actions>
  </div>
</mat-dialog-content>
