import { StringMap } from '@angular/compiler/src/compiler_facade_interface';
import { Component, OnInit } from '@angular/core';
import { TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { FormsService } from '../services/forms/forms.service';

@Component({
  selector: 'gc-translate-forms-page',
  templateUrl: './translate-forms-page.component.html',
  styleUrls: ['./translate-forms-page.component.scss']
})
export class TranslateFormsPageComponent implements OnInit {
  topLevelFilters: TopLevelFilter[];
  formOptions = this.formService.allFormOptions;
  richTextMap: StringMap = {};
  ckEditorConfig: CKEDITOR.config = {
    removeButtons: ''
  };

  constructor (
    private i18n: I18nService,
    private formService: FormsService
  ) { }

  ngOnInit () {
    this.formOptions.forEach((form) => {
      this.richTextMap[form.value] = form.label;
    });
    this.setFilters();
  }


  setFilters () {
    const formFilter = new TopLevelFilter(
      'checkboxDropdown',
      'formId',
      [],
      this.i18n.translate(
        'FORMS:textSearchForAForm',
        {},
        'Search for a form'
      ),
      {
        selectOptions: this.formOptions,
        filterObjectName: this.i18n.translate(
          'GLOBAL:textForm', {}
        ).toLowerCase(),
        filterObjectNamePlural: this.i18n.translate(
          'common:textForms', {}
        ).toLowerCase()
      }
    );
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'defaultTranslationText',
        '',
        this.i18n.translate(
          'FORMS:textSearchTranslations',
          {},
          'Search translations'
        )
      )
    ];
    if (this.formOptions.length > 0) {
      this.topLevelFilters.push(formFilter);
    }
  }


  getDefaultLangOnFilterChange = (ids: number[]) => {
    return this.formService.getMostCommonDefaultLangFromArray(ids);
  };
}