import {
  timer as observableTimer,
  combineLatest as observableCombineLatest,
  Observable,
  Subscription,
} from "rxjs";

import { map, filter, mergeMap } from "rxjs/operators";
import { Component, OnDestroy } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { WidgetConfig } from "../../widget.configuration";
import {
  WidgetComponent,
  WidgetId,
  WidgetConfiguration,
  WidgetConfigure,
  WidgetInput,
  WidgetOutput,
} from "../../widget.metadata";
import { WidgetframeService } from "../../widgetframe/widgetframe.service";
import { CurrentLocaleService } from "../../../components/i18n/currentLocale.service";
import { Link } from "../../../components/hal/hal";
import { WidgetframeComponentConfiguration } from "../../widgetframe/widgetframe.component";

declare var contextPath: string;

export interface InfoProductStatusConfiguration
  extends WidgetframeComponentConfiguration {
  /**
   * Sets CSS class name for the widget header
   */
  header: string;
}


@WidgetComponent("nm-info-productstatus")
@Component({
  selector: "nm-info-productstatus",
  templateUrl: "./info-productstatus.component.html",
  styleUrls: ["./info-productstatus.component.scss"],
  providers: [WidgetframeService],
})
export class InfoProductStatusComponentWidget implements OnDestroy {
  data: any[];
  view: any[] = [580, 200];

  colorScheme = {
    domain: ["#abc378", "#CDDBAE", "#FFC699", "#ff9900", "#CC0033"],
  };

  @WidgetConfiguration()
  public configuration: WidgetConfig<InfoProductStatusConfiguration>;

  @WidgetId()
  public _id;

  private subscription: Subscription;

  public gradient: any;

  constructor(
    private http: HttpClient,
    private currentLocaleService: CurrentLocaleService
  ) {
    this.data = [];
  }

  @WidgetConfigure()
  protected configureWidget(configuration: WidgetConfig<InfoProductStatusConfiguration>) {
    let href = (<Link>configuration._links["data"]).href;
    this.subscription = observableCombineLatest(
      observableTimer(0, 5 * 60 * 1000),
      this.currentLocaleService.getCurrentLocale(),
      (interval, locale) => interval
    )
      .pipe(
        mergeMap((interval) => this.http.get(href)),
        filter((res) => res["data"] && res["data"].length > 0),
        map((res) => res["data"][0])
      )
      .subscribe((data) => (this.data = data));
  }

  ngOnDestroy() {
    if (this.subscription) {
      this.subscription.unsubscribe();
    }
  }
}