import { Component, Input, OnInit } from '@angular/core';
import { TypeSafeFormBuilder, TypeSafeFormGroup } from '@yourcause/common';
import { AnalyticsService, EventType } from '@yourcause/common/analytics';
import { I18nService } from '@yourcause/common/i18n';
import { YCModalComponent } from '@yourcause/common/modals';

export interface AutoDeclinePayload {
  comment: string;
  notifyApplicant: boolean;
}

@Component({
  selector: 'gc-auto-decline-modal',
  templateUrl: './auto-decline-modal.component.html',
  styleUrls: ['./auto-decline-modal.component.scss']
})
export class AutoDeclineModalComponent extends YCModalComponent<AutoDeclinePayload> implements OnInit {
  @Input() comment: string;
  @Input() notifyApplicant = false;

  formGroup: TypeSafeFormGroup<AutoDeclinePayload>;
  headerText = this.i18n.translate(
    'PROGRAM:hdrDeclinationComment2',
    {},
    'Declination Comment'
  );

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

  ngOnInit () {
    this.setupFormGroup();
  }

  setupFormGroup () {
    this.formGroup = this.formBuilder.group({
      notifyApplicant: this.notifyApplicant,
      comment: this.comment ? this.comment : ''
    });
  }

  onCancel () {
    this.closeModal.emit();
  }

  submit () {
    this.closeModal.emit(this.formGroup.value);
    this.analyticsService.emitEvent({
      eventName: 'Auto-decline modal save',
      eventType: EventType.Click,
      extras: null
    });
  }

}