import {Component, EventEmitter, Output, ViewChild} from '@angular/core';
import {MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion";
import {MatChipListbox, MatChipsModule} from '@angular/material/chips';
import {FormControl, FormsModule, ReactiveFormsModule} from "@angular/forms";
import {catchError} from "rxjs";
import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
import {GroupResponse} from "@api/v1/groupResponse";
import {FacultyResponse} from "@api/v1/facultyResponse";
import {FacultyService} from "@api/v1/faculty.service";
import {GroupService} from "@api/v1/group.service";
import {IScheduleTab} from "@component/schedule/tabs/ischedule-tab";
import {
  TabSelect,
  TabSelectType,
  TabStorageComponent
} from "@component/common/tab-storage/tab-storage.component";

@Component({
  selector: 'app-group',
  standalone: true,
  imports: [
    MatExpansionModule,
    MatChipsModule,
    ReactiveFormsModule,
    LoadingIndicatorComponent,
    FormsModule
  ],
  templateUrl: './group.component.html',
  styleUrl: './group.component.css',
  providers: [FacultyService, GroupService]
})

export class GroupComponent implements IScheduleTab {
  protected faculties: FacultyResponse[] | null = null;
  protected courseNumbers: number[] | null = null;
  private groups: GroupResponse[] | null = null;
  protected filteredGroups: GroupResponse[] | null = [];

  protected facultyId: number | null = null;
  protected courseNumber: number | null = null;

  protected formChipCourse: FormControl = new FormControl();
  protected formChipGroup: FormControl = new FormControl();

  @ViewChild('courseNumberPanel') courseNumberPanel!: MatExpansionPanel;
  @ViewChild('groupPanel') groupPanel!: MatExpansionPanel;

  @ViewChild('facultyChip') facultyChip!: MatChipListbox;
  @ViewChild('courseChip') courseChip!: MatChipListbox;
  @ViewChild('groupChip') groupChip!: MatChipListbox;

  private readonly selected: TabSelect[] | null = null;

  @ViewChild('facultyIndicator') facultyIndicator!: LoadingIndicatorComponent;
  @ViewChild('courseIndicator') courseIndicator!: LoadingIndicatorComponent;
  @ViewChild('groupIndicator') groupIndicator!: LoadingIndicatorComponent;

  @Output() eventResult = new EventEmitter<number>();

  constructor(private facultyApi: FacultyService, private groupApi: GroupService) {
    let selectedData = TabStorageComponent.selected;
    if (selectedData !== null && selectedData.selected !== null) {
      if (selectedData.type === TabSelectType.group)
        this.selected = selectedData.selected;
    }
  }

  protected loadFaculties() {
    this.facultyApi.getFaculties()
      .pipe(catchError(error => {
        this.facultyIndicator.loading = false;
        throw error;
      }))
      .subscribe(data => {
        this.faculties = data;
        if (this.selected !== null && this.selected.length >= 1) {
          let selectedFaculty = data.find(x => x.id === this.selected![0].index);

          if (selectedFaculty === undefined || selectedFaculty.name !== this.selected[0].name)
            selectedFaculty = data.find(x => x.name === this.selected![0].name);

          if (selectedFaculty !== undefined) {
            TabStorageComponent.trySelectChip(selectedFaculty.id, this.facultyChip);
            this.onFacultySelected(selectedFaculty.id);
          }
        }
      });
  }

  protected loadCourseGroup() {
    if (this.facultyId === null)
      return;

    if (this.groups === null || this.groups.length === 0 || this.groups[0].facultyId !== this.facultyId) {
      this.groupApi.getByFaculty(this.facultyId)
        .pipe(catchError(error => {
          this.groupIndicator.loading = false;
          this.courseIndicator.loading = false;
          throw error;
        }))
        .subscribe(data => {
          this.groups = data;
          this.courseNumbers = Array.from(
            new Set(
              this.groups!
                .map(x => x.courseNumber)
                .sort((a, b) => a - b))
          );

          if (this.selected !== null && this.selected.length >= 2) {
            let selectedCourse = this.courseNumbers.find(x => x === this.selected![1].index);

            if (selectedCourse !== undefined) {
              TabStorageComponent.trySelectChip(selectedCourse, this.courseChip);
              this.onCourseSelected(selectedCourse);
            }
          }

          if (this.selected !== null && this.selected.length >= 3) {
            let selectedGroup = data.find(x => x.id === this.selected![2].index);

            if (selectedGroup === undefined || selectedGroup.name !== this.selected[2].name)
              selectedGroup = data.find(x => x.name === this.selected![2].name);

            if (selectedGroup !== undefined) {
              TabStorageComponent.trySelectChip(selectedGroup.id, this.groupChip);
              this.onGroupSelected(selectedGroup.id);
            }
          }
        });

      return;
    }

    if (this.courseNumber !== null)
      this.filteredGroups = this.groups!.filter(x => x.courseNumber === this.courseNumber);
  }

  protected onFacultySelected(index: number) {
    this.courseNumber = null;
    this.groups = [];
    this.formChipGroup.reset();
    this.formChipCourse.reset();

    if (index === undefined) {
      this.facultyId = null;
      return;
    }

    TabStorageComponent.select(new TabSelect(index, this.faculties!.find(x => x.id === index)?.name ?? ''), TabSelectType.group, 0);

    this.facultyId = index;
    this.courseNumberPanel.open();

    this.loadCourseGroup();
  }

  protected onCourseSelected(course: number) {
    this.filteredGroups = [];
    this.formChipGroup.reset();

    if (course === undefined) {
      this.courseNumber = null;
      return;
    }

    TabStorageComponent.select(new TabSelect(course, course.toString()), TabSelectType.group, 1);

    this.courseNumber = course;
    this.groupPanel.open();
    this.loadCourseGroup();
  }

  protected onGroupSelected(index: number) {
    if (index === undefined)
      return;

    TabStorageComponent.select(new TabSelect(index, this.groups!.find(x => x.id == index)?.name ?? ''), TabSelectType.group, 2);

    this.groupPanel.close();
    this.eventResult.emit(index);
  }

  public load() {
    if (this.faculties === null)
      this.loadFaculties();
  }
}