import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { SpinnerService } from '@core/services/spinner.service';
import { AutoTableRepositoryFactory, BulkAction, DebounceFactory, PaginationOptions, TableDataFactory, TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { InvitationService } from '../invitation.service';
import { DistributionListApplicant } from '../invitation.typing';

@Component({
  selector: 'gc-distribution-list-applicants-table',
  templateUrl: './distribution-list-applicants-table.component.html',
  styleUrls: ['./distribution-list-applicants-table.component.scss']
})
export class DistributionListApplicantsTableComponent implements OnInit {
  @Input() id: number;
  @Output() onRecordCountChange = new EventEmitter<number>();
  topLevelFilters: TopLevelFilter[] = [];
  tableDataFactory: TableDataFactory<DistributionListApplicant>;
  bulkActions: BulkAction<DistributionListApplicant>[] = [];
  key: string;

  constructor (
    private i18n: I18nService,
    private invitationService: InvitationService,
    private spinnerService: SpinnerService,
    private autoTableFactory: AutoTableRepositoryFactory
  ) { }

  async ngOnInit () {
    this.key = this.invitationService.getDistributionListRepoKey(this.id);
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'applicantName',
        '',
        this.i18n.translate(
          'GLOBAL:textSearchByApplicantNameOrEmail',
          {},
          'Search by applicant name or email'
        ),
        undefined,
        undefined,
        [{
          column: 'applicantName',
          filterType: 'cn'
        }, {
          column: 'applicantEmail',
          filterType: 'cn'
        }]
      )
    ];
    this.bulkActions = [{
      label: this.i18n.translate(
        'PROGRAM:textRemoveFromDistributionList',
        {},
        'Remove from distribution list'
      ),
      disabled: () => {
        return false;
      },
      exec: (items: DistributionListApplicant[]) => {
        const ids = items.map((item) => item.distributionListApplicantId);

        return this.removeApplicants(ids);
      }
    }];
    const repo = this.autoTableFactory.getRepository(this.key);
    if (repo) {
      repo.reset();
    }
    this.tableDataFactory = DebounceFactory.createSimple(
      async (options: PaginationOptions<DistributionListApplicant>) => {
        const data = await this.invitationService.getDistributionListApplicants(
          this.id,
          options
        );
        if (data.recordCount || data.recordCount === 0) {
          this.onRecordCountChange.emit(data.recordCount);
        }

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

  async removeApplicants (applicantIds: number[]) {
    this.spinnerService.startSpinner();
    await this.invitationService.handleRemoveApplicantsFromList(
      this.id,
      applicantIds
    );
    this.spinnerService.stopSpinner();
  }
}