import { Component, OnInit, Inject } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { FormControl } from '@angular/forms';
import { ToastrService } from 'ngx-toastr';

@Component({
  selector: 'app-add-clients-to-subnet',
  templateUrl: './add-clients-to-subnet.component.html',
  styleUrls: ['./add-clients-to-subnet.component.css']
})
export class AddClientsToSubnetComponent implements OnInit {
  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
  units: any[] = [];
  childUnits: any[] = [];
  clients: any[] = [];
  selectedClients: string[] = [];
  loading: boolean = true;
  unitControl = new FormControl();
  childUnitControl = new FormControl();

  constructor(
    private http: HttpClient,
    public dialogRef: MatDialogRef<AddClientsToSubnetComponent>,
    private toastService: ToastrService,
    @Inject(MAT_DIALOG_DATA) public data: { subnetUuid: string, subnetName: string }
  ) {}

  ngOnInit(): void {
    this.loading = true;
    this.loadUnits();
  }

  loadUnits() {
    this.http.get<any>(`${this.baseUrl}/organizational-units?page=1&itemsPerPage=50`).subscribe(
      response => {
        this.units = response['hydra:member'].filter((unit: { type: string; }) => unit.type === 'organizational-unit');
        this.loading = false;
      },
      error => console.error('Error fetching organizational units:', error)
    );
  }

  onUnitChange(unitId: string): void {
    const unit = this.units.find(unit => unit.uuid === unitId);
    this.childUnits = unit ? this.getAllChildren(unit) : [];
    this.clients = [];
    this.childUnitControl.setValue(null);
    this.selectedClients = [];
  }

  getAllChildren(unit: any): any[] {
    let allChildren = [];
    if (unit.children && unit.children.length > 0) {
      for (const child of unit.children) {
        allChildren.push(child);
        allChildren = allChildren.concat(this.getAllChildren(child));
      }
    }
    return allChildren;
  }

  onChildUnitChange(childUnitId: string): void {
    const childUnit = this.childUnits.find(unit => unit.uuid === childUnitId);
    this.clients = childUnit && childUnit.clients ? childUnit.clients : [];
    this.selectedClients = [];
  }

  toggleClientSelection(clientId: string): void {
    const index = this.selectedClients.indexOf(clientId);
    if (index >= 0) {
      this.selectedClients.splice(index, 1);
    } else {
      this.selectedClients.push(clientId);
    }
  }

  toggleSelectAll(): void {
    if (this.areAllClientsSelected()) {
      this.selectedClients = [];
    } else {
      this.selectedClients = this.clients.map(client => client.uuid);
    }
  }

  areAllClientsSelected(): boolean {
    return this.selectedClients.length === this.clients.length;
  }

  save() {
    this.selectedClients.forEach(clientId => {
      const postData = { client: `/clients/${clientId}` };

      this.http.post(`${this.baseUrl}/og-dhcp/server/${this.data.subnetUuid}/post-host`, postData).subscribe(
        response => {
          this.toastService.success(`Cliente asignado correctamente`);
        },
        error => {
          console.error(`Error al asignar el cliente:`, error);
          this.toastService.error(`Error al asignar el cliente: ${error.error['hydra:description']}`);
        }
      );
    });

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

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