Enhancement: angular 19 (#8584)

src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts

@@ -19,6 +19,7 @@ import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
 import { of } from 'rxjs'
 import { CustomField, CustomFieldDataType } from 'src/app/data/custom-field'
 import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
+import { SettingsService } from 'src/app/services/settings.service'
 import { ToastService } from 'src/app/services/toast.service'
 import { CustomFieldEditDialogComponent } from '../edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
 import { SelectComponent } from '../input/select/select.component'
@@ -43,10 +44,10 @@ describe('CustomFieldsDropdownComponent', () => {
   let customFieldService: CustomFieldsService
   let toastService: ToastService
   let modalService: NgbModal
+  let settingsService: SettingsService
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [CustomFieldsDropdownComponent, SelectComponent],
       imports: [
         NgSelectModule,
         FormsModule,
@@ -54,6 +55,8 @@ describe('CustomFieldsDropdownComponent', () => {
         NgbModalModule,
         NgbDropdownModule,
         NgxBootstrapIconsModule.pick(allIcons),
+        CustomFieldsDropdownComponent,
+        SelectComponent,
       ],
       providers: [
         provideHttpClient(withInterceptorsFromDi()),
@@ -70,6 +73,8 @@ describe('CustomFieldsDropdownComponent', () => {
         results: fields.concat([]),
       })
     )
+    settingsService = TestBed.inject(SettingsService)
+    settingsService.currentUser = { id: 1, username: 'test' }
     fixture = TestBed.createComponent(CustomFieldsDropdownComponent)
     component = fixture.componentInstance
     fixture.detectChanges()

src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.ts

@@ -8,7 +8,9 @@ import {
   ViewChild,
   ViewChildren,
 } from '@angular/core'
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
+import { FormsModule, ReactiveFormsModule } from '@angular/forms'
+import { NgbDropdownModule, NgbModal } from '@ng-bootstrap/ng-bootstrap'
+import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
 import { first, takeUntil } from 'rxjs'
 import { CustomField, DATA_TYPE_LABELS } from 'src/app/data/custom-field'
 import { CustomFieldInstance } from 'src/app/data/custom-field-instance'
@@ -26,6 +28,12 @@ import { CustomFieldEditDialogComponent } from '../edit-dialog/custom-field-edit
   selector: 'pngx-custom-fields-dropdown',
   templateUrl: './custom-fields-dropdown.component.html',
   styleUrls: ['./custom-fields-dropdown.component.scss'],
+  imports: [
+    NgbDropdownModule,
+    NgxBootstrapIconsModule,
+    FormsModule,
+    ReactiveFormsModule,
+  ],
 })
 export class CustomFieldsDropdownComponent extends LoadingComponentWithPermissions {
   @Input()