import { Component } from "@angular/core";
import {
  NgbModal,
  NgbPagination,
  NgbAlertModule,
} from "@ng-bootstrap/ng-bootstrap";
import { Faq, FaqService } from "src/app/cores/api-services/manage/faq.service";
import { BaseCrudComponent } from "src/app/cores/class-templates/base-crud.component";
import { HelpersService } from "src/app/cores/services/helpers.service";
import { LoadingService } from "src/app/cores/services/loading.service";
import { Subject, takeUntil } from "rxjs";
import { ActionFaq } from "../action/action.component";
import { CommonModule } from "@angular/common";
import { AlertComponent } from "src/app/pages/dashboard/components/alert/alert.component";

interface Alert {
  type: string;
  message: string;
}

@Component({
  selector: "app-faq",
  standalone: true,
  imports: [CommonModule, NgbPagination, NgbAlertModule, AlertComponent],
  templateUrl: "./faq.component.html",
  styleUrls: ["./faq.component.scss"],
})
export class FaqComponent extends BaseCrudComponent<Faq> {
  dataInsertSubs$ = new Subject<void>();
  dataUpdateSubs$ = new Subject<void>();

  alerts!: Alert[];
  showFullText: boolean = false;

  constructor(
    public override helpers: HelpersService,
    public override loading: LoadingService,
    public override api: FaqService,
    public override modal: NgbModal
  ) {
    super(helpers, loading, api, modal);
  }

  message = "Pertanyaan yang sering ditanyakan oleh pelapor.";
  bgColor = "#DEE4EB";
  textColor = "#000000";
  height = "46px";

  toggleText() {
    this.showFullText = !this.showFullText;
  }

  onCreate(): void {
    const modalRef = this.modal.open(ActionFaq);

    modalRef.componentInstance.action = "create";
    modalRef.result.then(
      (result) => {
        if (result) {
          this.api
            .insert(result)
            .pipe(takeUntil(this.dataInsertSubs$))
            .subscribe({
              next: () => {
                this.helpers.toast("success", "Data berhasil ditambahkan");
                this.getAll();
              },
              error: () => {
                this.helpers.toast("error", "Data gagal ditambahkan");
              },
            });
        }
      },
      () => {}
    );
  }

  onUpdate(data: Faq): void {
    const modalRef = this.modal.open(ActionFaq);
    modalRef.componentInstance.action = "update";
    modalRef.componentInstance.data = data;
    modalRef.result.then(
      (result) => {
        if (result) {
          this.api
            .update(data.id, result)
            .pipe(takeUntil(this.dataUpdateSubs$))
            .subscribe({
              next: () => {
                this.helpers.toast("success", "Data berhasil diubah");
                this.getAll();
              },
              error: () => {
                this.helpers.toast("error", "Data gagal diubah");
              },
            });
        }
      },
      () => {}
    );
  }

  close(alert: Alert) {
    this.alerts.splice(this.alerts.indexOf(alert), 1);
  }
}
