From f0655902a5d22e46655300bc7ab0cee1ffd30b52 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina.teudan.ext@knecon.com>
Date: Fri, 20 Oct 2023 15:34:05 +0300
Subject: [PATCH] RED-7774: Dict label getter into observable

---
 .../redact-text-dialog.component.html         |  2 +-
 .../redact-text-dialog.component.ts           | 24 ++++++-------------
 2 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html
index 058807a8f..a3aa2f3c5 100644
--- a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html
+++ b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.html
@@ -86,7 +86,7 @@
 
                 <mat-form-field>
                     <mat-select [placeholder]="'redact-text.dialog.content.type-placeholder' | translate" formControlName="dictionary">
-                        <mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
+                        <mat-select-trigger>{{ displayedDictionaryLabel$ | async }}</mat-select-trigger>
                         <mat-option
                             (click)="typeChanged()"
                             *ngFor="let dictionary of dictionaries"
diff --git a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts
index b648b09a5..7fa4b46f3 100644
--- a/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts
+++ b/apps/red-ui/src/app/modules/file-preview/dialogs/redact-text-dialog/redact-text-dialog.component.ts
@@ -8,8 +8,8 @@ import { DictionaryService } from '@services/entity-services/dictionary.service'
 import { JustificationsService } from '@services/entity-services/justifications.service';
 import { Roles } from '@users/roles';
 import { calcTextWidthInPixels } from '@utils/functions';
-import { firstValueFrom } from 'rxjs';
-import { tap } from 'rxjs/operators';
+import { firstValueFrom, Observable } from 'rxjs';
+import { map, tap } from 'rxjs/operators';
 import { getRedactOrHintOptions, RedactOrHintOption, RedactOrHintOptions } from '../../utils/dialog-options';
 import { RedactTextData, RedactTextResult } from '../../utils/dialog-types';
 import { LegalBasisOption } from '../manual-redaction-dialog/manual-annotation-dialog.component';
@@ -35,25 +35,11 @@ export class RedactTextDialogComponent
     modifiedText = this.initialText;
     selectedTextRows = 1;
     readonly options: DetailsRadioOption<RedactOrHintOption>[];
+    readonly displayedDictionaryLabel$: Observable<string>;
     readonly #dossier = inject(ActiveDossiersService).find(this.data.dossierId);
     readonly #manualRedactionTypeExists = inject(DictionaryService).hasManualType(this.#dossier.dossierTemplateId);
     #applyToAllDossiers = this.data.applyToAllDossiers ?? true;
 
-    get displayedDictionaryLabel() {
-        const dictType = this.form.controls.dictionary.value;
-        if (dictType) {
-            return this.dictionaries.find(d => d.type === dictType)?.label ?? null;
-        }
-        return null;
-    }
-
-    get disabled() {
-        if (this.dictionaryRequest) {
-            return !this.form.controls.dictionary.value;
-        }
-        return !this.form.controls.dictionary.value;
-    }
-
     constructor(
         private readonly _justificationsService: JustificationsService,
         private readonly _dictionaryService: DictionaryService,
@@ -82,6 +68,10 @@ export class RedactTextDialogComponent
                 takeUntilDestroyed(),
             )
             .subscribe();
+
+        this.displayedDictionaryLabel$ = this.form.controls.dictionary.valueChanges.pipe(
+            map(dictionary => this.dictionaries.find(d => d.type === dictionary)?.label ?? null),
+        );
     }
 
     async ngOnInit(): Promise<void> {