import { Component, Input, OnInit } from '@angular/core';
import { Validators } from '@angular/forms';
import { BatchItem, EditBatchModalResponse, ProcessingTypes } from '@core/typings/payment.typing';
import { TypeSafeFormBuilder, TypeSafeFormGroup } from '@yourcause/common';
import { AnalyticsService, EventType } from '@yourcause/common/analytics';
import { YCModalComponent } from '@yourcause/common/modals';

@Component({
  selector: 'gc-edit-batch-modal',
  templateUrl: './edit-batch-modal.component.html',
  styleUrls: ['./edit-batch-modal.component.scss']
})
export class EditBatchModalComponent extends YCModalComponent<EditBatchModalResponse> implements OnInit {
  @Input() batch: BatchItem;

  formGroup: TypeSafeFormGroup<EditBatchModalResponse>;
  ProcessingTypes = ProcessingTypes;

  constructor (
    private formBuilder: TypeSafeFormBuilder,
    private analyticsService: AnalyticsService
  ) {
    super();
  }

  ngOnInit () {
    this.formGroup = this.formBuilder.group<EditBatchModalResponse>({
      name: [this.batch.name, Validators.required],
      notes: this.batch.notes,
      externalBatchId: this.batch.externalBatchId
    });
  }

  save () {
    this.closeModal.emit(this.formGroup.value);
    this.analyticsService.emitEvent({
      eventName: 'Edit payment batch modal save',
      eventType: EventType.Click,
      extras: null
    });
  }
}