// Angular Core
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { FormGroup, FormGroupDirective } from '@angular/forms';
import { Subscription } from 'rxjs';

// Interfaces
import { businessTypesInterface, classificationsInfoInterface } from 'src/app/interfaces/common-interfaces';
import { SaveSupplierBusinessEmitterInterface } from 'src/app/interfaces/supplier/catalog-settings-interface';
import { SuppliersList } from 'src/app/interfaces/supplier/suppliers-list';
import { SuppliersMainSettingsInterface } from 'src/app/interfaces/supplier/suppliers-main-settings-interface';
import { DataTransmitterService } from 'src/app/services/dataTransmitter/data-transmitter.service';

@Component({
  standalone: false,
  selector: 'app-catalog-settings',
  templateUrl: './catalog-settings.component.html',
  styleUrls: ['./catalog-settings.component.scss']
})
export class CatalogSettingsComponent implements OnInit, OnDestroy {

  @Input() supplierData!:SuppliersMainSettingsInterface['data']['supplierData'];
  @Input() formGroupName!:string;
  @Input() businessTypes!:businessTypesInterface['data'] | any[];
  @Input() businessTypeSelected!:number[];
  @Input() classifications!:classificationsInfoInterface['data'];
  @Input() show_supplier_err_msg!:boolean | string;
  @Input() supplierList!:SuppliersList['data'];
  @Input() groupedSuppList!:any[];

  @Output() updateSupplierData = new EventEmitter()
  @Output() getBusinessTypesById = new EventEmitter()
  @Output() saveSupplierBusinesstype = new EventEmitter()
  @Output() clickAll = new EventEmitter<object>()

  catalogSettingsForm!: FormGroup;
  sitename!: string;
  sitenameListener!: Subscription;

  constructor(
    private rootForm:FormGroupDirective,
    private dataTransmitter: DataTransmitterService
  ) { }

  ngOnDestroy(): void {
    this.sitenameListener.unsubscribe();
  }

  ngOnInit(): void {
    this.sitenameListener = this.dataTransmitter.sitename.subscribe((sitename) => {
      this.sitename = sitename;
    });
    this.catalogSettingsForm = this.rootForm.control.get(this.formGroupName) as FormGroup;
    this.catalogSettingsFormUpdate();
  }

  get creditSettingsFormData() { return this.catalogSettingsForm.controls; }

  catalogSettingsFormUpdate() {
    setTimeout(() => {
        this.catalogSettingsForm.patchValue({
            classification_id: this.supplierData.classification_id,
            clickAll: this.supplierData.clickAll,
            business_type: this.businessTypes,
            supplier_filter_1: this.supplierData.supplier_filter_1,
            supplier_filter_2: this.supplierData.supplier_filter_2,
            delay_new_account_results: this.supplierData.delay_new_account_results,
            hide_pricing: this.supplierData.hide_pricing,
            prevent_checkout_if_status_credit_hold: this.supplierData.prevent_checkout_if_status_credit_hold,
            order_notification: this.supplierData.order_notification,
            catalog_empty_notif: this.supplierData.catalog_empty_notif,
            no_returns: this.supplierData.no_returns,
            no_order_change: this.supplierData.no_order_change,
            ach_required_for_brands: this.supplierData.ach_required_for_brands,
            bulk_order_active: this.supplierData.bulk_order_active,
            supplier_order_notice: this.supplierData.supplier_order_notice,
            block_store: this.supplierData.block_store
    })}, 2000);
  }

  
  // Trackby function for track looping items
  trackByFn(index:number, item:any){
    return item
  }

  /**
   * Function to emit updateSupplier Data for listent that emitter into the parent component
   * @param {string |number | null | boolean} supplierData
   * @param {string} settingsElementName
   */
  callUpdateSupplierDataFunc(supplierData:string | number | null | boolean, settingsElementName:string){
    // Get the list of checkboxes values for update to pass in the payload
    const checkboxValueToChange = [
      "delay_new_account_results",
      "hide_pricing",
      "prevent_checkout_if_status_credit_hold",
      "order_notification",
      "catalog_empty_notif",
      "no_returns",
      "no_order_change",
      "ach_required_for_brands",
      "bulk_order_active",
      "block_store"
    ]

    const dropdownValueToChange = [
      "supplier_filter_1",
      'supplier_filter_2'
    ]
    Object.keys(this.catalogSettingsForm.controls).forEach(controlName => {
        this.supplierData[controlName] = this.catalogSettingsForm.controls[controlName].value;
    });
    supplierData = this.catalogSettingsForm.get(settingsElementName)?.value;
    if(dropdownValueToChange.includes(settingsElementName)){
      if(supplierData == "null"){
        supplierData = null;
      } else {
        supplierData = parseInt(supplierData as string);
        this.supplierData[settingsElementName] = supplierData
      }
    };

    if(checkboxValueToChange.includes(settingsElementName)){
      supplierData = supplierData ? 0 : 1;
    }
    const updateSupplierDataToEmit = {
      supplierData : supplierData,
      settingsElementName : settingsElementName
    }
    this.updateSupplierData.emit(updateSupplierDataToEmit);
  }

  /**
   * Function to emit getBusinessTypesById Data for listent that emitter into the parent component
   */
  callgetBusinessTypesByIdFunc(){
    this.supplierData.classification_id = this.catalogSettingsForm.get('classification_id')?.value;
    if (this.supplierData.classification_id !== 'null') {
        this.getBusinessTypesById.emit({});
    }
  }

  /**
   * Function to emit saveSupplierBusinesstype Data for listent that emitter into the parent component
   * @param {string} value
   * @param {boolean} check
   */
  callsaveSupplierBusinesstypeFunc(value:number, event:any){
    const saveSupplierBusinesstypeDataToEmit: SaveSupplierBusinessEmitterInterface = {
      value : value,
      isChecked : event.target.checked
    }
    this.saveSupplierBusinesstype.emit(saveSupplierBusinesstypeDataToEmit);
  }

  /**
   * Function to emit clickAll emmiter listent that emitter into the parent component
   */
  callclickAllFunc(){
    this.clickAll.emit({});
  }

}