import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { Validators } from '@angular/forms';
import { LocationService } from '@core/services/location.service';
import { SpinnerService } from '@core/services/spinner.service';
import { BaseApplication } from '@core/typings/application.typing';
import { ProgramApplicantType } from '@core/typings/program.typing';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { Form, FormTypes } from '@features/configure-forms/form.typing';
import { FormsService } from '@features/configure-forms/services/forms/forms.service';
import { FormLogicService } from '@features/formio/services/form-logic/form-logic.service';
import { TypeaheadSelectOption, TypeSafeFormBuilder, TypeSafeFormGroup } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { NotifierService } from '@yourcause/common/notifier';
import { Subscription } from 'rxjs';
export interface DetailsFormGroup {
  name: string;
  description: string;
  formId: number;
  programApplicantType: ProgramApplicantType;
}

@Component({
  selector: 'gc-program-automation-builder-details',
  templateUrl: './program-automation-builder-details.component.html',
  styleUrls: ['./program-automation-builder-details.component.scss']
})
export class ProgramAutomationBuilderDetailsComponent implements OnInit, OnDestroy {
  @Input() name: string;
  @Input() description: string;
  @Input() formId: number;
  @Input() programApplicantType: ProgramApplicantType;
  @Input() fallbackProgramId: number;
  @Input() numberOfRules: number;
  @Output() onChange = new EventEmitter<DetailsFormGroup>();
  @Output() onValidChange = new EventEmitter<boolean>();

  formGroup: TypeSafeFormGroup<DetailsFormGroup>;
  routingFormOptions = this.formService.getRoutingFormOptions();
  showRefresh = false;
  FormTypes = FormTypes;
  form: Form;
  revisionId: number;
  applicantTypeOptions: TypeaheadSelectOption[] = [{
    label: this.i18n.translate(
      'common:textIndividualApplicants',
      {},
      'Individual applicants'
    ),
    value: ProgramApplicantType.INDIVIDUAL
  }, {
    label: this.i18n.translate(
      'common:textNonprofitOrganizations',
      {},
      'Nonprofit organizations'
    ),
    value: ProgramApplicantType.ORGS
  }];
  parentFields: Partial<BaseApplication> = {
    amountRequested: null,
    currencyRequestedAmountEquivalent: null,
    amountRequestedForEdit: null,
    currencyRequested: this.clientSettingsService.defaultCurrency,
    referenceFields: {},
    reviewerRecommendedFundingAmount: null
  };
  sub = new Subscription();

  constructor (
    private formBuilder: TypeSafeFormBuilder,
    private formService: FormsService,
    private locationService: LocationService,
    private i18n: I18nService,
    private notifier: NotifierService,
    private spinnerService: SpinnerService,
    private clientSettingsService: ClientSettingsService,
    private formLogicService: FormLogicService
  ) { }

  ngOnInit () {
    let formId = this.formId;
    let emitFormId = false;
    if (!formId && this.routingFormOptions.length === 1) {
      formId = this.routingFormOptions[0].value;
      emitFormId = true;
    }
    this.formGroup = this.formBuilder.group({
      name: [this.name || '', Validators.required],
      description: [this.description || '', Validators.required],
      formId: [formId, Validators.required],
      programApplicantType: [
        this.programApplicantType || ProgramApplicantType.ORGS,
        Validators.required
      ]
    });
    this.sub.add(this.formGroup.statusChanges.subscribe((val) => {
      this.onValidChange.emit(val === 'VALID');
    }));
    this.onValidChange.emit(this.formGroup.valid);
    if (emitFormId) {
      this.formChanged();
    } else {
      this.setFormInfo();
    }
  }

  async formChanged () {
    await this.setFormInfo();
    this.emitChanges();
  }

  async setFormInfo () {
    const formId = this.formGroup.value.formId;
    if (formId) {
      this.revisionId = this.formService.getLatestRevisionId(formId, true);
      this.spinnerService.startSpinner();
      this.form = await this.formLogicService.getAndSetForm(formId, this.revisionId);
      this.spinnerService.stopSpinner();
    } else {
      this.form = null;
      this.revisionId = null;
    }
  }

  emitChanges () {
    this.onChange.emit(this.formGroup.value);
  }

  async refreshForms () {
    this.spinnerService.startSpinner();
    await this.formService.refreshForms();
    this.routingFormOptions = this.formService.getRoutingFormOptions();
    this.notifier.success(this.i18n.translate(
      'FORMS:textFormListRefreshedToastr',
      {},
      'Form list refreshed. New published routing forms can be selected.'
    ));
    this.showRefresh = false;
    this.spinnerService.stopSpinner();
  }

  newForm () {
    this.showRefresh = true;
    const url = '/management/program-setup/forms/all';
    const path = this.locationService.getRelativeUrl(
      url,
      `createFormType=${FormTypes.ROUTING}`
    );

    window.open(path, '_blank');
  }

  ngOnDestroy (): void {
    this.sub.unsubscribe();
  }
}