diff --git a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component.html b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component.html index 9e2edf0cf..97cacf64e 100644 --- a/apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component.html +++ b/apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component.html @@ -75,20 +75,22 @@ -

{{ 'download-includes' | translate }}

-
- -
+ +

{{ 'download-includes' | translate }}

+
+ +
+

{{ 'add-edit-clone-dossier-template.form.hidden-text.heading' | translate }}

diff --git a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.html b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.html index f11b0df05..ea60f8cc7 100644 --- a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.html +++ b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.html @@ -1,18 +1,20 @@
+
@@ -37,7 +39,7 @@ -

+

diff --git a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.ts b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.ts index 419210ef6..104924c9a 100644 --- a/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.ts +++ b/apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.ts @@ -1,16 +1,15 @@ import { Component, Input, OnInit } from '@angular/core'; -import { Dossier, DossierTemplate, DownloadFileType, IDossierTemplate, IReportTemplate } from '@red/domain'; -import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; +import { Dossier, DownloadFileType, IReportTemplate } from '@red/domain'; +import { FormBuilder, FormGroup } from '@angular/forms'; import { EditDossierSaveResult, EditDossierSectionInterface } from '../edit-dossier-section.interface'; import { downloadTypesTranslations } from '@translations/download-types-translations'; import { ReportTemplateService } from '@services/report-template.service'; import { PermissionsService } from '@services/permissions.service'; -import { firstValueFrom, forkJoin, Observable } from 'rxjs'; +import { firstValueFrom, Observable } from 'rxjs'; import { DossiersService } from '@services/dossiers/dossiers.service'; import { WatermarksMapService } from '@services/entity-services/watermarks-map.service'; import { ContextComponent, shareLast } from '@iqser/common-ui'; -import { tap } from 'rxjs/operators'; -import { DossierTemplatesService } from '@services/dossier-templates/dossier-templates.service'; +import { Roles } from '@users/roles'; interface EditDossierDownloadPackageContext { existsWatermarks: boolean; @@ -25,7 +24,7 @@ export class EditDossierDownloadPackageComponent extends ContextComponent implements OnInit, EditDossierSectionInterface { - form: UntypedFormGroup; + form: FormGroup; downloadTypes: { key: DownloadFileType; label: string }[] = ['ORIGINAL', 'PREVIEW', 'DELTA_PREVIEW', 'REDACTED'].map( (type: DownloadFileType) => ({ key: type, @@ -34,14 +33,14 @@ export class EditDossierDownloadPackageComponent ); availableReportTypes: IReportTemplate[] = []; - #existsWatermarks$: Observable; - + readonly roles = Roles; @Input() dossier: Dossier; + #existsWatermarks$: Observable; constructor( private readonly _dossiersService: DossiersService, private readonly _reportTemplateController: ReportTemplateService, - private readonly _formBuilder: UntypedFormBuilder, + private readonly _formBuilder: FormBuilder, private readonly _permissionsService: PermissionsService, private readonly _watermarksMapService: WatermarksMapService, ) { @@ -109,7 +108,7 @@ export class EditDossierDownloadPackageComponent this.availableReportTypes = (await this._reportTemplateController.getAvailableReportTemplates(dossierTemplateId)) || []; - this.form = this._getForm(); + this.form = this.#getForm(); if (!this.canEditDossier) { this.form.disable(); } @@ -137,7 +136,7 @@ export class EditDossierDownloadPackageComponent }); } - private _getForm(): UntypedFormGroup { + #getForm() { return this._formBuilder.group( { reportTemplateIds: [this.dossier.reportTemplateIds], diff --git a/apps/red-ui/src/app/modules/shared/components/buttons/file-download-btn/file-download-btn.component.ts b/apps/red-ui/src/app/modules/shared/components/buttons/file-download-btn/file-download-btn.component.ts index 13db50c61..d352a64cd 100644 --- a/apps/red-ui/src/app/modules/shared/components/buttons/file-download-btn/file-download-btn.component.ts +++ b/apps/red-ui/src/app/modules/shared/components/buttons/file-download-btn/file-download-btn.component.ts @@ -2,15 +2,9 @@ import { Component, Input, OnChanges } from '@angular/core'; import { PermissionsService } from '@services/permissions.service'; import { Dossier, File, ProcessingFileStatuses } from '@red/domain'; import { FileDownloadService } from '@upload-download/services/file-download.service'; -import { CircleButtonType, CircleButtonTypes, defaultDialogConfig, TenantsService, Toaster } from '@iqser/common-ui'; +import { CircleButtonType, CircleButtonTypes, IqserDialog, TenantsService, Toaster } from '@iqser/common-ui'; import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; -import { MatDialog } from '@angular/material/dialog'; -import { - DownloadDialogComponent, - DownloadDialogData, - DownloadDialogResult, -} from '@shared/dialogs/download-dialog/download-dialog.component'; -import { firstValueFrom } from 'rxjs'; +import { DownloadDialogComponent } from '@shared/dialogs/download-dialog/download-dialog.component'; @Component({ selector: 'redaction-file-download-btn', @@ -33,7 +27,7 @@ export class FileDownloadBtnComponent implements OnChanges { private readonly _permissionsService: PermissionsService, private readonly _tenantsService: TenantsService, private readonly _fileDownloadService: FileDownloadService, - private readonly _dialog: MatDialog, + private readonly _dialog: IqserDialog, private readonly _toaster: Toaster, ) {} @@ -44,11 +38,10 @@ export class FileDownloadBtnComponent implements OnChanges { } async downloadFiles() { - const ref = this._dialog.open(DownloadDialogComponent, { - ...defaultDialogConfig, + const ref = this._dialog.open(DownloadDialogComponent, { data: { dossier: this.dossier, files: this.files }, }); - const result = await firstValueFrom(ref.afterClosed()); + const result = await ref.result(); if (!result) { return; } diff --git a/apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.ts b/apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.ts index 28e2d431b..8fcf207a8 100644 --- a/apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.ts +++ b/apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.ts @@ -1,17 +1,11 @@ import { Component, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core'; import { Action, ActionTypes, Dossier, File } from '@red/domain'; -import { CircleButtonType, defaultDialogConfig, IqserTooltipPosition, TenantsService, Toaster, trackByFactory } from '@iqser/common-ui'; +import { CircleButtonType, IqserDialog, IqserTooltipPosition, TenantsService, Toaster, trackByFactory } from '@iqser/common-ui'; import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; import { FileDownloadService } from '@upload-download/services/file-download.service'; import { PermissionsService } from '@services/permissions.service'; -import { firstValueFrom } from 'rxjs'; import { MatMenuTrigger } from '@angular/material/menu'; -import { - DownloadDialogComponent, - DownloadDialogData, - DownloadDialogResult, -} from '@shared/dialogs/download-dialog/download-dialog.component'; -import { MatDialog } from '@angular/material/dialog'; +import { DownloadDialogComponent } from '@shared/dialogs/download-dialog/download-dialog.component'; @Component({ selector: 'redaction-expandable-file-actions', @@ -37,7 +31,7 @@ export class ExpandableFileActionsComponent implements OnChanges { private readonly _tenantsService: TenantsService, private readonly _toaster: Toaster, private readonly _permissionsService: PermissionsService, - private readonly _dialog: MatDialog, + private readonly _dialog: IqserDialog, ) {} ngOnChanges(changes: SimpleChanges) { @@ -71,7 +65,7 @@ export class ExpandableFileActionsComponent implements OnChanges { // Patch download button const downloadBtn = this.actions.find(btn => btn.type === ActionTypes.downloadBtn); if (downloadBtn) { - downloadBtn.action = () => this._downloadFiles(downloadBtn.files, downloadBtn.dossier); + downloadBtn.action = () => this.#downloadFiles(downloadBtn.files, downloadBtn.dossier); downloadBtn.disabled = !this._permissionsService.canDownloadFiles(downloadBtn.files, downloadBtn.dossier); } } @@ -82,13 +76,11 @@ export class ExpandableFileActionsComponent implements OnChanges { this.matMenu.closeMenu(); } - // TODO: this doesn't look like its called - private async _downloadFiles(files: File[], dossier: Dossier) { - const ref = this._dialog.open(DownloadDialogComponent, { - ...defaultDialogConfig, + async #downloadFiles(files: File[], dossier: Dossier) { + const ref = this._dialog.open(DownloadDialogComponent, { data: { dossier, files }, }); - const result = await firstValueFrom(ref.afterClosed()); + const result = await ref.result(); if (!result) { return; } diff --git a/apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.html b/apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.html index 434eb1f7d..261705769 100644 --- a/apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.html +++ b/apps/red-ui/src/app/modules/shared/dialogs/add-dossier-dialog/add-dossier-dialog.component.html @@ -88,7 +88,9 @@ class="mr-16" formControlName="reportTemplateIds" > + +
+ +
+
+
+
-
- -
-
-
-
+
- - + + diff --git a/apps/red-ui/src/app/modules/shared/dialogs/download-dialog/download-dialog.component.ts b/apps/red-ui/src/app/modules/shared/dialogs/download-dialog/download-dialog.component.ts index d7c98e035..6459b005d 100644 --- a/apps/red-ui/src/app/modules/shared/dialogs/download-dialog/download-dialog.component.ts +++ b/apps/red-ui/src/app/modules/shared/dialogs/download-dialog/download-dialog.component.ts @@ -1,11 +1,11 @@ -import { Component, Inject } from '@angular/core'; -import { Dossier, DownloadFileType, DownloadFileTypes, IReportTemplate, File, WorkflowFileStatuses } from '@red/domain'; +import { Component } from '@angular/core'; +import { Dossier, DownloadFileType, DownloadFileTypes, File, IReportTemplate, WorkflowFileStatuses } from '@red/domain'; import { downloadTypesForDownloadTranslations } from '@translations/download-types-translations'; import { ReportTemplateService } from '@services/report-template.service'; -import { AbstractControl } from '@angular/forms'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { AbstractControl, FormBuilder } from '@angular/forms'; import { DefaultColorsService } from '@services/entity-services/default-colors.service'; -import { BaseDialogComponent, IconButtonTypes, List } from '@iqser/common-ui'; +import { IconButtonTypes, IqserDialogComponent, List } from '@iqser/common-ui'; +import { Roles } from '@users/roles'; export interface DownloadDialogData { readonly dossier: Dossier; @@ -19,24 +19,23 @@ export interface DownloadDialogResult { } @Component({ - selector: 'redaction-download-dialog', templateUrl: './download-dialog.component.html', styleUrls: ['./download-dialog.component.scss'], }) -export class DownloadDialogComponent extends BaseDialogComponent { +export class DownloadDialogComponent extends IqserDialogComponent { readonly iconButtonTypes = IconButtonTypes; - readonly downloadTypes: { key: DownloadFileType; label: string }[] = this._formDownloadTypes; - readonly availableReportTypes = this._availableReportTypes; + readonly downloadTypes: { key: DownloadFileType; label: string }[] = this.#formDownloadTypes; + readonly availableReportTypes = this.#availableReportTypes; + readonly form = this.#getForm(); + initialFormValue = this.form.getRawValue(); + readonly roles = Roles; constructor( private readonly _defaultColorsService: DefaultColorsService, private readonly _reportTemplateController: ReportTemplateService, - protected readonly _dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) readonly data: DownloadDialogData, + private readonly _formBuilder: FormBuilder, ) { - super(_dialogRef); - - this.form = this._getForm(); + super(); } get reportTypesLength() { @@ -60,13 +59,17 @@ export class DownloadDialogComponent extends BaseDialogComponent { ); } - private get _availableReportTypes() { + override get valid() { + return this.form.valid && !this.invalidDownload; + } + + get #availableReportTypes() { const dossierTemplateId = this.data.dossier.dossierTemplateId; const result = this._reportTemplateController.getAvailableReportTemplates(dossierTemplateId); return result.then(values => values ?? []); } - private get _formDownloadTypes() { + get #formDownloadTypes() { return ['ORIGINAL', 'PREVIEW', 'DELTA_PREVIEW', 'REDACTED'] .map((type: DownloadFileType) => ({ key: type, @@ -80,7 +83,7 @@ export class DownloadDialogComponent extends BaseDialogComponent { }); } - private get _selectedDownloadTypes() { + get #selectedDownloadTypes() { return this.data.dossier.downloadFileTypes.filter(type => { if (!this.data.files.some(file => file.workflowStatus === WorkflowFileStatuses.APPROVED)) { return type !== DownloadFileTypes.REDACTED; @@ -89,44 +92,48 @@ export class DownloadDialogComponent extends BaseDialogComponent { }); } + override onEnterValidator() { + return this.valid; + } + reportTemplateValueMapper = (reportTemplate: IReportTemplate) => reportTemplate.templateId; - async save() { + close() { const result: DownloadDialogResult = { reportTemplateIds: this.form.controls.reportTemplateIds.value, downloadFileTypes: this.form.controls.downloadFileTypes.value, redactionPreviewColor: this.form.controls.redactionPreviewColor.value, }; - this._dialogRef.close(result); + if (result.reportTemplateIds.length === 0) { + return this.dialogRef.close(); + } + + this.dialogRef.close(result); } - close() { - this._dialogRef.close(); - } - - private _hasReportTemplateOrDownloadType(control: AbstractControl) { + #hasReportTemplateOrDownloadType(control: AbstractControl) { const atLeastAReportSelected = control.get('reportTemplateIds')?.value.length > 0; const atLeastATypeSelected = control.get('downloadFileTypes')?.value.length > 0; return atLeastATypeSelected || atLeastAReportSelected ? null : { reportTemplateIds: true, downloadFileTypes: true }; } - private _getForm() { + #getForm() { const previewColor = this._defaultColorsService.getColor(this.data.dossier.dossierTemplateId, 'previewColor'); return this._formBuilder.group( { reportTemplateIds: [this.data.dossier.reportTemplateIds], - downloadFileTypes: [this._selectedDownloadTypes], + downloadFileTypes: [this.#selectedDownloadTypes], redactionPreviewColor: [previewColor], }, { - validators: [control => this._hasReportTemplateOrDownloadType(control), control => this._isHexColor(control)], + validators: [control => this.#hasReportTemplateOrDownloadType(control), control => this.#isHexColor(control)], }, ); } - private _isHexColor(control: AbstractControl) { + #isHexColor(control: AbstractControl) { const color = control.get('redactionPreviewColor')?.value; const isHexColor = /^#[0-9A-F]{6}$/i.test(color); return isHexColor ? null : { redactionPreviewColor: true };