import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { SpinnerService } from '@core/services/spinner.service';
import { ApplicantSelectorModalComponent } from '@features/applicant/applicant-selector-modal/applicant-selector-modal.component';
import { I18nService } from '@yourcause/common/i18n';
import { ConfirmationModalComponent, ModalFactory } from '@yourcause/common/modals';
import { DistributionListImportModalComponent } from '../distribution-list-import-modal/distribution-list-import-modal.component';
import { DistributionListModalComponent } from '../distribution-list-modal/distribution-list-modal.component';
import { InvitationService } from '../invitation.service';
import { DistributionListRecord } from '../invitation.typing';

@Component({
  selector: 'gc-manage-distribution-list',
  templateUrl: './manage-distribution-list.component.html',
  styleUrls: ['./manage-distribution-list.component.scss']
})
export class ManageDistributionListComponent implements OnInit {
  id = this.activatedRoute.snapshot.params.id;
  baseTabRoute = `/management/program-setup/invitations/distribution/${this.id}`;
  distributionList: DistributionListRecord;
  distributionListText = this.i18n.translate(
    'PROGRAM:hdrDistributionList',
    {},
    'Distribution List'
  );
  availableApplicantsText = this.i18n.translate(
    'PROGRAM:hdrAvailableApplicants',
    {},
    'Available Applicants'
  );
  tabs = [{
    link: `${this.baseTabRoute}/included`,
    label: this.distributionListText,
    activeRoutes: ['included']
  }, {
    link: `${this.baseTabRoute}/available`,
    label: this.availableApplicantsText,
    activeRoutes: ['available']
  }];
  listCount = 0;
  availableCount = 0;

  constructor (
    private invitationService: InvitationService,
    private activatedRoute: ActivatedRoute,
    private modalFactory: ModalFactory,
    private spinnerService: SpinnerService,
    private i18n: I18nService
  ) { }

  get isIncluded () {
    return location.pathname.includes('included');
  }

  ngOnInit () {
    this.setDistributionList();
  }

  setDistributionList () {
    this.distributionList = this.invitationService.distributionLists.find((item) => {
      return +item.id === +this.id;
    });
  }

  onRecordCountChange (count: number, isAvailable = false) {
    let index = 0;
    let text = this.distributionListText;
    if (isAvailable) {
      this.availableCount = count;
      index = 1;
      text = this.availableApplicantsText;
    } else {
      this.listCount = count;
    }
    this.tabs = [
      ...this.tabs.slice(0, index),
      {
        ...this.tabs[index],
        label: `${text} (${count})`
      },
      ...this.tabs.slice(index + 1)
    ];
  }

  async updateListDetails () {
    const response = await this.modalFactory.open(
      DistributionListModalComponent,
      {
        distributionListId: +this.id
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.invitationService.handleCreateOrUpdateDistributionList(
        response.name,
        response.description,
        this.id
      );
      this.setDistributionList();
      this.spinnerService.stopSpinner();
    }
  }

  async addApplicant () {
    const response = await this.modalFactory.open(
      ApplicantSelectorModalComponent,
      {
        modalSubHeader: this.i18n.translate(
          'PROGRAM:textAddAnApplicantToDistList',
          {},
          'Add an applicant to the distribution list'
        )
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.invitationService.handleAddApplicantModal(
        this.id,
        response
      );
      this.spinnerService.stopSpinner();
    }
  }

  async addAllAvailableApplicants () {
    const response = await this.modalFactory.open(
      ConfirmationModalComponent,
      {
        modalHeader: this.i18n.translate(
          'PROGRAM:hdrAddAvailableApplicants',
          {},
          'Add Available Applicants'
        ),
        modalSubHeader: this.distributionList.name,
        confirmButtonText: this.i18n.translate(
          'common:linkAdd',
          {},
          'Add'
        ),
        confirmText: this.i18n.translate(
          this.availableCount === 1 ?
            'PROGRAM:textAreYouSureAddAllAvailableApplicantsConfirmSingle2' :
            'PROGRAM:textAreYouSureAddAllAvailableApplicantsConfirm2',
          {},
          this.availableCount === 1 ?
            'This action will add the applicant to the distribution list based on the filters applied to the available applicants table. Are you sure you want to add this applicant?' :
            'This action will add the applicants to the distribution list based on the filters applied to the available applicants table. Are you sure you want to add the available applicants?'
        )
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.invitationService.handleAddAvailableApplicants(
        this.id
      );
      this.spinnerService.stopSpinner();
    }
  }

  async clearDistributionList () {
    const response = await this.modalFactory.open(
      ConfirmationModalComponent,
      {
        modalHeader: this.i18n.translate(
          'PROGRAM:hdrClearDistributionList',
          {},
          'Clear Distribution List'
        ),
        modalSubHeader: this.distributionList.name,
        confirmButtonText: this.i18n.translate(
          'common:linkClear',
          {},
          'Clear'
        ),
        confirmText: this.i18n.translate(
          this.listCount === 1 ?
            'PROGRAM:textAreYouSureClearDistributionListConfirmSingle' :
            'PROGRAM:textAreYouSureClearDistributionListConfirm',
          {
            count: this.listCount
          },
          this.listCount === 1 ?
            'This action will remove 1 applicant from the distribution list. Are you sure you want to clear the distribution list?' :
            'This action will remove __count__ applicants from the distribution list. Are you sure you want to clear the distribution list?'
        )
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.invitationService.handleClearDistributionList(
        this.id
      );
      this.spinnerService.stopSpinner();
    }
  }

  async import () {
    const file = await this.modalFactory.open(
      DistributionListImportModalComponent,
      {
        distributionListId: this.id
      }
    );
    if (file) {
      this.spinnerService.startSpinner();
      await this.invitationService.importDistributionList(this.id, file);
      this.spinnerService.stopSpinner();
    }
  }
}