import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { CurrencyService } from '@core/services/currency.service';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { TypeSafeFormGroup } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { AwardService } from '../award.service';
export interface AwardControlGroup {
  amount?: string;
  awardAmount?: string;
  cashAmount?: string;
  inKindAmount?: string;
}

@Component({
  selector: 'gc-award-amount-control',
  templateUrl: './award-amount-control.component.html',
  styleUrls: ['./award-amount-control.component.scss']
})
export class AwardAmountControlComponent implements OnInit  {
  @Input() awardFormGroup: TypeSafeFormGroup<AwardControlGroup>;
  @Input() disabled = false;
  @Input() controlName: 'amount'|'awardAmount'|'cashAmount'|'inKindAmount' = 'amount';
  @Input() rate = 1;
  @Input() label = this.i18n.translate(
    'GLOBAL:textAwardAmount',
    {},
    'Award amount'
  );
  @Input() showConversions = false;
  @Input() currencyRequested: string;
  @Input() awardAmountBaseHelpText = this.i18n.translate(
    'AWARDS:textAwardAmountHelp',
    {},
    'The amount you intend to award'
  );
  @Input() recommendedText: string;
  @Output() onAmountChange = new EventEmitter();

  currencyRequestedSymbol: string;
  defaultCurrency = this.clientSettingsService.defaultCurrency;
  formattingData = this.currencyService.formattingData;
  helpText = '';
  conversionText = this.i18n.translate(
    'GLOBAL:textCurrencyConversionDynamic',
    {
      currency: this.defaultCurrency
    },
    '__currency__ conversion'
  );

  constructor (
    private currencyService: CurrencyService,
    private clientSettingsService: ClientSettingsService,
    private i18n: I18nService,
    private awardService: AwardService
  ) { }

  ngOnInit () {
    this.currencyRequestedSymbol = this.formattingData[this.currencyRequested].symbol;
    this.setHelpText();
  }

  setHelpText () {
    if (this.showConversions) {
      const amount = this.awardService.getAmountInRequested(
        this.awardFormGroup.value[this.controlName],
        this.currencyRequested
      );
      const conversionAmountString = this.getConversionHelpText(amount * this.rate);
      this.helpText = `${this.awardAmountBaseHelpText}<br>
      ${this.recommendedText ? this.recommendedText + '<br>' : ''}
      ${conversionAmountString}`;
    } else {
      this.helpText = this.awardAmountBaseHelpText;
    }
  }

  getConversionHelpText (convertedAmount: number) {
    return `${this.conversionText}: ${
      this.currencyService.formatMoney(convertedAmount, this.defaultCurrency)
    }`;
  }

  _onAmountChange () {
    this.setHelpText();
    this.onAmountChange.emit();
  }
}