Merge master

apps/red-ui/src/app/modules/account/base-account-screen/base-account-screen-component.ts

@@ -1,7 +1,7 @@
 import { ChangeDetectionStrategy, Component, OnInit, ViewContainerRef } from '@angular/core';
 import { Router, RouterOutlet } from '@angular/router';
 import { accountTranslations } from '@translations/account-translations';
-import { NgClass, NgIf } from '@angular/common';
+import { NgClass } from '@angular/common';
 import { AccountSideNavComponent } from '../account-side-nav/account-side-nav.component';
 import { TranslateModule } from '@ngx-translate/core';
 
@@ -10,7 +10,7 @@ import { TranslateModule } from '@ngx-translate/core';
     templateUrl: './base-account-screen-component.html',
     styleUrls: ['./base-account-screen-component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
-    imports: [NgClass, NgIf, RouterOutlet, AccountSideNavComponent, TranslateModule],
+    imports: [NgClass, RouterOutlet, AccountSideNavComponent, TranslateModule],
 })
 export class BaseAccountScreenComponent implements OnInit {
     readonly translations = accountTranslations;

apps/red-ui/src/app/modules/account/screens/user-profile/user-profile-screen/user-profile-screen.component.ts

@@ -17,7 +17,6 @@ import { UserPreferenceService } from '@users/user-preference.service';
 import { UserService } from '@users/user.service';
 import { firstValueFrom } from 'rxjs';
 import { UserProfileDialogService } from '../services/user-profile-dialog.service';
-import { NgForOf, NgIf } from '@angular/common';
 import { MatFormField } from '@angular/material/form-field';
 import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
 import { MatSlideToggle } from '@angular/material/slide-toggle';
@@ -39,11 +38,9 @@ interface UserProfileForm {
     changeDetection: ChangeDetectionStrategy.OnPush,
     imports: [
         ReactiveFormsModule,
-        NgIf,
         MatFormField,
         MatSelect,
         MatOption,
-        NgForOf,
         TranslateModule,
         MatSlideToggle,
         IconButtonComponent,

apps/red-ui/src/app/modules/admin/screens/component-definitions/component-definitions.component.ts

@@ -1,12 +1,18 @@
 import { Component, OnInit, signal } from '@angular/core';
-import { BaseFormComponent, CircleButtonComponent, IconButtonComponent, listingProvidersFactory, LoadingService } from '@iqser/common-ui';
+import {
+    BaseFormComponent,
+    CircleButtonComponent,
+    HasScrollbarDirective,
+    IconButtonComponent,
+    listingProvidersFactory,
+    LoadingService,
+} from '@iqser/common-ui';
 import { ComponentDefinitionsService } from '@services/entity-services/component-definitions.service';
 import { firstValueFrom } from 'rxjs';
 import { getParam } from '@common-ui/utils';
 import { DOSSIER_TEMPLATE_ID, IComponentDefinition } from '@red/domain';
 import { toObservable } from '@angular/core/rxjs-interop';
-import { InputWithActionComponent } from '@common-ui/inputs/input-with-action/input-with-action.component';
-import { CommonModule, NgIf } from '@angular/common';
+import { CommonModule } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
 import { PermissionsService } from '@services/permissions.service';
 import { MatIcon } from '@angular/material/icon';
@@ -20,8 +26,6 @@ import { AdminDialogService } from '../../services/admin-dialog.service';
     providers: listingProvidersFactory(ComponentDefinitionsComponent),
     imports: [
         IconButtonComponent,
-        InputWithActionComponent,
-        NgIf,
         TranslateModule,
         CommonModule,
         MatIcon,
@@ -31,6 +35,7 @@ import { AdminDialogService } from '../../services/admin-dialog.service';
         FormsModule,
         ReactiveFormsModule,
         CircleButtonComponent,
+        HasScrollbarDirective,
     ],
 })
 export default class ComponentDefinitionsComponent extends BaseFormComponent implements OnInit {
@@ -102,6 +107,7 @@ export default class ComponentDefinitionsComponent extends BaseFormComponent imp
         this._dialogService.openDialog('confirm', null, async () => {
             await firstValueFrom(this._componentDefinitionsService.deleteComponentDefinitions(this.#dossierTemplateId, [componentId]));
             await this.#loadData();
+            this.selectedComponent = null;
         });
     }
 

apps/red-ui/src/app/modules/admin/screens/component-mappings/add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component.ts

@@ -7,7 +7,7 @@ import { NgForOf, NgIf } from '@angular/common';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatOption } from '@angular/material/autocomplete';
-import { MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatSelect } from '@angular/material/select';
 import { fileAttributeEncodingTypesTranslations } from '@translations/file-attribute-encoding-types-translations';
 import { firstValueFrom } from 'rxjs';
 import { ComponentMappingsService } from '@services/entity-services/component-mappings.service';
@@ -40,7 +40,6 @@ interface DialogResult {
         CircleButtonComponent,
         MatDialogModule,
         MatOption,
-        MatSelectTrigger,
         MatSelect,
         IconButtonComponent,
         UploadFileComponent,

apps/red-ui/src/app/modules/admin/screens/component-mappings/component-mappings-screen.component.ts

@@ -1,6 +1,5 @@
 import { AsyncPipe, NgIf } from '@angular/common';
 import { Component, OnInit } from '@angular/core';
-import { RouterLink } from '@angular/router';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import { InputWithActionComponent } from '@common-ui/inputs/input-with-action/input-with-action.component';
 import { getCurrentUser } from '@common-ui/users';
@@ -25,9 +24,6 @@ import { Roles } from '@users/roles';
 import { combineLatest, firstValueFrom } from 'rxjs';
 import { map, tap } from 'rxjs/operators';
 import { AdminDialogService } from '../../services/admin-dialog.service';
-import { AdminSideNavComponent } from '../../shared/components/admin-side-nav/admin-side-nav.component';
-import { DossierTemplateActionsComponent } from '../../shared/components/dossier-template-actions/dossier-template-actions.component';
-import { DossierTemplateBreadcrumbsComponent } from '../../shared/components/dossier-template-breadcrumbs/dossier-template-breadcrumbs.component';
 import { AddEditComponentMappingDialogComponent } from './add-edit-component-mapping-dialog/add-edit-component-mapping-dialog.component';
 import { download } from '@utils/file-download-utils';
 import { MatTooltip } from '@angular/material/tooltip';
@@ -37,14 +33,10 @@ import { MatTooltip } from '@angular/material/tooltip';
     styleUrls: ['./component-mappings-screen.component.scss'],
     providers: listingProvidersFactory(ComponentMappingsScreenComponent),
     imports: [
-        DossierTemplateBreadcrumbsComponent,
         AsyncPipe,
         NgIf,
-        DossierTemplateActionsComponent,
         CircleButtonComponent,
         TranslateModule,
-        RouterLink,
-        AdminSideNavComponent,
         IqserListingModule,
         InputWithActionComponent,
         IconButtonComponent,

apps/red-ui/src/app/modules/admin/screens/dossier-states-listing/confirm-delete-dossier-state-dialog/confirm-delete-dossier-state-dialog.component.ts

@@ -11,7 +11,7 @@ import { ArchivedDossiersService } from '@services/dossiers/archived-dossiers.se
 import { TranslateModule } from '@ngx-translate/core';
 import { MatCheckbox } from '@angular/material/checkbox';
 import { MatFormField } from '@angular/material/form-field';
-import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatOption, MatSelect } from '@angular/material/select';
 import { NgForOf, NgIf } from '@angular/common';
 
 export interface ConfirmDeleteDossierStateDialogData {
@@ -28,7 +28,6 @@ export interface ConfirmDeleteDossierStateDialogData {
         ReactiveFormsModule,
         MatCheckbox,
         MatFormField,
-        MatSelectTrigger,
         MatSelect,
         MatOption,
         NgForOf,

apps/red-ui/src/app/modules/admin/screens/entities/screens/entity-info/entity-info.component.ts

@@ -1,6 +1,6 @@
 import { ChangeDetectionStrategy, Component, HostListener, ViewChild } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { getConfig, HasScrollbarDirective, HelpButtonComponent, IconButtonComponent, IconButtonTypes } from '@iqser/common-ui';
+import { getConfig, HasScrollbarDirective, IconButtonComponent, IconButtonTypes } from '@iqser/common-ui';
 import { IqserEventTarget } from '@iqser/common-ui/lib/utils';
 import { Dictionary, DOSSIER_TEMPLATE_ID, ENTITY_TYPE } from '@red/domain';
 import { DictionariesMapService } from '@services/entity-services/dictionaries-map.service';
@@ -17,16 +17,7 @@ import { TranslateModule } from '@ngx-translate/core';
     templateUrl: './entity-info.component.html',
     styleUrls: ['./entity-info.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
-    imports: [
-        HasScrollbarDirective,
-        MatIcon,
-        NgIf,
-        TranslateModule,
-        AsyncPipe,
-        IconButtonComponent,
-        AddEditEntityComponent,
-        HelpButtonComponent,
-    ],
+    imports: [HasScrollbarDirective, MatIcon, NgIf, TranslateModule, AsyncPipe, IconButtonComponent, AddEditEntityComponent],
 })
 export class EntityInfoComponent {
     @ViewChild(AddEditEntityComponent) private readonly _addEditEntityComponent: AddEditEntityComponent;

apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.ts

@@ -2,8 +2,8 @@ import { AsyncPipe, NgForOf, NgIf } from '@angular/common';
 import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatFormField } from '@angular/material/form-field';
-import { MatMenu, MatMenuTrigger } from '@angular/material/menu';
-import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatMenu, MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
+import { MatOption, MatSelect } from '@angular/material/select';
 import { MatSlideToggle } from '@angular/material/slide-toggle';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import { ChevronButtonComponent } from '@common-ui/buttons/chevron-button';
@@ -29,7 +29,6 @@ import { fileAttributeTypesTranslations } from '@translations/file-attribute-typ
         MatMenu,
         EditableInputComponent,
         MatFormField,
-        MatSelectTrigger,
         MatSelect,
         MatOption,
         FormsModule,
@@ -37,6 +36,7 @@ import { fileAttributeTypesTranslations } from '@translations/file-attribute-typ
         RoundCheckboxComponent,
         NgForOf,
         NgIf,
+        MatMenuItem,
     ],
 })
 export class ActiveFieldsListingComponent extends ListingComponent<IField> implements OnChanges {

apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts

@@ -4,7 +4,7 @@ import { AbstractControl, ReactiveFormsModule, UntypedFormBuilder, UntypedFormGr
 import { MatAutocomplete, MatAutocompleteTrigger, MatOption } from '@angular/material/autocomplete';
 import { MAT_DIALOG_DATA, MatDialogClose, MatDialogRef } from '@angular/material/dialog';
 import { MatFormField } from '@angular/material/form-field';
-import { MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatSelect } from '@angular/material/select';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import { InputWithActionComponent } from '@common-ui/inputs/input-with-action/input-with-action.component';
 import {
@@ -45,7 +45,6 @@ export interface IFileAttributesCSVImportData {
         MatAutocomplete,
         AsyncPipe,
         MatOption,
-        MatSelectTrigger,
         MatSelect,
         CircleButtonComponent,
         NgIf,

apps/red-ui/src/app/modules/admin/screens/info/dossier-template-info-screen/dossier-template-info-screen.component.ts

@@ -22,7 +22,6 @@ import { Observable } from 'rxjs';
 import { DossierTemplateDetailsComponent } from '../dossier-template-details/dossier-template-details.component';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatCheckbox } from '@angular/material/checkbox';
-import { NgIf } from '@angular/common';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatIcon } from '@angular/material/icon';
 import { SelectComponent } from '@shared/components/select/select.component';
@@ -42,7 +41,6 @@ const downloadTypes = ['ORIGINAL', 'PREVIEW', 'OPTIMIZED_PREVIEW', 'DELTA_PREVIE
         DossierTemplateDetailsComponent,
         TranslateModule,
         MatCheckbox,
-        NgIf,
         MatDatepickerModule,
         SelectComponent,
         IconButtonComponent,

apps/red-ui/src/app/modules/admin/shared/components/dossier-template-actions/dossier-template-actions.component.ts

@@ -1,6 +1,6 @@
 import { NgIf } from '@angular/common';
 import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, Router, RouterLink } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { CircleButtonComponent, LoadingService } from '@iqser/common-ui';
 import { getCurrentUser } from '@iqser/common-ui/lib/users';
 import { TranslateModule } from '@ngx-translate/core';
@@ -13,7 +13,7 @@ import { AdminDialogService } from '../../../services/admin-dialog.service';
     selector: 'redaction-dossier-template-actions',
     templateUrl: './dossier-template-actions.component.html',
     styleUrls: ['./dossier-template-actions.component.scss'],
-    imports: [NgIf, CircleButtonComponent, TranslateModule, RouterLink],
+    imports: [NgIf, CircleButtonComponent, TranslateModule],
 })
 export class DossierTemplateActionsComponent implements OnInit {
     @Input() dossierTemplateId: string;

apps/red-ui/src/app/modules/dossier-overview/components/file-attribute/file-attribute.component.ts

@@ -1,4 +1,4 @@
-import { AsyncPipe, NgClass, NgIf, NgTemplateOutlet } from '@angular/common';
+import { AsyncPipe, NgClass, NgIf } from '@angular/common';
 import { Component, computed, effect, HostListener, input, Input, OnDestroy } from '@angular/core';
 import { AbstractControl, FormBuilder, FormsModule, ReactiveFormsModule, UntypedFormGroup, ValidatorFn } from '@angular/forms';
 import { MatIconModule } from '@angular/material/icon';
@@ -41,7 +41,6 @@ import { ConfigService } from '../../config.service';
         ReactiveFormsModule,
         DynamicInputComponent,
         CircleButtonComponent,
-        NgTemplateOutlet,
         TranslateModule,
         StopPropagationDirective,
     ],
@@ -90,14 +89,11 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
         );
         this.#subscriptions.add(sub2.subscribe());
 
-        effect(
-            () => {
-                if (this.#shouldClose()) {
-                    this.close();
-                }
-            },
-            { allowSignalWrites: true },
-        );
+        effect(() => {
+            if (this.#shouldClose()) {
+                this.close();
+            }
+        });
     }
 
     get isDate(): boolean {
@@ -131,7 +127,6 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr
 
     handleClick($event: MouseEvent) {
         $event.stopPropagation();
-        $event.preventDefault();
     }
 
     ngOnDestroy() {

apps/red-ui/src/app/modules/file-preview/components/annotation-details/annotation-details.component.ts

@@ -7,7 +7,7 @@ import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { annotationChangesTranslations } from '@translations/annotation-changes-translations';
 import { MultiSelectService } from '../../services/multi-select.service';
 import { LogEntryEngine, LogEntryEngines } from '@red/domain';
-import { NgForOf, NgIf } from '@angular/common';
+import { NgForOf } from '@angular/common';
 import { MatTooltip } from '@angular/material/tooltip';
 import { MatIcon } from '@angular/material/icon';
 import { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
@@ -36,7 +36,7 @@ const changesProperties: KeysOf<AnnotationWrapper>[] = [
     selector: 'redaction-annotation-details',
     templateUrl: './annotation-details.component.html',
     styleUrls: ['./annotation-details.component.scss'],
-    imports: [NgIf, MatTooltip, MatIcon, CdkOverlayOrigin, NgForOf, CdkConnectedOverlay, TranslateModule],
+    imports: [MatTooltip, MatIcon, CdkOverlayOrigin, NgForOf, CdkConnectedOverlay, TranslateModule],
 })
 export class AnnotationDetailsComponent {
     readonly annotation = input.required<ListItem<AnnotationWrapper>>();

apps/red-ui/src/app/modules/file-preview/components/documine-export/documine-export.component.ts

@@ -1,16 +1,15 @@
-import { Component, input, Input } from '@angular/core';
+import { Component, input } from '@angular/core';
 import { firstValueFrom } from 'rxjs';
 import { Dossier, File } from '@red/domain';
 import { MatTooltip } from '@angular/material/tooltip';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatMenu, MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
 import { ComponentLogService } from '@services/entity-services/component-log.service';
-import { StopPropagationDirective } from '@iqser/common-ui';
 
 @Component({
     selector: 'redaction-documine-export',
     templateUrl: './documine-export.component.html',
-    imports: [MatTooltip, TranslateModule, MatMenuTrigger, MatMenu, MatMenuItem, StopPropagationDirective],
+    imports: [MatTooltip, TranslateModule, MatMenuTrigger, MatMenu, MatMenuItem],
 })
 export class DocumineExportComponent {
     readonly dossier = input<Dossier>();

apps/red-ui/src/app/modules/file-preview/components/editable-structured-component-value/editable-structured-component-value.component.ts

@@ -1,5 +1,5 @@
 import { CdkDrag, CdkDragDrop, CdkDragHandle, CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';
-import { AsyncPipe, KeyValuePipe, NgClass, NgForOf, NgIf } from '@angular/common';
+import { NgClass } from '@angular/common';
 import { Component, computed, input, OnInit, output, signal, WritableSignal } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatIcon } from '@angular/material/icon';
@@ -20,16 +20,12 @@ import { MatTooltip } from '@angular/material/tooltip';
         CircleButtonComponent,
         NgClass,
         TranslateModule,
-        KeyValuePipe,
         CdkDropList,
         MatIcon,
         IconButtonComponent,
         CdkDrag,
-        NgIf,
-        NgForOf,
         CdkDragHandle,
         FormsModule,
-        AsyncPipe,
         ReplaceNbspPipe,
         MatTooltip,
     ],

apps/red-ui/src/app/modules/file-preview/components/readonly-banner/readonly-banner.component.ts

@@ -1,7 +1,6 @@
 import { Component, inject, Input } from '@angular/core';
 import { FilePreviewStateService } from '../../services/file-preview-state.service';
 import { OcrProgressBarComponent } from '@shared/components/ocr-progress-bar/ocr-progress-bar.component';
-import { NgIf } from '@angular/common';
 import { MatProgressBar } from '@angular/material/progress-bar';
 import { MatIcon } from '@angular/material/icon';
 import { TranslateModule } from '@ngx-translate/core';
@@ -11,7 +10,7 @@ import { MatTooltip } from '@angular/material/tooltip';
     selector: 'redaction-readonly-banner',
     templateUrl: './readonly-banner.component.html',
     styleUrls: ['./readonly-banner.component.scss'],
-    imports: [OcrProgressBarComponent, NgIf, MatProgressBar, MatIcon, TranslateModule, MatTooltip],
+    imports: [OcrProgressBarComponent, MatProgressBar, MatIcon, TranslateModule, MatTooltip],
 })
 export class ReadonlyBannerComponent {
     protected readonly _state = inject(FilePreviewStateService);

apps/red-ui/src/app/modules/file-preview/components/selected-annotations-table/selected-annotations-table.component.ts

@@ -1,5 +1,5 @@
 import { Component, computed, input } from '@angular/core';
-import { NgClass, NgForOf, NgStyle } from '@angular/common';
+import { NgClass, NgStyle } from '@angular/common';
 
 export interface ValueColumn {
     label: string;
@@ -13,7 +13,7 @@ const MAX_ITEMS_DISPLAY = 10;
 
 @Component({
     selector: 'redaction-selected-annotations-table',
-    imports: [NgForOf, NgClass, NgStyle],
+    imports: [NgClass, NgStyle],
     templateUrl: './selected-annotations-table.component.html',
     styleUrl: './selected-annotations-table.component.scss',
 })

apps/red-ui/src/app/modules/file-preview/dialogs/change-legal-basis-dialog/change-legal-basis-dialog.component.ts

@@ -7,7 +7,7 @@ import { Dossier } from '@red/domain';
 import { JustificationsService } from '@services/entity-services/justifications.service';
 import { firstValueFrom } from 'rxjs';
 import { MatFormField } from '@angular/material/form-field';
-import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatOption, MatSelect } from '@angular/material/select';
 import { NgForOf, NgIf } from '@angular/common';
 import { MatTooltip } from '@angular/material/tooltip';
 import { TranslateModule } from '@ngx-translate/core';
@@ -18,7 +18,6 @@ import { LegalBasisOption } from '../../utils/dialog-types';
     imports: [
         ReactiveFormsModule,
         MatFormField,
-        MatSelectTrigger,
         MatSelect,
         MatOption,
         NgForOf,

apps/red-ui/src/app/modules/file-preview/dialogs/docu-mine/revert-value-dialog/revert-value-dialog.component.ts

@@ -3,7 +3,7 @@ import { CircleButtonComponent, ConfirmOptions, IconButtonComponent, IqserDialog
 import { MatDialogClose } from '@angular/material/dialog';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { IComponentLogEntry } from '@red/domain';
-import { NgFor, NgIf } from '@angular/common';
+import { NgFor } from '@angular/common';
 
 interface RevertValueData {
     entry: IComponentLogEntry;
@@ -13,7 +13,7 @@ interface RevertValueResult {}
 @Component({
     templateUrl: 'revert-value-dialog.component.html',
     styleUrls: ['./revert-value-dialog.component.scss'],
-    imports: [CircleButtonComponent, IconButtonComponent, MatDialogClose, TranslateModule, NgFor, NgIf],
+    imports: [CircleButtonComponent, IconButtonComponent, MatDialogClose, TranslateModule, NgFor],
 })
 export class RevertValueDialogComponent extends IqserDialogComponent<RevertValueDialogComponent, RevertValueData, RevertValueResult> {
     protected readonly entry = this.data.entry;

apps/red-ui/src/app/modules/file-preview/dialogs/rectangle-annotation-dialog/rectangle-annotation-dialog.component.ts

@@ -15,12 +15,10 @@ import { JustificationsService } from '@services/entity-services/justifications.
 import { Roles } from '@users/roles';
 import { firstValueFrom } from 'rxjs';
 import { ManualRedactionService } from '../../services/manual-redaction.service';
-import { NgForOf, NgIf } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatFormField } from '@angular/material/form-field';
-import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatOption, MatSelect } from '@angular/material/select';
 import { MatTooltip } from '@angular/material/tooltip';
-import { MatCheckbox } from '@angular/material/checkbox';
 import { DetailsRadioOption } from '@common-ui/inputs/details-radio/details-radio-option';
 import {
     LegalBasisOption,
@@ -41,18 +39,14 @@ export const NON_READABLE_CONTENT = 'non-readable content';
     styleUrls: ['./rectangle-annotation-dialog.component.scss'],
     imports: [
         ReactiveFormsModule,
-        NgIf,
         CircleButtonComponent,
         TranslateModule,
         HasScrollbarDirective,
         MatFormField,
-        MatSelectTrigger,
         MatSelect,
         MatOption,
-        NgForOf,
         MatTooltip,
         IqserDenyDirective,
-        MatCheckbox,
         IconButtonComponent,
         DetailsRadioComponent,
     ],

apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dictionary-dialog/edit-dictionary-dialog.component.ts

@@ -1,14 +1,6 @@
 import { Component, HostListener } from '@angular/core';
-import {
-    CircleButtonComponent,
-    IconButtonComponent,
-    IconButtonTypes,
-    IqserDialogComponent,
-    LoadingService,
-    Toaster,
-} from '@iqser/common-ui';
+import { CircleButtonComponent, IconButtonComponent, IqserDialogComponent, LoadingService, Toaster } from '@iqser/common-ui';
 import { MatDialogClose } from '@angular/material/dialog';
-import { MatFormField } from '@angular/material/form-field';
 import { NgIf } from '@angular/common';
 import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
@@ -31,16 +23,7 @@ interface ReturnType {
 
 @Component({
     selector: 'redaction-edit-dictionary-dialog',
-    imports: [
-        CircleButtonComponent,
-        IconButtonComponent,
-        MatDialogClose,
-        MatFormField,
-        ReactiveFormsModule,
-        TranslateModule,
-        MatCheckbox,
-        NgIf,
-    ],
+    imports: [CircleButtonComponent, IconButtonComponent, MatDialogClose, ReactiveFormsModule, TranslateModule, MatCheckbox, NgIf],
     templateUrl: './edit-dictionary-dialog.component.html',
 })
 export class EditDictionaryDialogComponent extends IqserDialogComponent<EditDictionaryDialogComponent, DialogData, ReturnType> {

apps/red-ui/src/app/modules/shared-dossiers/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts

@@ -6,7 +6,7 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatDialogRef } from '@angular/material/dialog';
 import { MatFormField, MatSuffix } from '@angular/material/form-field';
 import { MatIcon } from '@angular/material/icon';
-import { MatOption, MatSelect, MatSelectTrigger } from '@angular/material/select';
+import { MatOption, MatSelect } from '@angular/material/select';
 import { MatTooltip } from '@angular/material/tooltip';
 import { Router } from '@angular/router';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
@@ -68,7 +68,6 @@ interface GeneralInfoForm {
         MatSuffix,
         IconButtonComponent,
         NgIf,
-        MatSelectTrigger,
     ],
 })
 export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSectionInterface {

apps/red-ui/src/app/modules/shared/components/approve-warning-details/approve-warning-details.component.ts

@@ -1,23 +1,10 @@
 import { Component, computed, input } from '@angular/core';
 import { ApproveResponse, File } from '@red/domain';
-import { SelectedAnnotationsTableComponent } from '../../../file-preview/components/selected-annotations-table/selected-annotations-table.component';
-import { MatExpansionPanel, MatExpansionPanelHeader } from '@angular/material/expansion';
-import { KeyValuePipe, NgStyle } from '@angular/common';
 import { WarningDetailsPanelComponent } from '@shared/components/warning-details-panel/warning-details-panel.component';
-import { CdkFixedSizeVirtualScroll, CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 
 @Component({
     selector: 'redaction-approve-warning-details',
-    imports: [
-        SelectedAnnotationsTableComponent,
-        MatExpansionPanel,
-        MatExpansionPanelHeader,
-        KeyValuePipe,
-        WarningDetailsPanelComponent,
-        CdkVirtualScrollViewport,
-        CdkFixedSizeVirtualScroll,
-        NgStyle,
-    ],
+    imports: [WarningDetailsPanelComponent],
     templateUrl: './approve-warning-details.component.html',
     styleUrl: './approve-warning-details.component.scss',
 })

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

@@ -23,7 +23,7 @@ import { saveAs } from 'file-saver';
 import { List } from '@iqser/common-ui/lib/utils';
 import { firstValueFrom } from 'rxjs';
 import { MatIcon } from '@angular/material/icon';
-import { NgForOf, NgIf } from '@angular/common';
+import { NgIf } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
 import { MatTooltip } from '@angular/material/tooltip';
@@ -55,7 +55,6 @@ const HELP_MODE_KEYS = {
         MatSelect,
         MatOption,
         MatDivider,
-        NgForOf,
         IconButtonComponent,
         EditorComponent,
     ],

apps/red-ui/src/assets/styles/red-components.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use 'common-mixins';
 @use 'variables';
 
@@ -55,8 +56,8 @@
 }
 
 .ERROR {
-    stroke: lighten(variables.$primary, 25%);
-    background-color: lighten(variables.$primary, 25%);
+    stroke: color.adjust(variables.$primary, $lightness: 25%);
+    background-color: color.adjust(variables.$primary, $lightness: 25%);
 }
 
 .ACTIVE {

apps/red-ui/src/assets/styles/red-material-theme.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use '@angular/material' as mat;
 @use 'variables';
 
@@ -6,8 +7,8 @@
 
 $primary-palette: (
     default: variables.$primary,
-    lighter: lighten(variables.$primary, 30%),
-    darker: darken(variables.$primary, 30%),
+    lighter: color.adjust(variables.$primary, $lightness: 30%),
+    darker: color.adjust(variables.$primary, $lightness: -30%),
     text: variables.$primary,
     contrast: (
         default: variables.$light,
@@ -18,8 +19,8 @@ $primary-palette: (
 
 $secondary-palette: (
     default: variables.$accent,
-    lighter: lighten(variables.$accent, 30%),
-    darker: darken(variables.$accent, 30%),
+    lighter: color.adjust(variables.$accent, $lightness: 30%),
+    darker: color.adjust(variables.$accent, $lightness: -30%),
     text: variables.$accent,
     contrast: (
         default: variables.$light,
@@ -30,8 +31,8 @@ $secondary-palette: (
 
 $red-palette: (
     default: variables.$primary,
-    lighter: lighten(variables.$primary, 30%),
-    darker: darken(variables.$primary, 30%),
+    lighter: color.adjust(variables.$primary, $lightness: 30%),
+    darker: color.adjust(variables.$primary, $lightness: -30%),
     text: variables.$primary,
     contrast: (
         default: variables.$light,

apps/red-ui/src/styles.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 /* You can add global styles to this file, and also import other style files */
 @use 'variables' as vars;
 @use 'common-functions';
@@ -109,12 +110,12 @@
     $iqser-app-name-color: vars.$accent
 );
 
-$light-accent-5: lighten(vars.$accent, 5%);
-$light-accent-10: lighten(vars.$accent, 10%);
+$light-accent-5: color.adjust(vars.$accent, $lightness: 5%);
+$light-accent-10: color.adjust(vars.$accent, $lightness: 10%);
 
-$dark-accent-5: darken(vars.$accent, 5%);
-$dark-accent-8: darken(vars.$accent, 8%);
-$dark-accent-10: darken(vars.$accent, 10%);
+$dark-accent-5: color.adjust(vars.$accent, $lightness: -5%);
+$dark-accent-8: color.adjust(vars.$accent, $lightness: -8%);
+$dark-accent-10: color.adjust(vars.$accent, $lightness: -10%);
 
 @include common-variables.configureDark(
     $iqser-primary: vars.$primary,
@@ -172,7 +173,8 @@ body {
     --documine-viewer-width: calc(
         100% - var(--structured-component-management-width) - calc(var(--documine-workload-content-width) - 55px) - var(
                 --quick-navigation-width
-            ) - 3px
+            ) -
+            3px
     );
     --viewer-height: calc(100% - calc(var(--iqser-top-bar-height) + 50px));
 }
@@ -198,7 +200,8 @@ body {
         width: calc(
             100% - var(--structured-component-management-width) - calc(var(--documine-workload-content-width) - 55px) - var(
                     --workload-width
-                ) - 3px
+                ) -
+                3px
         );
         right: calc(var(--workload-width) + 1px);
     }

libs/common-ui

@@ -1 +1 @@
-Subproject commit 0e6e4f7b090bdd747e9e8db65201b4e8a4ff76b8
+Subproject commit a4e3ed8854604fccd87579a3f3b8a77dc7b9c1ca