import { Component, Input, OnChanges } from '@angular/core';
import { CurrencyService } from '@core/services/currency.service';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';

@Component({
  selector: 'gc-amount-toggle',
  templateUrl: './amount-toggle.component.html',
  styleUrls: ['./amount-toggle.component.scss']
})
export class AmountToggleComponent implements OnChanges {
  @Input() amount: number;
  @Input() currencyRequested: string;
  @Input() currencyRequestedAmountEquivalent: number;

  defaultCurrency = this.clientSettingsService.defaultCurrency;
  amountString: string;
  currency: string;
  tooltip: string;

  constructor (
    private clientSettingsService: ClientSettingsService,
    private currencyService: CurrencyService
  ) { }

  ngOnChanges () {
    this.setToDefaultCurrency();
  }

  setToDefaultCurrency () {
    if (!this.currencyRequested) {
      this.currencyRequested = this.defaultCurrency;
    }
    this.amountString = this.currencyService.formatMoney(
      this.amount,
      this.defaultCurrency
    );
    this.currency = this.defaultCurrency;
  }

  setToApplicationCurrency () {
    this.amountString = this.currencyService.formatMoney(
      this.currencyRequestedAmountEquivalent,
      this.currencyRequested
    );
    this.currency = this.currencyRequested;
  }

  toggle () {
    if (this.currency === this.defaultCurrency) {
      this.setToApplicationCurrency();
    } else {
      this.setToDefaultCurrency();
    }
  }
}