Clean up frontend

puzzle · May 27, 2024 · 1a64c90 · 1a64c90
1 parent f76856c
commit 1a64c90
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 20 deletions.
diff --git a/frontend/src/app/shared/dialog/objective-dialog/objective-form.component.html b/frontend/src/app/shared/dialog/objective-dialog/objective-form.component.html
@@ -74,15 +74,17 @@
               type="text"
               formControlName="alignment"
               class="alignment-input"
-              placeholder="{{ filteredOptions.length == 0 ? 'Kein Alignment vorhanden' : 'Bezug wählen' }}"
+              placeholder="{{
+                (this.filteredOptions | async)?.length == 0 ? 'Kein Alignment vorhanden' : 'Bezug wählen'
+              }}"
               [matAutocomplete]="auto"
               (input)="filter()"
               (focus)="filter(); input.select()"
               (focusout)="scrollLeft()"
               [value]="displayedValue"
             />
             <mat-autocomplete requireSelection #auto="matAutocomplete" [displayWith]="displayWith">
-              @for (group of filteredOptions; track group) {
+              @for (group of filteredOptions | async; track group) {
                 <mat-optgroup [label]="group.teamName" style="font-weight: bold">
                   @for (alignmentObject of group.alignmentObjectDtos; track alignmentObject) {
                     <mat-option [value]="alignmentObject">{{ alignmentObject.objectTitle }}</mat-option>

diff --git a/frontend/src/app/shared/dialog/objective-dialog/objective-form.component.ts b/frontend/src/app/shared/dialog/objective-dialog/objective-form.component.ts
@@ -26,7 +26,7 @@ import { AlignmentPossibilityObject } from '../../types/model/AlignmentPossibili
 })
 export class ObjectiveFormComponent implements OnInit {
   @ViewChild('input') input!: ElementRef<HTMLInputElement>;
-  filteredOptions: AlignmentPossibility[] = [];
+  filteredOptions: Subject<AlignmentPossibility[]> = new Subject<AlignmentPossibility[]>();
 
   objectiveForm = new FormGroup({
     title: new FormControl<string>('', [Validators.required, Validators.minLength(2), Validators.maxLength(250)]),
@@ -71,18 +71,10 @@ export class ObjectiveFormComponent implements OnInit {
     const value = this.objectiveForm.getRawValue();
     const state = this.data.objective.objectiveId == null ? submitType : this.state;
 
-    let alignmentEntity = value.alignment;
-    let alignment: string | null;
-
-    if (alignmentEntity) {
-      if (alignmentEntity.objectType == 'objective') {
-        alignment = 'O' + alignmentEntity.objectId;
-      } else {
-        alignment = 'K' + alignmentEntity.objectId;
-      }
-    } else {
-      alignment = null;
-    }
+    let alignmentEntity: AlignmentPossibilityObject | null = value.alignment;
+    let alignment: string | null = alignmentEntity
+      ? (alignmentEntity.objectType == 'objective' ? 'O' : 'K') + alignmentEntity.objectId
+      : null;
 
     let objectiveDTO: Objective = {
       id: this.data.objective.objectiveId,
@@ -278,7 +270,7 @@ export class ObjectiveFormComponent implements OnInit {
         }
       }
 
-      this.filteredOptions = value.slice();
+      this.filteredOptions.next(value.slice());
       this.alignmentPossibilities$ = of(value);
     });
   }
@@ -302,7 +294,7 @@ export class ObjectiveFormComponent implements OnInit {
 
   updateAlignments() {
     this.input.nativeElement.value = '';
-    this.filteredOptions = [];
+    this.filteredOptions.next([]);
     this.objectiveForm.patchValue({
       alignment: null,
     });
@@ -337,11 +329,13 @@ export class ObjectiveFormComponent implements OnInit {
       }));
 
       if (optionList.length == 0) {
-        this.filteredOptions = alignmentPossibilities.filter((possibility: AlignmentPossibility) =>
-          possibility.teamName.toLowerCase().includes(filterValue),
+        this.filteredOptions.next(
+          alignmentPossibilities.filter((possibility: AlignmentPossibility) =>
+            possibility.teamName.toLowerCase().includes(filterValue),
+          ),
         );
       } else {
-        this.filteredOptions = optionList;
+        this.filteredOptions.next(optionList);
       }
     });
   }