feat: add saving of user's selection

src/components/schedule/tabs/professor/professor.component.html

@@ -1,11 +1,12 @@
 <div class="search-content">
-  @if (professors.length === 0) {
-    <app-loading-indicator [loading]="professorsLoaded !== null" (retryFunction)="loadProfessors()"/>
+  @if (professors === null) {
+    <app-loading-indicator [loading]="true" (retryFunction)="loadProfessors()"
+                           #professorIndicator/>
   } @else {
     <mat-form-field color="accent" style="width: 100%;">
       <input type="text" placeholder="Поиск..." matInput [formControl]="professorControl" [matAutocomplete]="auto">
 
-      <mat-autocomplete #auto="matAutocomplete" (optionSelected)="onOptionSelected($event)"
+      <mat-autocomplete #auto="matAutocomplete" (optionSelected)="onOptionSelected($event.option.value)"
                         [autoActiveFirstOption]="false" [hideSingleSelectionIndicator]="true">
         @for (option of filteredProfessors | async; track option) {
           <mat-option [value]="option.id">

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

@@ -1,12 +1,14 @@
-import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
+import {Component, EventEmitter, OnInit, Output, ViewChild} from "@angular/core";
 import {MatFormField, MatInput} from "@angular/material/input";
 import {FormControl, ReactiveFormsModule} from "@angular/forms";
-import {MatAutocompleteModule, MatAutocompleteSelectedEvent} from "@angular/material/autocomplete";
+import {MatAutocompleteModule} from "@angular/material/autocomplete";
 import {AsyncPipe} from "@angular/common";
 import {catchError, map, Observable, startWith} from "rxjs";
 import {LoadingIndicatorComponent} from "@component/common/loading-indicator/loading-indicator.component";
 import {ProfessorResponse} from "@api/v1/professorResponse";
 import {ProfessorService} from "@api/v1/professor.service";
+import {IScheduleTab} from "@component/schedule/tabs/ischedule-tab";
+import {TabSelect, TabSelectType, TabStorageComponent} from "@component/common/tab-storage/tab-storage.component";
 
 @Component({
   selector: 'app-professor',
@@ -23,31 +25,44 @@ import {ProfessorService} from "@api/v1/professor.service";
   styleUrl: './professor.component.css',
   providers: [ProfessorService]
 })
-export class ProfessorComponent implements OnInit {
+export class ProfessorComponent implements OnInit, IScheduleTab {
   protected professorControl = new FormControl();
   protected filteredProfessors!: Observable<ProfessorResponse[]>;
 
-  protected professors: ProfessorResponse[] = [];
-  protected professorsLoaded: boolean | null = false;
+  protected professors: ProfessorResponse[] | null = null;
+  private readonly selected: TabSelect[] | null = null;
+
+  @ViewChild('professorIndicator') professorIndicator!: LoadingIndicatorComponent;
 
   @Output() eventResult = new EventEmitter<number>();
 
   constructor(private api: ProfessorService) {
-    this.loadProfessors();
+    let selectedData = TabStorageComponent.selected;
+    if (selectedData !== null && selectedData.selected !== null) {
+      if (selectedData.type === TabSelectType.professor)
+        this.selected = selectedData.selected;
+    }
   }
 
   protected loadProfessors() {
-    if (this.professors.length === 0) {
-      this.professorsLoaded = false;
-
+    if (this.professors === null || this.professors.length === 0) {
       this.api.getProfessors()
         .pipe(catchError(error => {
-          this.professorsLoaded = null;
+          this.professorIndicator.loading = false;
           throw error;
         }))
         .subscribe(data => {
           this.professors = data;
-          this.professorsLoaded = true;
+
+          if (this.selected !== null && this.selected.length >= 1) {
+            let selectedProfessor = data.find(x => x.id === this.selected![0].index);
+
+            if (selectedProfessor === undefined || selectedProfessor.name !== this.selected[0].name)
+              selectedProfessor = data.find(x => x.name === this.selected![0].name);
+
+            if (selectedProfessor !== undefined)
+              this.onOptionSelected(selectedProfessor.id);
+          }
         });
     }
   }
@@ -61,20 +76,32 @@ export class ProfessorComponent implements OnInit {
 
   private _filterProfessors(value: string | number): ProfessorResponse[] {
     if (typeof value === 'string') {
-      if (value === '') return [];
+      if (value === '')
+        return [];
+
       const filterValue = value.toLowerCase();
-      return this.professors.filter(teacher => teacher.name.toLowerCase().includes(filterValue));
+      return this.professors?.filter(teacher => teacher.name.toLowerCase().includes(filterValue)) ?? [];
     } else {
-      const selectedTeacher = this.professors.find(teacher => teacher.id === value);
+      const selectedTeacher = this.professors?.find(teacher => teacher.id === value);
       return selectedTeacher ? [selectedTeacher] : [];
     }
   }
 
-  protected onOptionSelected(event: MatAutocompleteSelectedEvent) {
-    const selectedOption = this.professors.find(teacher => teacher.id === event.option.value);
+  protected onOptionSelected(index: number) {
+    if (index === undefined)
+      return;
+
+    const selectedOption = this.professors?.find(teacher => teacher.id === index);
     if (selectedOption) {
       this.professorControl.setValue(selectedOption.name);
       this.eventResult.emit(selectedOption.id);
+
+      TabStorageComponent.select(new TabSelect(selectedOption.id, selectedOption.name), TabSelectType.professor, 0);
     }
   }
+
+  public load() {
+    if (this.professors === null)
+      this.loadProfessors();
+  }
 }