import { Component } from '@angular/core';
import { TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { ModalFactory } from '@yourcause/common/modals';
import { HelpContentModalComponent } from '../help-content-modal/help-content-modal.component';
import { HelpContentService } from '../help-content.service';
import { HelpContent } from '../help-content.typing';

@Component({
  selector: 'gc-help-content-page',
  templateUrl: './help-content-page.component.html',
  styleUrls: ['./help-content-page.component.scss']
})
export class HelpContentPageComponent {
  constructor (
    private modalFactory: ModalFactory,
    private helpContentService: HelpContentService,
    private i18n: I18nService
  ) { }
  contents$ = this.helpContentService.changesTo$('contents');

  topLevelFilters = [
    new TopLevelFilter(
      'text',
      'name',
      '',
      this.i18n.translate('ADMIN:textSearchByHelpContentName', {}, 'Search by help content name')
    )
  ];

  $content: HelpContent;

  async openHelpContentModal (
    record?: HelpContent
  ) {
    const r = await this.modalFactory.open(
      HelpContentModalComponent,
      {
        existing: record
      }
    );

    if (r) {
      const content: HelpContent = {
        id: record?.id,
        ...r
      };

      await this.helpContentService.saveHelpContent(content);
    }
  }

  async openDeleteModal (
    id: number
  ) {
    await this.helpContentService.deleteHelpContent(id);
  }
}