import { Component, OnInit } from '@angular/core';
import { SpinnerService } from '@core/services/spinner.service';
import { TranslationService } from '@core/services/translation.service';
import { CyclesService } from '@features/cycles/cycles.service';
import { ProgramService } from '@features/programs/program.service';
import { EmailService } from '@features/system-emails/email.service';
import { ALL_SKIP_FILTER, DebounceFactory, PaginationOptions, TableDataFactory, TopLevelFilter, TypeaheadSelectOption } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { ConfirmationModalComponent, ModalFactory } from '@yourcause/common/modals';
import moment from 'moment';
import { InvitationService } from '../invitation.service';
import { ScheduleRecord, SendInviteListModalResponse } from '../invitation.typing';
import { InviteesModalComponent } from '../invitees-modal/invitees-modal.component';
import { SendInvitationModalComponent } from '../send-invitation-modal/send-invitation-modal.component';

@Component({
  selector: 'gc-schedules-tab',
  templateUrl: './schedules-tab.component.html',
  styleUrls: ['./schedules-tab.component.scss']
})
export class SchedulesTabComponent implements OnInit {
  tableDataFactory: TableDataFactory<ScheduleRecord>;
  topLevelFilters: TopLevelFilter[] = [];
  viewTranslations = this.translationService.viewTranslations;
  programTranslationMap = this.viewTranslations.Grant_Program;
  cycleTranslationMap = this.viewTranslations.Grant_Program_Cycle;
  statusOptions = {
    selectOptions: [{
      display: this.i18n.translate(
        'GLOBAL:textAllSchedules',
        {},
        'All schedules'
      ),
      value: ALL_SKIP_FILTER
    },
    {
      display: this.i18n.translate(
        'PROGRAM:textUpcomingSchedules',
        {},
        'Upcoming schedules'
      ),
      value: false
    },
    {
      display: this.i18n.translate(
        'PROGRAM:textSentSchedules',
        {},
        'Sent schedules'
      ),
      value: true
    }]
  };
  distributionListSelects = this.invitationService.distributionLists.map((list) => {
    return {
      display: list.name,
      value: list.id
    };
  });
  distributionListOptions = {
    selectOptions: [{
      display: this.i18n.translate(
        'PROGRAM:textAllDistributionLists',
        {},
        'All distribution lists'
      ),
      value: ALL_SKIP_FILTER
    },
      ...this.distributionListSelects
    ]
  };
  cycleSelects = this.cycleService.allMyCycleSelectOptions;
  programSelects: TypeaheadSelectOption[] = this.programService.allActiveManagerPrograms
    .map((prog) => {
      return {
        label: prog.grantProgramName,
        value: prog.grantProgramId
      };
    });

  constructor (
    private translationService: TranslationService,
    private i18n: I18nService,
    private invitationService: InvitationService,
    private modalFactory: ModalFactory,
    private spinnerService: SpinnerService,
    private cycleService: CyclesService,
    private programService: ProgramService,
    private emailService: EmailService
  ) { }

  async ngOnInit () {
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'distributionListName',
        '',
        this.i18n.translate(
          'PROGRAM:textSearchByDistributionListName',
          {},
          'Search by distribution list name'
        ),
        undefined,
        undefined,
        [{
          column: 'distributionListName',
          filterType: 'cn'
        }]
      ),
      new TopLevelFilter(
        'typeaheadSingleEquals',
        'isSent',
        false,
        '',
        this.statusOptions,
        this.i18n.translate(
          'common:hdrStatus',
          {},
          'Status'
        )
      ),
      new TopLevelFilter(
        'typeaheadSingleEquals',
        'distributionListId',
        ALL_SKIP_FILTER,
        '',
        this.distributionListOptions,
        this.i18n.translate(
          'PROGRAM:textDistributionList',
          {},
          'Distribution list'
        )
      )
    ];
    this.tableDataFactory = DebounceFactory.createSimple(
      async (options: PaginationOptions<ScheduleRecord>) => {
        const result = await this.invitationService.getSchedules(
          options
        );

        return {
          success: true,
          data: result
        };
      }
    );
  }

  async updateSchedule (schedule: ScheduleRecord) {
    const response = await this.modalFactory.open(
      SendInvitationModalComponent,
      {
        toIndividual: false,
        schedule,
        forceFormGroupValueToDefault: false
      }
    );
    if (response) {
      const attachments = await this.emailService.returnIdsFromMixedAttachments(response.emailOptionsModel.attachments);
      const emailOptionsModel = {
        ...response.emailOptionsModel,
        attachments
      };
      const payload = {
        ...response,
        emailOptionsModel
      };
      this.spinnerService.startSpinner();
      await this.invitationService.handleUpdateSchedule(
        payload as SendInviteListModalResponse,
        schedule.distributionListScheduleId
      );
      this.spinnerService.stopSpinner();
    }
  }

  async deleteSchedule (row: ScheduleRecord) {
    const response = await this.modalFactory.open(
      ConfirmationModalComponent,
      {
        modalHeader: this.i18n.translate(
          'common:textDeleteSchedule',
          {},
          'Delete Schedule'
        ),
        confirmButtonText: this.i18n.translate(
          'common:btnDelete',
          {},
          'Delete'
        ),
        confirmText: this.i18n.translate(
          row.distributionListApplicantCount === 1 ?
            'PROGRAM:textDeleteScheduleConfirmSingleText' :
            'PROGRAM:textDeleteScheduleConfirmText',
          {
            name: row.distributionListName,
            date: moment(row.scheduledDate).format('ll'),
            count: row.distributionListApplicantCount
          },
          row.distributionListApplicantCount === 1 ?
            'This action will remove the schedule for __name__ on __date__ to 1 individual. Are you sure you  want to delete the schedule?' :
            'This action will remove the schedule for __name__ on __date__ to __count__ individuals. Are you sure you  want to delete the schedule?'
        )
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.invitationService.deleteSchedule(row.distributionListScheduleId);
      this.spinnerService.stopSpinner();
    }
  }

  inviteesModal (schedule: ScheduleRecord) {
    return this.modalFactory.open(
      InviteesModalComponent,
      {
        schedule
      }
    );
  }

}