refactor: folders and components

src/components/schedule/tabs/group/group.component.ts

@@ -0,0 +1,95 @@
+import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core';
+import {MatExpansionModule, MatExpansionPanel} from "@angular/material/expansion";
+import {MatChipListboxChange, MatChipsModule} from '@angular/material/chips';
+import {FormControl, ReactiveFormsModule} from "@angular/forms";
+import {AsyncPipe} from "@angular/common";
+import {map, Observable, of} from "rxjs";
+import {FacultyResponse} from "@model/facultyResponse";
+import {GroupResponse} from "@model/groupResponse";
+import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
+
+@Component({
+  selector: 'app-group',
+  standalone: true,
+  imports: [
+    MatExpansionModule,
+    MatChipsModule,
+    ReactiveFormsModule,
+    LoadingIndicatorComponent,
+    AsyncPipe
+  ],
+  templateUrl: './group.component.html',
+  styleUrl: './group.component.css'
+})
+
+export class GroupComponent {
+  protected facultyId: number | null = null;
+  protected courseNumber: number | null = null;
+
+  protected filteredGroups: Observable<GroupResponse[]> = of([]);
+  protected courseNumbers: Observable<number[]> = of([]);
+  protected groups: Observable<GroupResponse[]> = of([]);
+
+  protected chipCourse: FormControl = new FormControl();
+  protected chipGroup: FormControl = new FormControl();
+
+  @ViewChild('courseNumberPanel') courseNumberPanel!: MatExpansionPanel;
+  @ViewChild('groupPanel') groupPanel!: MatExpansionPanel;
+
+  @Input() faculties: Observable<FacultyResponse[]> = of([]);
+  @Input() facultiesLoaded: boolean | null = false;
+  @Output() facultiesLoadRetry: EventEmitter<void> = new EventEmitter<void>();
+  @Input() groupsLoaded: boolean | null = false;
+  @Output() groupsLoadRetry: EventEmitter<number> = new EventEmitter<number>();
+
+  @Input() set setGroups(data: Observable<GroupResponse[]>) {
+    this.groups = data;
+    this.courseNumbers = this.groups.pipe(
+      map(data => data.map(g => g.courseNumber)),
+      map(courseNumbersArray => courseNumbersArray.filter((value, index, self) => self.indexOf(value) === index)),
+      map(uniqueCourseNumbers => uniqueCourseNumbers.sort((a, b) => a - b))
+    );
+  }
+
+  @Output() groupSelected = new EventEmitter<number>();
+  @Output() facultySelected = new EventEmitter<number>();
+
+  protected chooseFaculty(event: MatChipListboxChange) {
+    this.courseNumber = null;
+    this.groups = of([]);
+    this.chipGroup.reset();
+    this.chipCourse.reset();
+
+    if (event.value === undefined || event.value === null) {
+      this.facultyId = null;
+      return;
+    }
+    this.facultyId = event.value;
+    this.courseNumberPanel.open();
+
+    this.facultySelected.emit(this.facultyId!);
+  }
+
+  protected chooseCourseNumber(event: MatChipListboxChange) {
+    this.filteredGroups = of([]);
+    this.chipGroup.reset();
+
+    if (event.value === undefined || event.value === null) {
+      this.courseNumber = null;
+      return;
+    }
+
+    this.courseNumber = event.value;
+    this.groupPanel.open();
+    this.groups.subscribe(data =>
+      this.filteredGroups = of(data.filter(g => g.courseNumber === this.courseNumber)));
+  }
+
+  protected chooseGroup(event: MatChipListboxChange) {
+    if (event.value === undefined || event.value === null)
+      return;
+
+    this.groupPanel.close();
+    this.groupSelected.emit(event.value);
+  }
+}