Refactoring

apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.component.ts

@@ -43,7 +43,7 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
     private formBuilder: FormBuilder
   ) {}
 
-  ngOnInit() {
+  public ngOnInit() {
     const { currencies, platforms } = this.dataService.fetchInfo();
 
     this.currencies = currencies;
@@ -60,20 +60,39 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
         this.platforms.find(({ id }) => {
           return id === this.data.account.platformId;
         }),
-        this._autocompleteObjectValidator()
+        this.autocompleteObjectValidator()
       ]
     });
+
     this.filteredPlatforms = this.accountForm
       .get('platformId')
       .valueChanges.pipe(
         startWith(''),
         map((value) => {
           const name = typeof value === 'string' ? value : value?.name;
-          return name ? this._filter(name as string) : this.platforms.slice();
+          return name ? this.filter(name as string) : this.platforms.slice();
         })
       );
   }
 
+  public autoCompleteCheck() {
+    const inputValue = this.accountForm.controls['platformId'].value;
+
+    if (typeof inputValue === 'string') {
+      const matchingEntry = this.platforms.find(({ name }) => {
+        return name === inputValue;
+      });
+
+      if (matchingEntry) {
+        this.accountForm.controls['platformId'].setValue(matchingEntry);
+      }
+    }
+  }
+
+  public displayFn(platform: Platform) {
+    return platform?.name ?? '';
+  }
+
   public onCancel() {
     this.dialogRef.close();
   }
@@ -88,6 +107,7 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
       name: this.accountForm.controls['name'].value,
       platformId: this.accountForm.controls['platformId'].value?.id ?? null
     };
+
     if (this.data.account.id) {
       (account as UpdateAccountDto).id = this.data.account.id;
     } else {
@@ -102,35 +122,21 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
     this.unsubscribeSubject.complete();
   }
 
-  public autoCompleteCheck() {
+  private autocompleteObjectValidator(): ValidatorFn {
-    const inputValue = this.accountForm.controls['platformId'].value;
+    return (control: AbstractControl) => {
-    if (typeof inputValue === 'string') {
+      if (control.value && typeof control.value === 'string') {
-      const matchingEntry = this.platforms.find(({ name }) => {
+        return { invalidAutocompleteObject: { value: control.value } };
-        return name === inputValue;
-      });
-      if (matchingEntry) {
-        this.accountForm.controls['platformId'].setValue(matchingEntry);
       }
-    }
-  }
 
-  public displayFn(platform: Platform) {
+      return null;
-    return platform?.name ?? '';
+    };
   }
 
-  private _filter(value: string): Platform[] {
+  private filter(value: string): Platform[] {
     const filterValue = value.toLowerCase();
+
     return this.platforms.filter(({ name }) => {
       return name.toLowerCase().startsWith(filterValue);
     });
   }
-
-  private _autocompleteObjectValidator(): ValidatorFn {
-    return (control: AbstractControl) => {
-      if (control.value && typeof control.value === 'string') {
-        return { invalidAutocompleteObject: { value: control.value } };
-      }
-      return null;
-    };
-  }
 }

apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html

@@ -42,14 +42,13 @@
     <div [ngClass]="{ 'd-none': platforms?.length < 1 }">
       <mat-form-field appearance="outline" class="w-100">
         <mat-label i18n>Platform</mat-label>
-
         <input
           formControlName="platformId"
           matInput
-          placeholder="Platform"
           type="text"
           [matAutocomplete]="auto"
           (blur)="autoCompleteCheck()"
+          (keydown.enter)="$event.stopPropagation()"
         />
         <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn">
           <mat-option