DM-368 pre-select first report type on documine

apps/red-ui/src/app/modules/shared/components/select/select.component.ts

@@ -1,10 +1,21 @@
-import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, HostBinding, Input, TemplateRef, ViewChild } from '@angular/core';
+import { NgForOf, NgTemplateOutlet } from '@angular/common';
+import {
+    AfterViewInit,
+    ChangeDetectorRef,
+    Component,
+    ElementRef,
+    HostBinding,
+    Input,
+    OnChanges,
+    SimpleChanges,
+    TemplateRef,
+    ViewChild,
+} from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { MatChipListbox, MatChipSelectionChange, MatChipsModule } from '@angular/material/chips';
-import { StopPropagationDirective } from '@iqser/common-ui';
-import { NgForOf, NgTemplateOutlet } from '@angular/common';
-import { TranslateModule } from '@ngx-translate/core';
 import { MatIconModule } from '@angular/material/icon';
+import { StopPropagationDirective } from '@iqser/common-ui';
+import { TranslateModule } from '@ngx-translate/core';
 
 @Component({
     selector: 'redaction-select',
@@ -20,7 +31,7 @@ import { MatIconModule } from '@angular/material/icon';
     ],
     imports: [StopPropagationDirective, NgTemplateOutlet, TranslateModule, NgForOf, MatChipsModule, MatIconModule],
 })
-export class SelectComponent implements AfterViewInit, ControlValueAccessor {
+export class SelectComponent implements AfterViewInit, ControlValueAccessor, OnChanges {
     private _value: any[] = [];
     private _onChange: (value: any[]) => void;
     @Input() optionTemplate?: TemplateRef<{ option: any }>;
@@ -48,12 +59,21 @@ export class SelectComponent implements AfterViewInit, ControlValueAccessor {
         return !!this._height;
     }
 
+    ngOnChanges(changes: SimpleChanges) {
+        if (changes.options && this.chipList) {
+            // This is completely shite, but we need to call _selectChips after the chips have been rendered
+            setTimeout(() => {
+                this._selectChips(this._value);
+            });
+        }
+    }
+
     @Input() valueMapper: (option: any) => any = option => option.key;
 
     ngAfterViewInit(): void {
         setTimeout(() => {
             this._selectChips(this._value);
-            this._changeDetector.detectChanges();
+            this._changeDetector.markForCheck();
         });
     }
 
@@ -78,12 +98,10 @@ export class SelectComponent implements AfterViewInit, ControlValueAccessor {
     registerOnTouched(): void {}
 
     writeValue(value: any[]): void {
-        if (this.chipList && value) {
-            this._selectChips(value);
-        } else if (value) {
-            this._value = value;
-        } else {
-            this._value = [];
+        this._value = value ?? [];
+
+        if (this.chipList) {
+            this._selectChips(this._value);
         }
     }
 

apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.html

@@ -51,15 +51,13 @@
                 [dossierTemplateId]="dossierTemplateId"
                 [label]="'dossier-watermark-selector.watermark' | translate"
                 formControlName="watermarkId"
-            >
-            </redaction-watermark-selector>
+            ></redaction-watermark-selector>
 
             <redaction-watermark-selector
                 [dossierTemplateId]="dossierTemplateId"
                 [label]="'dossier-watermark-selector.preview' | translate"
                 formControlName="previewWatermarkId"
-            >
-            </redaction-watermark-selector>
+            ></redaction-watermark-selector>
 
             <div class="due-date">
                 <div class="iqser-input-group">

apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.ts

@@ -1,5 +1,5 @@
 import { Component, Inject, OnInit } from '@angular/core';
-import { UntypedFormGroup, Validators } from '@angular/forms';
+import { Validators } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { BaseDialogComponent, getConfig, IconButtonTypes, IqserPermissionsService, SaveOptions } from '@iqser/common-ui';
@@ -27,16 +27,12 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
     readonly roles = Roles;
     readonly iconButtonTypes = IconButtonTypes;
     hasDueDate = false;
-    downloadTypes: { key: DownloadFileType; label: string }[] = ['ORIGINAL', 'PREVIEW', 'DELTA_PREVIEW', 'REDACTED']
-        .map((type: DownloadFileType) => ({
+    readonly downloadTypes: { key: DownloadFileType; label: string }[] = ['ORIGINAL', 'PREVIEW', 'DELTA_PREVIEW', 'REDACTED'].map(
+        (type: DownloadFileType) => ({
             key: type,
             label: downloadTypesTranslations[type],
-        }))
-        .filter(
-            element =>
-                !this.permissionsService.has(Roles.getRss) ||
-                (this.permissionsService.has(Roles.getRss) && !['DELTA_PREVIEW', 'REDACTED'].includes(element.key)),
-        );
+        }),
+    );
     dossierTemplates: IDossierTemplate[];
     availableReportTypes: IReportTemplate[] = [];
     dossierTemplateId: string;
@@ -53,8 +49,8 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
         @Inject(MAT_DIALOG_DATA) readonly data: DialogData,
     ) {
         super(_dialogRef);
-        this._getDossierTemplates();
-        this.form = this._getForm();
+        this.#getDossierTemplates();
+        this.form = this.#getForm();
         this.initialFormValue = this.form.getRawValue();
     }
 
@@ -82,7 +78,7 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
 
     async save(options?: SaveOptions) {
         this._loadingService.start();
-        const savedDossier = await firstValueFrom(this._activeDossiersService.createOrUpdate(this._formToObject()));
+        const savedDossier = await firstValueFrom(this._activeDossiersService.createOrUpdate(this.#formToObject()));
         if (savedDossier) {
             await this._router.navigate([`/${this._tenantsService.activeTenantId}${savedDossier.routerLink}`]);
             if (options?.addMembers) {
@@ -102,20 +98,7 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
         // get current selected dossierTemplate
         const dossierTemplate = this.dossierTemplates.find(r => r.dossierTemplateId === dossierTemplateId);
 
-        if (dossierTemplate) {
-            this._loadingService.start();
-            this.availableReportTypes =
-                (await this._reportTemplateController.getAvailableReportTemplates(dossierTemplate.dossierTemplateId)) || [];
-            // update dropdown values
-            this.form.patchValue(
-                {
-                    downloadFileTypes: dossierTemplate.downloadFileTypes,
-                    reportTemplateIds: [], // TODO DEFAULT
-                },
-                { emitEvent: false },
-            );
-            this._loadingService.stop();
-        } else {
+        if (!dossierTemplate) {
             this.availableReportTypes = [];
             this.form.patchValue(
                 {
@@ -124,10 +107,24 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
                 },
                 { emitEvent: false },
             );
+            return;
         }
+
+        this._loadingService.start();
+        this.availableReportTypes =
+            (await this._reportTemplateController.getAvailableReportTemplates(dossierTemplate.dossierTemplateId)) || [];
+        const reportTemplateIds = this.#config.IS_DOCUMINE ? [this.availableReportTypes.at(0).templateId] : [];
+        this.form.patchValue(
+            {
+                downloadFileTypes: dossierTemplate.downloadFileTypes,
+                reportTemplateIds: reportTemplateIds,
+            },
+            { emitEvent: false },
+        );
+        this._loadingService.stop();
     }
 
-    private _getForm(): UntypedFormGroup {
+    #getForm() {
         return this._formBuilder.group(
             {
                 dossierName: [null, Validators.required],
@@ -143,13 +140,13 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
                 validators: control => {
                     const hasReports = control.value.reportTemplateIds?.length > 0;
                     const hasDownloadTypes = control.value.downloadFileTypes?.length > 0;
-                    return this.#config.IS_DOCUMINE || hasReports || hasDownloadTypes ? null : { downloadPackage: true };
+                    return hasReports || hasDownloadTypes ? null : { downloadPackage: true };
                 },
             },
         );
     }
 
-    private _getDossierTemplates() {
+    #getDossierTemplates() {
         this.dossierTemplates = this._dossierTemplatesService.all
             .filter(r => {
                 const notYetValid = !!r.validFrom && dayjs(r.validFrom).isAfter(dayjs());
@@ -159,7 +156,7 @@ export class AddDossierDialogComponent extends BaseDialogComponent implements On
             .sort((t1, t2) => t1.name.toLowerCase().localeCompare(t2.name.toLowerCase()));
     }
 
-    private _formToObject(): IDossierRequest {
+    #formToObject(): IDossierRequest {
         return {
             dossierName: this.form.get('dossierName').value,
             description: this.form.get('description').value,