From 7b4d5681656739a8328f5611e9c9cf7a2ffd14a2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Thu, 10 Mar 2022 13:47:34 +0200
Subject: [PATCH] RED-3457: Set dossier status to null

---
 .../edit-dossier-general-info.component.html  |  6 +--
 .../edit-dossier-general-info.component.ts    | 45 ++++++++++++-------
 .../dossier-status.component.ts               |  6 +--
 3 files changed, 35 insertions(+), 22 deletions(-)

diff --git a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.html b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.html
index 8c31958d7..d774a15de 100644
--- a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.html
+++ b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.html
@@ -44,10 +44,10 @@
             <div class="iqser-input-group w-300">
                 <label translate="edit-dossier-dialog.general-info.form.dossier-status.label"></label>
                 <mat-select [placeholder]="statusPlaceholder" formControlName="dossierStatusId">
-                    <mat-option *ngFor="let state of states" [value]="state.dossierStatusId">
+                    <mat-option *ngFor="let stateId of states" [value]="stateId">
                         <div class="flex-align-items-center">
-                            <redaction-small-chip [color]="state.color"></redaction-small-chip>
-                            <div>{{ state.name }}</div>
+                            <redaction-small-chip *ngIf="!!stateId" [color]="getStateColor(stateId)"></redaction-small-chip>
+                            <div>{{ getStateName(stateId) }}</div>
                         </div>
                     </mat-option>
                 </mat-select>
diff --git a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
index ba9596b61..86ea692bc 100644
--- a/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
+++ b/apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import * as moment from 'moment';
 import { Dossier, DossierState, IDossierRequest, IDossierTemplate } from '@red/domain';
@@ -24,6 +24,7 @@ import { ArchivedDossiersService } from '@services/dossiers/archived-dossiers.se
     selector: 'redaction-edit-dossier-general-info',
     templateUrl: './edit-dossier-general-info.component.html',
     styleUrls: ['./edit-dossier-general-info.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSectionInterface {
     readonly iconButtonTypes = IconButtonTypes;
@@ -31,9 +32,10 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
     @Input() dossier: Dossier;
 
     form: FormGroup;
+    statusPlaceholder: string;
     hasDueDate: boolean;
     dossierTemplates: IDossierTemplate[];
-    states: DossierState[];
+    states: string[];
     currentStatus: DossierState;
 
     constructor(
@@ -78,25 +80,19 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
         return this.hasDueDate && this.form.get('dueDate').value === null;
     }
 
-    get statusPlaceholder(): string {
-        if (this.states.length === 0) {
-            return this._translateService.instant('edit-dossier-dialog.general-info.form.dossier-status.no-status-placeholder');
-        }
-
-        return (
-            this.currentStatus?.name ?? this._translateService.instant('edit-dossier-dialog.general-info.form.dossier-status.placeholder')
-        );
-    }
-
     ngOnInit() {
-        this.states = this._dossierStateService.all.filter(s => s.dossierTemplateId === this.dossier.dossierTemplateId);
+        this.states = [
+            null,
+            ...this._dossierStateService.all.filter(s => s.dossierTemplateId === this.dossier.dossierTemplateId).map(s => s.id),
+        ];
+        this.statusPlaceholder = this.#statusPlaceholder;
         this.#filterInvalidDossierTemplates();
         this.form = this.#getForm();
         if (!this.permissionsService.canEditDossier(this.dossier)) {
             this.form.disable();
         }
         if (this.dossier.dossierStatusId) {
-            this.currentStatus = this._dossierStateService.all.find(s => s.dossierStatusId === this.dossier.dossierStatusId);
+            this.currentStatus = this._dossierStateService.find(this.dossier.dossierStatusId);
         }
         this.hasDueDate = !!this.dossier.dueDate;
     }
@@ -183,12 +179,31 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
                 },
                 Validators.required,
             ],
-            dossierStatusId: [{ value: this.dossier.dossierStatusId, disabled: !this.states.length || !this.dossier.isActive }],
+            dossierStatusId: [{ value: this.dossier.dossierStatusId, disabled: this.states.length === 1 || !this.dossier.isActive }],
             description: [formFieldWithArchivedCheck(this.dossier.description)],
             dueDate: [formFieldWithArchivedCheck(this.dossier.dueDate)],
         });
     }
 
+    get #statusPlaceholder(): string {
+        return this._translateService.instant(
+            this.states.length === 1
+                ? 'edit-dossier-dialog.general-info.form.dossier-status.no-status-placeholder'
+                : 'edit-dossier-dialog.general-info.form.dossier-status.placeholder',
+        );
+    }
+
+    getStateName(stateId: string): string {
+        return (
+            this._dossierStateService.find(stateId)?.name ||
+            this._translateService.instant('edit-dossier-dialog.general-info.form.dossier-status.placeholder')
+        );
+    }
+
+    getStateColor(stateId: string): string {
+        return this._dossierStateService.find(stateId).color;
+    }
+
     #filterInvalidDossierTemplates() {
         this.dossierTemplates = this._dossierTemplatesService.all.filter(r => {
             if (this.dossier?.dossierTemplateId === r.dossierTemplateId) {
diff --git a/apps/red-ui/src/app/modules/shared/components/dossier-status/dossier-status.component.ts b/apps/red-ui/src/app/modules/shared/components/dossier-status/dossier-status.component.ts
index 7ad21eca7..357b098d3 100644
--- a/apps/red-ui/src/app/modules/shared/components/dossier-status/dossier-status.component.ts
+++ b/apps/red-ui/src/app/modules/shared/components/dossier-status/dossier-status.component.ts
@@ -3,7 +3,7 @@ import { Dossier, DossierState } from '@red/domain';
 import { DossierStateService } from '@services/entity-services/dossier-state.service';
 
 @Component({
-    selector: 'redaction-dossier-status',
+    selector: 'redaction-dossier-status [dossier]',
     templateUrl: './dossier-status.component.html',
     styleUrls: ['./dossier-status.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -23,8 +23,6 @@ export class DossierStatusComponent implements OnInit, OnChanges {
     }
 
     #setState(): void {
-        if (this.dossier.dossierStatusId) {
-            this.currentState = this._dossierStateService.all.find(s => s.dossierStatusId === this.dossier.dossierStatusId);
-        }
+        this.currentState = this._dossierStateService.find(this.dossier.dossierStatusId);
     }
 }