Enhancement: angular 19 (#8584)

src-ui/src/app/components/common/input/document-link/document-link.component.html

@@ -40,7 +40,9 @@
     (change)="onChange(selectedDocuments)">
     <ng-template ng-label-tmp let-document="item">
       <div class="d-flex align-items-center">
-        <button class="btn p-0 lh-1" *ngIf="!disabled" (click)="unselect(document)" title="Remove link" i18n-title><i-bs name="x"></i-bs></button>
+        @if (!disabled) {
+          <button class="btn p-0 lh-1" (click)="unselect(document)" title="Remove link" i18n-title><i-bs name="x"></i-bs></button>
+        }
         @if (document.title) {
           <a routerLink="/documents/{{document.id}}" class="badge bg-light text-primary" (mousedown)="$event.stopImmediatePropagation();" title="Open link" i18n-title>
             <i-bs width="0.9em" height="0.9em" name="file-text"></i-bs>&nbsp;<span>{{document.title}}</span>

src-ui/src/app/components/common/input/document-link/document-link.component.spec.ts

@@ -1,12 +1,7 @@
 import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'
 import { provideHttpClientTesting } from '@angular/common/http/testing'
 import { ComponentFixture, TestBed } from '@angular/core/testing'
-import {
-  FormsModule,
-  NG_VALUE_ACCESSOR,
-  ReactiveFormsModule,
-} from '@angular/forms'
-import { NgSelectModule } from '@ng-select/ng-select'
+import { NG_VALUE_ACCESSOR } from '@angular/forms'
 import { of, throwError } from 'rxjs'
 import { FILTER_TITLE } from 'src/app/data/filter-rule-type'
 import { DocumentService } from 'src/app/services/rest/document.service'
@@ -38,8 +33,7 @@ describe('DocumentLinkComponent', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [DocumentLinkComponent],
-      imports: [NgSelectModule, FormsModule, ReactiveFormsModule],
+      imports: [DocumentLinkComponent],
       providers: [
         provideHttpClient(withInterceptorsFromDi()),
         provideHttpClientTesting(),

src-ui/src/app/components/common/input/document-link/document-link.component.ts

@@ -1,5 +1,13 @@
+import { AsyncPipe, NgTemplateOutlet } from '@angular/common'
 import { Component, forwardRef, Input, OnDestroy, OnInit } from '@angular/core'
-import { NG_VALUE_ACCESSOR } from '@angular/forms'
+import {
+  FormsModule,
+  NG_VALUE_ACCESSOR,
+  ReactiveFormsModule,
+} from '@angular/forms'
+import { RouterModule } from '@angular/router'
+import { NgSelectModule } from '@ng-select/ng-select'
+import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
 import {
   catchError,
   concat,
@@ -14,6 +22,7 @@ import {
 } from 'rxjs'
 import { Document } from 'src/app/data/document'
 import { FILTER_TITLE } from 'src/app/data/filter-rule-type'
+import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
 import { DocumentService } from 'src/app/services/rest/document.service'
 import { AbstractInputComponent } from '../abstract-input'
 
@@ -28,6 +37,16 @@ import { AbstractInputComponent } from '../abstract-input'
   selector: 'pngx-input-document-link',
   templateUrl: './document-link.component.html',
   styleUrls: ['./document-link.component.scss'],
+  imports: [
+    CustomDatePipe,
+    AsyncPipe,
+    FormsModule,
+    ReactiveFormsModule,
+    RouterModule,
+    NgTemplateOutlet,
+    NgSelectModule,
+    NgxBootstrapIconsModule,
+  ],
 })
 export class DocumentLinkComponent
   extends AbstractInputComponent<any[]>