import { Component, Input, OnChanges, OnInit } from '@angular/core';
import { StatusService } from '@core/services/status.service';
import { TranslationService } from '@core/services/translation.service';
import { ApplicantFormForUI, ApplicationFromPaginated, ApplicationManagerMap, PaymentStats } from '@core/typings/application.typing';
import { FundingSourceTypes } from '@core/typings/budget.typing';
import { PaymentStatus } from '@core/typings/status.typing';
import { ApplicationFormService } from '@features/application-forms/services/application-forms.service';
import { AwardFromApi } from '@features/awards/typings/award.typing';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { FormStatuses } from '@features/configure-forms/form.typing';
import { I18nService } from '@yourcause/common/i18n';
import { ModalFactory } from '@yourcause/common/modals';
import { ApplicationManagerService } from '../services/application-manager/application-manager.service';
import { ViewFormModalComponent } from '../view-form-modal/view-form-modal.component';
import { ViewPaymentsModalComponent } from '../view-payments-modal/view-payments-modal.component';

@Component({
  selector: 'gc-application-manager-drilldown',
  templateUrl: './application-manager-drilldown.component.html',
  styleUrls: ['./application-manager-drilldown.component.scss']
})
export class ApplicationManagerDrilldownComponent implements OnInit, OnChanges {
  @Input() isNomination: boolean;
  @Input() application: ApplicationFromPaginated;
  @Input() applicationMap: ApplicationManagerMap;
  @Input() showMaskedApplicants: boolean;

  FormStatuses = FormStatuses;
  paymentSubStatusMap = this.statusService.paymentSubStatusMap;
  statusMapForm = this.statusService.formStatusMap;
  paymentStatusMap = this.statusService.paymentStatusMap;
  FundingTypes = FundingSourceTypes;
  PaymentStatus = PaymentStatus;
  awardTotalDefault = 0;
  awardTotalRequested = 0;
  paymentTotalDefault: string;
  paymentTotalRequested: string;
  numberOfPayments = 0;
  currencyRequested: string;
  defaultCurrency = this.clientSettingsService.defaultCurrency;
  showInDefault = true;
  showAmountToggle = false;
  showInDefaultCurrencyText = this.i18n.translate(
    'GLOBAL:textShowInDefaultCurrency',
    {},
    'Show in default currency'
  );
  showInRequestedCurrencyText = this.i18n.translate(
    'GLOBAL:textShowInRequestedCurrency',
    {},
    'Show in requested currency'
  );
  globeTooltip = this.showInDefaultCurrencyText;
  viewTranslations = this.translationService.viewTranslations;
  numberOfSubmittedForms: number;
  paymentStats: PaymentStats;

  constructor (
    private modalFactory: ModalFactory,
    private statusService: StatusService,
    private clientSettingsService: ClientSettingsService,
    private i18n: I18nService,
    private translationService: TranslationService,
    private applicationManagerService: ApplicationManagerService,
    private applicationFormService: ApplicationFormService
  ) { }

  async ngOnInit () {
    this.paymentStats = await this.applicationManagerService.getPaymentStats(
      [this.application.applicationId],
      true
    );
  }

  ngOnChanges () {
    this.setHelperAttributes();
  }

  setHelperAttributes () {
    this.currencyRequested = this.application.currencyRequested;
    if (this.currencyRequested !== this.defaultCurrency) {
      this.showAmountToggle = true;
    }
    const awards = this.applicationMap[
      this.application.applicationId
    ].awards.awards;
    this.numberOfPayments = awards.reduce((acc, award) => {
      const filteredPayments = award.payments.filter((payment) => {
        return payment.status !== PaymentStatus.Voided;
      });

      return acc + filteredPayments.length;
    }, 0);
    const forms = this.applicationMap[this.application.applicationId]?.forms ?? [];
    this.numberOfSubmittedForms = forms.reduce((acc, form) => {
      if (form.formStatus === FormStatuses.Submitted) {
        return acc + 1;
      }

      return acc;
    }, 0);
  }

  toggleAmounts () {
    this.showInDefault = !this.showInDefault;
    if (this.showInDefault) {
      this.globeTooltip = this.showInRequestedCurrencyText;
    } else {
      this.globeTooltip = this.showInDefaultCurrencyText;
    }
  }

  onFormClick (form: ApplicantFormForUI, application: ApplicationFromPaginated) {
    const deps = {
      form: this.applicationFormService.adaptApplicantFormToViewFormResponse(
        form
      ),
      applicationId: application.applicationId,
      forOrg: !!application.organizationId,
      isNomination: this.isNomination
    };
    this.modalFactory.open(
      ViewFormModalComponent,
      deps
    );
  }

  async viewPayments (award: AwardFromApi) {
    const deps = {
      award,
      showInDefault: this.showInDefault,
      currencyRequested: this.currencyRequested,
      isArchived: this.application.isArchived
    };
    await this.modalFactory.open(
      ViewPaymentsModalComponent,
      deps
    );
  }
}