import {Component, OnInit, EventEmitter, Output, Input, ChangeDetectionStrategy} from '@angular/core';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {CustomErrorStateMatcher} from '@app/_helpers';
import {TransactionService} from '@app/_services';

@Component({
  selector: 'app-disbursement',
  templateUrl: './disbursement.component.html',
  styleUrls: ['./disbursement.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class DisbursementComponent implements OnInit {
  @Input() account;
  @Output() cancelDisbursmentEvent = new EventEmitter();
  disbursementForm: FormGroup;
  matcher = new CustomErrorStateMatcher();
  submitted: boolean = false;

  constructor(
    private formBuilder: FormBuilder,
    private transactionService: TransactionService
  ) { }

  ngOnInit(): void {
    this.disbursementForm = this.formBuilder.group({
      transactionType: ['', Validators.required],
      recipient: '',
      amount: ['', Validators.required]
    });
  }

  get disbursementFormStub(): any { return this.disbursementForm.controls; }

  async createTransfer(): Promise<void> {
    this.submitted = true;
    if (this.disbursementForm.invalid || !confirm('Make transfer?')) { return; }
    if (this.disbursementFormStub.transactionType.value === 'transfer') {
      await this.transactionService.transferRequest(
        this.account.token,
        this.account.address,
        this.disbursementFormStub.recipient.value,
        this.disbursementFormStub.amount.value
      );
    }
    this.submitted = false;
  }

  cancel(): void {
    this.cancelDisbursmentEvent.emit();
  }
}