import { Component, OnInit } from "@angular/core";
import { MatDialogRef } from "@angular/material/dialog";
import { HttpClient } from "@angular/common/http";
import { Subject } from "rxjs";
import { deepCopy } from "../../../components/util";
import { CustomNotificationService } from "../../../components/notification/customnotification.service";
import { TranslateService } from "@ngx-translate/core";
import { Attribute } from "../../../components/edit-attribute/attribute";

@Component({
  selector: "nm-edit-visible-fields-dialog",
  templateUrl: "./edit-visible-fields-dialog.component.html",
  styleUrls: ["./edit-visible-fields-dialog.component.scss"],
})
export class EditVisibleFieldsDialog implements OnInit {
  // The default fields of the dialog
  public fields: any[];

  public attributesVisible: Attribute[];
  public fieldsVisible;
  public resetDefault;
  public selectedFields: any[] = [];
  public initalselectedFields: any[] = [];
  public enableSaveButton: boolean = false;
  public infoText: string;
  public currentLocale;
  public additionalProperties;
  public activateMultipleAddableMode: boolean = true;
  public selectFilterParams;

  private saveFavorites = new Subject<any>();
  public saveFavoritesObservable = this.saveFavorites.asObservable();

  constructor(
    public dialogRef: MatDialogRef<EditVisibleFieldsDialog>,
    private http: HttpClient,
    private _notificationService: CustomNotificationService,
    private translateService: TranslateService
  ) {}

  ngOnInit() {
    this.selectFilterParams = {
      filterAttribute: ["scope", "type"],
      placeholder: "placeholder.attributescope",
      href:
        "/api/core/configuration-types/attributescopes?locale=" +
        this.currentLocale,
      dataType: "types",
    };
    this.additionalProperties = ["parentDescription", "group", "dataLevels"];
    this.fields.forEach((field) => {
      //Convert them to the format the attributes use so we can render them in the same dialog
      if (this.fieldsVisible[field.identifier]) {
        this.selectedFields.push(field);
      }
    });
    if (this.attributesVisible) {
      this.selectedFields = this.selectedFields.concat(this.attributesVisible);
    }

    this.initalselectedFields = deepCopy(this.selectedFields);
  }

  close() {
    this.dialogRef.close();
  }

  confirm() {
    const mappedValue = this.arrayToObj(this.selectedFields);
    this.dialogRef.close(mappedValue);
  }

  public doSaveFavorites() {
    const favorites = deepCopy(this.selectedFields);
    this.resetDefault = favorites;
    this.saveFavorites.next(favorites);
    this._notificationService.success(
      this.translateService.instant("message.success.action.title"),
      this.translateService.instant("message.success.save.visible.fields.body")
    );
  }
  selectedItemsChanged() {
    this.enableSaveButton = true;
  }

  reset() {
    // this.selectedFields = [];
    if (this.resetDefault) {
      this.initalselectedFields = deepCopy(this.resetDefault);
    }

    // if(this.resetDefault) {
    //   console.debug(this.resetDefault);
    //   this.fieldsVisible = deepCopy(this.resetDefault);
    //
    //   this.fields.forEach(field => {
    //     if ( this.fieldsVisible[field.identifier]) {
    //       this.selectedFields.push(field);
    //     }
    //   })
    //
    //   this.initalselectedFields = deepCopy(this.selectedFields);
    //   this._notificationService.success(this.translateService.instant('message.success.action.title'), this.translateService.instant('message.success.reset.visible.fields.body'));
    //   return;
    // }
    // this.fieldsVisible = {};
    // this.fields.forEach(field => {
    //   if(field.scope!== 'FAKE' && field.defaultVisible === false) {
    //     this.fieldsVisible[field.identifier] = false;
    //   } else {
    //     this.selectedFields.push(field);
    //     this.fieldsVisible[field.identifier] = true;
    //   }
    //
    //   this.fields.forEach(field => {
    //     if ( this.fieldsVisible[field.identifier]) {
    //       this.selectedFields.push(field);
    //     }
    //   })

    // this.initalselectedFields = deepCopy(this.selectedFields);
    // })
  }

  arrayToObj(selectedFields) {
    const fieldsVisible = {};
    const attributes = selectedFields.filter(
      (entry) => entry.scope !== "SYSTEM"
    );

    Object.keys(this.fieldsVisible).forEach((field) => {
      const isVisible =
        selectedFields.find((entry) => entry.identifier === field) !==
        undefined;
      fieldsVisible[field] = isVisible;
    });

    return { fieldsVisible, attributes };
  }
}