import { Component, Input, OnInit } from '@angular/core';
import { TypeSafeFormBuilder, TypeSafeFormGroup } from '@yourcause/common';
import { YCModalComponent } from '@yourcause/common/modals';
import { PageHelpModalService } from '../page-help-modals.service';
import { PageHelpRoutes } from '../page-help-modals.typing';
interface PageHelpDismissGroup {
  dismissHelp: boolean;
}

@Component({
  selector: 'gc-page-help-modal',
  templateUrl: './page-help-modal.component.html',
  styleUrls: ['./page-help-modal.component.scss']
})
export class PageHelpModalComponent extends YCModalComponent<boolean> implements OnInit {
  @Input() route: PageHelpRoutes;

  modalHeader: string;
  modalContent: string;
  formGroup: TypeSafeFormGroup<PageHelpDismissGroup> = this.formBuilder.group<PageHelpDismissGroup>({
    dismissHelp: false
  });
  // Allows target="_blank" to remain on resource links
  domPurifyConfig: DOMPurify.Config = {
    ADD_ATTR: ['target']
  };

  constructor (
    private pageHelpModalService: PageHelpModalService,
    private formBuilder: TypeSafeFormBuilder
  ) {
    super();
  }

  ngOnInit () {
    const helpers = this.pageHelpModalService.getHelpContentByRoute(this.route);
    this.modalHeader = helpers.modalHeader;
    this.modalContent = helpers.modalContent;
  }
}