import { Component, Input, OnInit } from '@angular/core';
import { PaymentForProcess } from '@core/typings/payment.typing';
import { TypeSafeFormBuilder, TypeSafeFormGroup } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { YCModalComponent } from '@yourcause/common/modals';


@Component({
  selector: 'gc-payment-recall-modal',
  templateUrl: './payment-recall-modal.component.html',
  styleUrls: ['./payment-recall-modal.component.scss']
})

export class PaymentRecallModalComponent extends YCModalComponent<{ comment: string}> implements OnInit {
  @Input() payment: PaymentForProcess;
  @Input() isEligible: boolean;
  formGroup: TypeSafeFormGroup<{ comment: string}>;
  modalHeader: string;

  constructor (
    private formBuilder: TypeSafeFormBuilder,
    private i18n: I18nService
  ) {
    super();
  }

  async ngOnInit () {
    this.formGroup = this.formBuilder.group({
      comment: ''
    });
    this.setModalHeader();
  }

  setModalHeader () {
    if (this.isEligible) {
      this.modalHeader = this.i18n.translate(
        'MANAGE:hdrPaymentRecall',
        {},
        'Remove Payment from Batch'
      );
    } else {
      this.modalHeader = this.i18n.translate(
        'MANAGE:hdrUnableToRecallPayment',
        {},
        'Unable to Remove Payment from Batch'
      );
    }
  }

  recallPayment () {
    this.closeModal.emit(this.formGroup.value);
  }
}