From 7e020f9a1ca58273317a48f8bd644b48a3c9cf6d Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Sat, 28 Sep 2024 09:16:43 +0200 Subject: [PATCH] Refactoring --- .../create-asset-profile-dialog.component.ts | 81 +++++++++---------- .../create-asset-profile-dialog.html | 8 +- .../interfaces/interfaces.ts | 2 + .../faq/self-hosting/self-hosting-page.html | 4 +- 4 files changed, 45 insertions(+), 50 deletions(-) diff --git a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.component.ts b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.component.ts index 334f35344..7cc34fe89 100644 --- a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.component.ts +++ b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.component.ts @@ -21,6 +21,8 @@ import { MatDialogRef } from '@angular/material/dialog'; import { uniq } from 'lodash'; import { Subject, takeUntil } from 'rxjs'; +import { CreateAssetProfileDialogMode } from './interfaces/interfaces'; + @Component({ changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'h-100' }, @@ -30,7 +32,7 @@ import { Subject, takeUntil } from 'rxjs'; }) export class CreateAssetProfileDialog implements OnInit, OnDestroy { public createAssetProfileForm: FormGroup; - public mode: 'auto' | 'currency' | 'manual'; + public mode: CreateAssetProfileDialogMode; public customCurrencies: string[]; private unsubscribeSubject = new Subject(); @@ -43,29 +45,15 @@ export class CreateAssetProfileDialog implements OnInit, OnDestroy { public readonly formBuilder: FormBuilder ) {} - public get showCurrencyErrorMessage() { - const addCurrencyFormControl = - this.createAssetProfileForm.get('addCurrency'); - - if ( - addCurrencyFormControl.hasError('minlength') || - addCurrencyFormControl.hasError('maxlength') - ) { - return true; - } - - return false; - } - public ngOnInit() { - this.fetchAdminData(); + this.initializeCustomCurrencies(); this.createAssetProfileForm = this.formBuilder.group( { addCurrency: new FormControl(null, [ - Validators.required, + Validators.maxLength(3), Validators.minLength(3), - Validators.maxLength(3) + Validators.required ]), addSymbol: new FormControl(null, [Validators.required]), searchSymbol: new FormControl(null, [Validators.required]) @@ -82,7 +70,7 @@ export class CreateAssetProfileDialog implements OnInit, OnDestroy { this.dialogRef.close(); } - public onRadioChange(mode: 'auto' | 'currency' | 'manual') { + public onRadioChange(mode: CreateAssetProfileDialogMode) { this.mode = mode; } @@ -93,22 +81,43 @@ export class CreateAssetProfileDialog implements OnInit, OnDestroy { this.createAssetProfileForm.get('searchSymbol').value.dataSource, symbol: this.createAssetProfileForm.get('searchSymbol').value.symbol }); + } else if (this.mode === 'currency') { + const currency = this.createAssetProfileForm + .get('addCurrency') + .value.toUpperCase(); + + const currencies = uniq([...this.customCurrencies, currency]); + + this.dataService + .putAdminSetting(PROPERTY_CURRENCIES, { + value: JSON.stringify(currencies) + }) + .pipe(takeUntil(this.unsubscribeSubject)) + .subscribe(() => { + this.dialogRef.close(); + + window.location.reload(); + }); } else if (this.mode === 'manual') { this.dialogRef.close({ dataSource: 'MANUAL', symbol: this.createAssetProfileForm.get('addSymbol').value }); - } else if (this.mode === 'currency') { - const currency = this.createAssetProfileForm - .get('addCurrency') - .value.toUpperCase(); + } + } - if (currency.length === 3) { - const currencies = uniq([...this.customCurrencies, currency]); - this.putAdminSetting({ key: PROPERTY_CURRENCIES, value: currencies }); - this.dialogRef.close(); - } + public get showCurrencyErrorMessage() { + const addCurrencyFormControl = + this.createAssetProfileForm.get('addCurrency'); + + if ( + addCurrencyFormControl.hasError('maxlength') || + addCurrencyFormControl.hasError('minlength') + ) { + return true; } + + return false; } public ngOnDestroy() { @@ -143,26 +152,14 @@ export class CreateAssetProfileDialog implements OnInit, OnDestroy { return { atLeastOneValid: true }; } - private fetchAdminData() { + private initializeCustomCurrencies() { this.adminService .fetchAdminData() .pipe(takeUntil(this.unsubscribeSubject)) .subscribe(({ settings }) => { this.customCurrencies = settings[PROPERTY_CURRENCIES] as string[]; - this.changeDetectorRef.markForCheck(); - }); - } - private putAdminSetting({ key, value }: { key: string; value: any }) { - this.dataService - .putAdminSetting(key, { - value: value || value === false ? JSON.stringify(value) : undefined - }) - .pipe(takeUntil(this.unsubscribeSubject)) - .subscribe(() => { - setTimeout(() => { - window.location.reload(); - }, 300); + this.changeDetectorRef.markForCheck(); }); } } diff --git a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.html b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.html index aaacd76e6..c60ca83b8 100644 --- a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.html +++ b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/create-asset-profile-dialog.html @@ -45,14 +45,8 @@ Currency - @if (createAssetProfileForm.get('addCurrency').hasError('required')) { - Currency is required. - } @if (showCurrencyErrorMessage) { - - {{ createAssetProfileForm.controls['addCurrency'].value }} is an - invalid currency! Should be of 3 characters only. - + Oops! Invalid currency. } diff --git a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/interfaces/interfaces.ts b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/interfaces/interfaces.ts index 16be906c9..4cf24b554 100644 --- a/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/interfaces/interfaces.ts +++ b/apps/client/src/app/components/admin-market-data/create-asset-profile-dialog/interfaces/interfaces.ts @@ -2,3 +2,5 @@ export interface CreateAssetProfileDialogParams { deviceType: string; locale: string; } + +export type CreateAssetProfileDialogMode = 'auto' | 'currency' | 'manual'; diff --git a/apps/client/src/app/pages/faq/self-hosting/self-hosting-page.html b/apps/client/src/app/pages/faq/self-hosting/self-hosting-page.html index 10cc23cb2..4eabd6bbf 100644 --- a/apps/client/src/app/pages/faq/self-hosting/self-hosting-page.html +++ b/apps/client/src/app/pages/faq/self-hosting/self-hosting-page.html @@ -52,7 +52,9 @@

  1. Go to the Admin Control panel
    2. -
  2. Click on the Add Currency button
    3. +
  3. Go to the Market Data section
    4. +
  4. Click on the + button
    5. +
  5. Switch to Add Currency
  6. Insert e.g. EUR in the prompt