import { map, filter } from "rxjs/operators";
import { Component } from "@angular/core";
import { Subject, ReplaySubject } from "rxjs";
import { WidgetframeService } from "../../widgetframe/widgetframe.service";
import { WidgetConfig } from "../../widget.configuration";
import {
  WidgetComponent,
  WidgetConfiguration,
  WidgetId,
  WidgetConfigure,
} from "../../widget.metadata";
import { ProgressbarService } from "../../../components/progressbar/progressbar.service";
import { CustomNotificationService } from "../../../components/notification/customnotification.service";
import { HalService } from "../../../components/hal/hal.service";
import { TranslateService } from "@ngx-translate/core";

declare var contextPath: string;

export interface ClickworkerConfiguration {
  /**
   * Sets the title shown in the clickworker configuration header
   */
   title: string;

  /**
   * Sets CSS class name for the embedded header component
   */
   header: string;
}

/**
 * Used in App clickworker.
 * Surrounded by widgetframe
 * Provides form for clickworker configuration app
 */
@WidgetComponent("nm-clickworker")
@Component({
  selector: "nm-clickworker",
  templateUrl: "./clickworker.component.html",
  styleUrls: ["./clickworker.component.scss"],
})
export class ClickworkerComponent {
  public title: string;
  public header: string;
  public component: string;
  public showPassword: boolean = false;

  private appSetup: any[];
  public appData: any;

  public action: any;

  @WidgetConfiguration()
  private configuration: WidgetConfig<ClickworkerConfiguration>;

  @WidgetId()
  public _id: string;

  public href: Subject<string> = new ReplaySubject<string>(1);

  constructor(
    private _progressbarService: ProgressbarService,
    private _widgetframeService: WidgetframeService,
    private _notificationService: CustomNotificationService,
    private _halService: HalService,
    private translateService: TranslateService
  ) {
    this._progressbarService.requestFinished();
  }

  @WidgetConfigure()
  protected configureWidget(configuration: WidgetConfig<ClickworkerConfiguration>) {
    this.action = {};
    this.title = this.configuration.configuration.title;
    this.header = this.configuration.configuration.header;
    this.component = configuration.component;
    let href = configuration._links["data"]["href"];

    this._progressbarService.addRequest();
    this._widgetframeService.getData(href).subscribe((data) => {
      this.appData = data;
      this._progressbarService.requestFinished();
    });

    this.action.description = this.component;
    this.action.href = href;
    this.action.title = this.component;
    this.action.type = "request";

    this._halService
      .getActionEvents()
      .pipe(
        filter((event) => event.name === this.component),
        map((event) => (<any>event).response)
      )
      .subscribe((resp) => {
        this._notificationService.fromJson(resp);
      });
  }
  ngOnInit(): void {}

  ngOnDestroy(): void {}
}