Fix frontend tests icon imports

2025-04-25 10:49:30 -05:00 · 2024-01-19 22:28:32 -08:00 · 2024-01-19 22:28:32 -08:00 · 5781a0d51f
commit 5781a0d51f
parent e5f48739a0
42 changed files with 137 additions and 20 deletions
--- a/src-ui/src/app/components/admin/config/config.component.spec.ts
+++ b/src-ui/src/app/components/admin/config/config.component.spec.ts
@ -17,6 +17,7 @@ import { PageHeaderComponent } from '../../common/page-header/page-header.compon
 import { SelectComponent } from '../../common/input/select/select.component'
 import { FileComponent } from '../../common/input/file/file.component'
 import { SettingsService } from 'src/app/services/settings.service'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('ConfigComponent', () => {
  let component: ConfigComponent
@ -43,6 +44,7 @@ describe('ConfigComponent', () => {
        NgSelectModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/admin/logs/logs.component.spec.ts
+++ b/src-ui/src/app/components/admin/logs/logs.component.spec.ts
@ -11,6 +11,7 @@ import { of, throwError } from 'rxjs'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { NgbModule, NgbNavLink } from '@ng-bootstrap/ng-bootstrap'
 import { BrowserModule, By } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const paperless_logs = [
  '[2023-05-29 03:05:01,224] [DEBUG] [paperless.tasks] Training data unchanged.',
@ -37,7 +38,12 @@ describe('LogsComponent', () => {
    TestBed.configureTestingModule({
      declarations: [LogsComponent, PageHeaderComponent],
      providers: [],
-      imports: [HttpClientTestingModule, BrowserModule, NgbModule],
+      imports: [
+        HttpClientTestingModule,
+        BrowserModule,
+        NgbModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    logService = TestBed.inject(LogService)
--- a/src-ui/src/app/components/admin/settings/settings.component.spec.ts
+++ b/src-ui/src/app/components/admin/settings/settings.component.spec.ts
@ -37,6 +37,7 @@ import { TextComponent } from '../../common/input/text/text.component'
 import { PageHeaderComponent } from '../../common/page-header/page-header.component'
 import { SettingsComponent } from './settings.component'
 import { IfOwnerDirective } from 'src/app/directives/if-owner.directive'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const savedViews = [
  { id: 1, name: 'view1', show_in_sidebar: true, show_on_dashboard: true },
@ -92,6 +93,7 @@ describe('SettingsComponent', () => {
        ReactiveFormsModule,
        NgbAlertModule,
        NgSelectModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/admin/tasks/tasks.component.spec.ts
+++ b/src-ui/src/app/components/admin/tasks/tasks.component.spec.ts
@ -28,6 +28,7 @@ import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dial
 import { PageHeaderComponent } from '../../common/page-header/page-header.component'
 import { TasksComponent } from './tasks.component'
 import { PermissionsGuard } from 'src/app/guards/permissions.guard'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const tasks: PaperlessTask[] = [
  {
@ -138,6 +139,7 @@ describe('TasksComponent', () => {
        NgbModule,
        HttpClientTestingModule,
        RouterTestingModule.withRoutes(routes),
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/admin/users-groups/users-groups.component.spec.ts
+++ b/src-ui/src/app/components/admin/users-groups/users-groups.component.spec.ts
@ -43,6 +43,7 @@ import { SettingsComponent } from '../settings/settings.component'
 import { UsersAndGroupsComponent } from './users-groups.component'
 import { User } from 'src/app/data/user'
 import { Group } from 'src/app/data/group'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const users = [
  { id: 1, username: 'user1', is_superuser: false },
@ -92,6 +93,7 @@ describe('UsersAndGroupsComponent', () => {
        ReactiveFormsModule,
        NgbAlertModule,
        NgSelectModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()
    fixture = TestBed.createComponent(UsersAndGroupsComponent)
--- a/src-ui/src/app/components/app-frame/app-frame.component.spec.ts
+++ b/src-ui/src/app/components/app-frame/app-frame.component.spec.ts
@ -33,6 +33,7 @@ import { PermissionsGuard } from 'src/app/guards/permissions.guard'
 import { CdkDragDrop, DragDropModule } from '@angular/cdk/drag-drop'
 import { SavedView } from 'src/app/data/saved-view'
 import { ProfileEditDialogComponent } from '../common/profile-edit-dialog/profile-edit-dialog.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const saved_views = [
  {
@ -101,6 +102,7 @@ describe('AppFrameComponent', () => {
        ReactiveFormsModule,
        DragDropModule,
        NgbModalModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
      providers: [
        SettingsService,
--- a/src-ui/src/app/components/common/clearable-badge/clearable-badge.component.spec.ts
+++ b/src-ui/src/app/components/common/clearable-badge/clearable-badge.component.spec.ts
@ -1,5 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { ClearableBadgeComponent } from './clearable-badge.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('ClearableBadgeComponent', () => {
  let component: ClearableBadgeComponent
@ -8,6 +9,7 @@ describe('ClearableBadgeComponent', () => {
  beforeEach(async () => {
    TestBed.configureTestingModule({
      declarations: [ClearableBadgeComponent],
+      imports: [NgxBootstrapIconsModule.pick(allIcons)],
    }).compileComponents()

    fixture = TestBed.createComponent(ClearableBadgeComponent)
--- a/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/custom-fields-dropdown/custom-fields-dropdown.component.spec.ts
@ -20,6 +20,7 @@ import {
 } from '@ng-bootstrap/ng-bootstrap'
 import { CustomFieldEditDialogComponent } from '../edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
 import { By } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const fields: CustomField[] = [
  {
@ -40,7 +41,6 @@ describe('CustomFieldsDropdownComponent', () => {
  let customFieldService: CustomFieldsService
  let toastService: ToastService
  let modalService: NgbModal
-  let httpController: HttpTestingController

  beforeEach(() => {
    TestBed.configureTestingModule({
@ -52,10 +52,10 @@ describe('CustomFieldsDropdownComponent', () => {
        ReactiveFormsModule,
        NgbModalModule,
        NgbDropdownModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    })
    customFieldService = TestBed.inject(CustomFieldsService)
-    httpController = TestBed.inject(HttpTestingController)
    toastService = TestBed.inject(ToastService)
    modalService = TestBed.inject(NgbModal)
    jest.spyOn(customFieldService, 'listAll').mockReturnValue(
--- a/src-ui/src/app/components/common/date-dropdown/date-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/date-dropdown/date-dropdown.component.spec.ts
@ -10,20 +10,17 @@ import {
  DateSelection,
  RelativeDate,
 } from './date-dropdown.component'
-import {
-  HttpClientTestingModule,
-  HttpTestingController,
-} from '@angular/common/http/testing'
+import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
 import { SettingsService } from 'src/app/services/settings.service'
 import { ClearableBadgeComponent } from '../clearable-badge/clearable-badge.component'
 import { FormsModule, ReactiveFormsModule } from '@angular/forms'
 import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
 import { DatePipe } from '@angular/common'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('DateDropdownComponent', () => {
  let component: DateDropdownComponent
-  let httpTestingController: HttpTestingController
  let settingsService: SettingsService
  let settingsSpy

@ -40,10 +37,10 @@ describe('DateDropdownComponent', () => {
        NgbModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

-    httpTestingController = TestBed.inject(HttpTestingController)
    settingsService = TestBed.inject(SettingsService)
    settingsSpy = jest.spyOn(settingsService, 'getLocalizedDateInputFormat')

--- a/src-ui/src/app/components/common/edit-dialog/tag-edit-dialog/tag-edit-dialog.component.spec.ts
+++ b/src-ui/src/app/components/common/edit-dialog/tag-edit-dialog/tag-edit-dialog.component.spec.ts
@ -13,6 +13,7 @@ import { SelectComponent } from '../../input/select/select.component'
 import { TextComponent } from '../../input/text/text.component'
 import { EditDialogMode } from '../edit-dialog.component'
 import { TagEditDialogComponent } from './tag-edit-dialog.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('TagEditDialogComponent', () => {
  let component: TagEditDialogComponent
@ -38,6 +39,7 @@ describe('TagEditDialogComponent', () => {
        ReactiveFormsModule,
        NgSelectModule,
        NgbModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.spec.ts
@ -25,6 +25,7 @@ import {
 import { TagComponent } from '../tag/tag.component'
 import { FormsModule, ReactiveFormsModule } from '@angular/forms'
 import { ClearableBadgeComponent } from '../clearable-badge/clearable-badge.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const items: Tag[] = [
  {
@ -63,7 +64,12 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>
        ClearableBadgeComponent,
      ],
      providers: [FilterPipe],
-      imports: [NgbModule, FormsModule, ReactiveFormsModule],
+      imports: [
+        NgbModule,
+        FormsModule,
+        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    fixture = TestBed.createComponent(FilterableDropdownComponent)
@ -215,6 +221,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should apply changes and close when apply button clicked', () => {
    component.items = items
+    component.icon = 'tag-fill'
    component.editing = true
    component.selectionModel = selectionModel
    fixture.nativeElement
@ -236,6 +243,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should apply on close if enabled', () => {
    component.items = items
+    component.icon = 'tag-fill'
    component.editing = true
    component.applyOnClose = true
    component.selectionModel = selectionModel
@ -253,6 +261,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should focus text filter on open, support filtering, clear on close', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    fixture.nativeElement
      .querySelector('button')
      .dispatchEvent(new MouseEvent('click')) // open
@ -279,6 +288,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should toggle & close on enter inside filter field if 1 item remains', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    expect(component.selectionModel.getSelectedItems()).toEqual([])
    fixture.nativeElement
      .querySelector('button')
@ -298,6 +308,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should apply & close on enter inside filter field if 1 item remains if editing', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    component.editing = true
    let applyResult: ChangedItems
    component.apply.subscribe((result) => (applyResult = result))
@ -319,6 +330,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should support arrow keyboard navigation', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    fixture.nativeElement
      .querySelector('button')
      .dispatchEvent(new MouseEvent('click')) // open
@ -363,6 +375,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should support arrow keyboard navigation after tab keyboard navigation', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    fixture.nativeElement
      .querySelector('button')
      .dispatchEvent(new MouseEvent('click')) // open
@ -398,6 +411,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should support arrow keyboard navigation after click', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    fixture.nativeElement
      .querySelector('button')
      .dispatchEvent(new MouseEvent('click')) // open
@ -422,6 +436,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should toggle logical operator', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    component.manyToOne = true
    selectionModel.set(items[0].id, ToggleableItemState.Selected)
    selectionModel.set(items[1].id, ToggleableItemState.Selected)
@ -450,6 +465,7 @@ describe('FilterableDropdownComponent & FilterableDropdownSelectionModel', () =>

  it('should toggle intersection include / exclude', fakeAsync(() => {
    component.items = items
+    component.icon = 'tag-fill'
    selectionModel.set(items[0].id, ToggleableItemState.Selected)
    selectionModel.set(items[1].id, ToggleableItemState.Selected)
    component.selectionModel = selectionModel
--- a/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts
+++ b/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts
@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output, OnInit } from '@angular/core'
+import { Component, EventEmitter, Input, Output } from '@angular/core'
 import { MatchingModel } from 'src/app/data/matching-model'

 export enum ToggleableItemState {
--- a/src-ui/src/app/components/common/input/color/color.component.spec.ts
+++ b/src-ui/src/app/components/common/input/color/color.component.spec.ts
@ -7,6 +7,7 @@ import {
 import { ColorComponent } from './color.component'
 import { NgbPopoverModule } from '@ng-bootstrap/ng-bootstrap'
 import { ColorSliderModule } from 'ngx-color/slider'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('ColorComponent', () => {
  let component: ColorComponent
@ -22,6 +23,7 @@ describe('ColorComponent', () => {
        ReactiveFormsModule,
        NgbPopoverModule,
        ColorSliderModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/common/input/date/date.component.spec.ts
+++ b/src-ui/src/app/components/common/input/date/date.component.spec.ts
@ -12,6 +12,7 @@ import {
 } from '@ng-bootstrap/ng-bootstrap'
 import { RouterTestingModule } from '@angular/router/testing'
 import { LocalizedDateParserFormatter } from 'src/app/utils/ngb-date-parser-formatter'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('DateComponent', () => {
  let component: DateComponent
@ -33,6 +34,7 @@ describe('DateComponent', () => {
        HttpClientTestingModule,
        NgbDatepickerModule,
        RouterTestingModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/common/input/password/password.component.spec.ts
+++ b/src-ui/src/app/components/common/input/password/password.component.spec.ts
@ -6,6 +6,7 @@ import {
 } from '@angular/forms'
 import { PasswordComponent } from './password.component'
 import { By } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('PasswordComponent', () => {
  let component: PasswordComponent
@ -16,7 +17,11 @@ describe('PasswordComponent', () => {
    TestBed.configureTestingModule({
      declarations: [PasswordComponent],
      providers: [],
-      imports: [FormsModule, ReactiveFormsModule],
+      imports: [
+        FormsModule,
+        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    fixture = TestBed.createComponent(PasswordComponent)
--- a/src-ui/src/app/components/common/input/tags/tags.component.spec.ts
+++ b/src-ui/src/app/components/common/input/tags/tags.component.spec.ts
@ -30,6 +30,7 @@ import { ColorComponent } from '../color/color.component'
 import { PermissionsFormComponent } from '../permissions/permissions-form/permissions-form.component'
 import { SelectComponent } from '../select/select.component'
 import { SettingsService } from 'src/app/services/settings.service'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const tags: Tag[] = [
  {
@ -99,6 +100,7 @@ describe('TagsComponent', () => {
        NgbModalModule,
        NgbAccordionModule,
        NgbPopoverModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/common/input/url/url.component.spec.ts
+++ b/src-ui/src/app/components/common/input/url/url.component.spec.ts
@ -5,6 +5,7 @@ import {
  NG_VALUE_ACCESSOR,
 } from '@angular/forms'
 import { UrlComponent } from './url.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('TextComponent', () => {
  let component: UrlComponent
@ -15,7 +16,11 @@ describe('TextComponent', () => {
    TestBed.configureTestingModule({
      declarations: [UrlComponent],
      providers: [],
-      imports: [FormsModule, ReactiveFormsModule],
+      imports: [
+        FormsModule,
+        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    fixture = TestBed.createComponent(UrlComponent)
--- a/src-ui/src/app/components/common/permissions-filter-dropdown/permissions-filter-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/permissions-filter-dropdown/permissions-filter-dropdown.component.spec.ts
@ -14,6 +14,7 @@ import {
 import { ClearableBadgeComponent } from '../clearable-badge/clearable-badge.component'
 import { SettingsService } from 'src/app/services/settings.service'
 import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const currentUserID = 13

@ -69,6 +70,7 @@ describe('PermissionsFilterDropdownComponent', () => {
        FormsModule,
        ReactiveFormsModule,
        NgbModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/common/permissions-select/permissions-select.component.spec.ts
+++ b/src-ui/src/app/components/common/permissions-select/permissions-select.component.spec.ts
@ -11,6 +11,7 @@ import {
  PermissionType,
 } from 'src/app/services/permissions.service'
 import { By } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const permissions = [
  'add_document',
@ -32,7 +33,12 @@ describe('PermissionsSelectComponent', () => {
    TestBed.configureTestingModule({
      declarations: [PermissionsSelectComponent],
      providers: [],
-      imports: [FormsModule, ReactiveFormsModule, NgbModule],
+      imports: [
+        FormsModule,
+        ReactiveFormsModule,
+        NgbModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    fixture = TestBed.createComponent(PermissionsSelectComponent)
--- a/src-ui/src/app/components/common/preview-popup/preview-popup.component.spec.ts
+++ b/src-ui/src/app/components/common/preview-popup/preview-popup.component.spec.ts
@ -8,6 +8,7 @@ import { SettingsService } from 'src/app/services/settings.service'
 import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { DocumentService } from 'src/app/services/rest/document.service'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const doc = {
  id: 10,
@ -25,7 +26,10 @@ describe('PreviewPopupComponent', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [PreviewPopupComponent, PdfViewerComponent, SafeUrlPipe],
-      imports: [HttpClientTestingModule],
+      imports: [
+        HttpClientTestingModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    })
    settingsService = TestBed.inject(SettingsService)
    documentService = TestBed.inject(DocumentService)
--- a/src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.spec.ts
+++ b/src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.spec.ts
@ -19,6 +19,7 @@ import { PasswordComponent } from '../input/password/password.component'
 import { of, throwError } from 'rxjs'
 import { ToastService } from 'src/app/services/toast.service'
 import { Clipboard } from '@angular/cdk/clipboard'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const profile = {
  email: 'foo@bar.com',
@ -49,6 +50,7 @@ describe('ProfileEditDialogComponent', () => {
        FormsModule,
        NgbModalModule,
        NgbAccordionModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    })
    profileService = TestBed.inject(ProfileService)
--- a/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.spec.ts
+++ b/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.spec.ts
@ -17,6 +17,7 @@ import { environment } from 'src/environments/environment'
 import { ShareLinksDropdownComponent } from './share-links-dropdown.component'
 import { Clipboard } from '@angular/cdk/clipboard'
 import { By } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('ShareLinksDropdownComponent', () => {
  let component: ShareLinksDropdownComponent
@ -29,7 +30,12 @@ describe('ShareLinksDropdownComponent', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [ShareLinksDropdownComponent],
-      imports: [HttpClientTestingModule, FormsModule, ReactiveFormsModule],
+      imports: [
+        HttpClientTestingModule,
+        FormsModule,
+        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    })

    fixture = TestBed.createComponent(ShareLinksDropdownComponent)
--- a/src-ui/src/app/components/common/toasts/toasts.component.spec.ts
+++ b/src-ui/src/app/components/common/toasts/toasts.component.spec.ts
@ -12,6 +12,7 @@ import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { of } from 'rxjs'
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
 import { Clipboard } from '@angular/cdk/clipboard'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const toasts = [
  {
@ -45,7 +46,11 @@ describe('ToastsComponent', () => {
  beforeEach(async () => {
    TestBed.configureTestingModule({
      declarations: [ToastsComponent],
-      imports: [HttpClientTestingModule, NgbModule],
+      imports: [
+        HttpClientTestingModule,
+        NgbModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
      providers: [
        {
          provide: ToastService,
--- a/src-ui/src/app/components/dashboard/dashboard.component.spec.ts
+++ b/src-ui/src/app/components/dashboard/dashboard.component.spec.ts
@ -21,6 +21,7 @@ import { ToastService } from 'src/app/services/toast.service'
 import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
 import { CdkDragDrop, DragDropModule } from '@angular/cdk/drag-drop'
 import { SavedView } from 'src/app/data/saved-view'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const saved_views = [
  {
@ -107,6 +108,7 @@ describe('DashboardComponent', () => {
        RouterTestingModule,
        TourNgBootstrapModule,
        DragDropModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.spec.ts
+++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.spec.ts
@ -30,6 +30,7 @@ import { By } from '@angular/platform-browser'
 import { SafeUrlPipe } from 'src/app/pipes/safeurl.pipe'
 import { DragDropModule } from '@angular/cdk/drag-drop'
 import { PreviewPopupComponent } from 'src/app/components/common/preview-popup/preview-popup.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const savedView: SavedView = {
  id: 1,
@ -94,6 +95,7 @@ describe('SavedViewWidgetComponent', () => {
        NgbModule,
        RouterTestingModule.withRoutes(routes),
        DragDropModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
@ -70,6 +70,7 @@ import { CustomFieldsDropdownComponent } from '../common/custom-fields-dropdown/
 import { CustomFieldDataType } from 'src/app/data/custom-field'
 import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
 import { PdfViewerComponent } from '../common/pdf-viewer/pdf-viewer.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const doc: Document = {
  id: 3,
@ -250,6 +251,7 @@ describe('DocumentDetailComponent', () => {
        FormsModule,
        ReactiveFormsModule,
        NgbModalModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-detail/metadata-collapse/metadata-collapse.component.spec.ts
+++ b/src-ui/src/app/components/document-detail/metadata-collapse/metadata-collapse.component.spec.ts
@ -1,6 +1,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { MetadataCollapseComponent } from './metadata-collapse.component'
 import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const metadata = [
  {
@ -25,7 +26,7 @@ describe('MetadataCollapseComponent', () => {
    TestBed.configureTestingModule({
      declarations: [MetadataCollapseComponent],
      providers: [],
-      imports: [NgbCollapseModule],
+      imports: [NgbCollapseModule, NgxBootstrapIconsModule.pick(allIcons)],
    }).compileComponents()

    fixture = TestBed.createComponent(MetadataCollapseComponent)
--- a/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.spec.ts
+++ b/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.spec.ts
@ -40,6 +40,7 @@ import { PermissionsGroupComponent } from '../../common/input/permissions/permis
 import { PermissionsUserComponent } from '../../common/input/permissions/permissions-user/permissions-user.component'
 import { NgSelectModule } from '@ng-select/ng-select'
 import { GroupService } from 'src/app/services/rest/group.service'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const selectionData: SelectionData = {
  selected_tags: [
@ -153,6 +154,7 @@ describe('BulkEditorComponent', () => {
        NgbModule,
        NgbModalModule,
        NgSelectModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts
+++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts
@ -20,6 +20,7 @@ import { SafeUrlPipe } from 'src/app/pipes/safeurl.pipe'
 import { DocumentCardLargeComponent } from './document-card-large.component'
 import { IsNumberPipe } from 'src/app/pipes/is-number.pipe'
 import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const doc = {
  id: 10,
@ -60,6 +61,7 @@ describe('DocumentCardLargeComponent', () => {
        NgbPopoverModule,
        NgbTooltipModule,
        NgbProgressbarModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts
@ -23,6 +23,7 @@ import { TagComponent } from '../../common/tag/tag.component'
 import { Tag } from 'src/app/data/tag'
 import { IsNumberPipe } from 'src/app/pipes/is-number.pipe'
 import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const doc = {
  id: 10,
@ -74,6 +75,7 @@ describe('DocumentCardSmallComponent', () => {
        NgbPopoverModule,
        NgbTooltipModule,
        NgbProgressbarModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-list/document-list.component.spec.ts
+++ b/src-ui/src/app/components/document-list/document-list.component.spec.ts
@ -63,6 +63,7 @@ import { PermissionsGuard } from 'src/app/guards/permissions.guard'
 import { SettingsService } from 'src/app/services/settings.service'
 import { SETTINGS_KEYS } from 'src/app/data/ui-settings'
 import { IsNumberPipe } from 'src/app/pipes/is-number.pipe'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const docs: Document[] = [
  {
@ -146,6 +147,7 @@ describe('DocumentListComponent', () => {
        NgbDatepickerModule,
        NgbPopoverModule,
        NgbTooltipModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.spec.ts
+++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.spec.ts
@ -77,6 +77,7 @@ import {
  OwnerFilterType,
 } from '../../common/permissions-filter-dropdown/permissions-filter-dropdown.component'
 import { FilterEditorComponent } from './filter-editor.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const tags: Tag[] = [
  {
@ -191,6 +192,7 @@ describe('FilterEditorComponent', () => {
        FormsModule,
        ReactiveFormsModule,
        NgbDatepickerModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/document-notes/document-notes.component.spec.ts
+++ b/src-ui/src/app/components/document-notes/document-notes.component.spec.ts
@ -13,6 +13,7 @@ import { DatePipe } from '@angular/common'
 import { By } from '@angular/platform-browser'
 import { PermissionsService } from 'src/app/services/permissions.service'
 import { FormsModule, ReactiveFormsModule } from '@angular/forms'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const notes: DocumentNote[] = [
  {
@ -84,7 +85,12 @@ describe('DocumentNotesComponent', () => {
        CustomDatePipe,
        DatePipe,
      ],
-      imports: [HttpClientTestingModule, FormsModule, ReactiveFormsModule],
+      imports: [
+        HttpClientTestingModule,
+        FormsModule,
+        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    notesService = TestBed.inject(DocumentNotesService)
--- a/src-ui/src/app/components/manage/correspondent-list/correspondent-list.component.spec.ts
+++ b/src-ui/src/app/components/manage/correspondent-list/correspondent-list.component.spec.ts
@ -9,6 +9,7 @@ import { PageHeaderComponent } from '../../common/page-header/page-header.compon
 import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
 import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
 import { of } from 'rxjs'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('CorrespondentListComponent', () => {
  let component: CorrespondentListComponent
@ -29,6 +30,7 @@ describe('CorrespondentListComponent', () => {
        NgbPaginationModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()
    correspondentsService = TestBed.inject(CorrespondentService)
--- a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.spec.ts
+++ b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.spec.ts
@ -20,6 +20,7 @@ import { ToastService } from 'src/app/services/toast.service'
 import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
 import { PageHeaderComponent } from '../../common/page-header/page-header.component'
 import { CustomFieldEditDialogComponent } from '../../common/edit-dialog/custom-field-edit-dialog/custom-field-edit-dialog.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const fields: CustomField[] = [
  {
@ -66,6 +67,7 @@ describe('CustomFieldsComponent', () => {
        ReactiveFormsModule,
        NgbModalModule,
        NgbPopoverModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    })

--- a/src-ui/src/app/components/manage/document-type-list/document-type-list.component.spec.ts
+++ b/src-ui/src/app/components/manage/document-type-list/document-type-list.component.spec.ts
@ -9,6 +9,7 @@ import { IfPermissionsDirective } from 'src/app/directives/if-permissions.direct
 import { of } from 'rxjs'
 import { DocumentTypeListComponent } from './document-type-list.component'
 import { DocumentTypeService } from 'src/app/services/rest/document-type.service'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('DocumentTypeListComponent', () => {
  let component: DocumentTypeListComponent
@ -29,6 +30,7 @@ describe('DocumentTypeListComponent', () => {
        NgbPaginationModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/manage/mail/mail.component.spec.ts
+++ b/src-ui/src/app/components/manage/mail/mail.component.spec.ts
@ -40,6 +40,7 @@ import { ToastService } from 'src/app/services/toast.service'
 import { TagsComponent } from '../../common/input/tags/tags.component'
 import { FormsModule, ReactiveFormsModule } from '@angular/forms'
 import { EditDialogMode } from '../../common/edit-dialog/edit-dialog.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const mailAccounts = [
  { id: 1, name: 'account1' },
@ -91,6 +92,7 @@ describe('MailComponent', () => {
        ReactiveFormsModule,
        NgbAlertModule,
        NgSelectModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/manage/management-list/management-list.component.spec.ts
+++ b/src-ui/src/app/components/manage/management-list/management-list.component.spec.ts
@ -36,6 +36,7 @@ import { MATCH_AUTO } from 'src/app/data/matching-model'
 import { MATCH_NONE } from 'src/app/data/matching-model'
 import { MATCH_LITERAL } from 'src/app/data/matching-model'
 import { PermissionsDialogComponent } from '../../common/permissions-dialog/permissions-dialog.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const tags: Tag[] = [
  {
@ -94,6 +95,7 @@ describe('ManagementListComponent', () => {
        ReactiveFormsModule,
        NgbModalModule,
        RouterTestingModule.withRoutes(routes),
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.spec.ts
+++ b/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.spec.ts
@ -9,6 +9,7 @@ import { SortableDirective } from 'src/app/directives/sortable.directive'
 import { StoragePathService } from 'src/app/services/rest/storage-path.service'
 import { PageHeaderComponent } from '../../common/page-header/page-header.component'
 import { StoragePathListComponent } from './storage-path-list.component'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('StoragePathListComponent', () => {
  let component: StoragePathListComponent
@ -29,6 +30,7 @@ describe('StoragePathListComponent', () => {
        NgbPaginationModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/manage/tag-list/tag-list.component.spec.ts
+++ b/src-ui/src/app/components/manage/tag-list/tag-list.component.spec.ts
@ -10,6 +10,7 @@ import { TagService } from 'src/app/services/rest/tag.service'
 import { PageHeaderComponent } from '../../common/page-header/page-header.component'
 import { TagListComponent } from './tag-list.component'
 import { SafeHtmlPipe } from 'src/app/pipes/safehtml.pipe'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('TagListComponent', () => {
  let component: TagListComponent
@ -31,6 +32,7 @@ describe('TagListComponent', () => {
        NgbPaginationModule,
        FormsModule,
        ReactiveFormsModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    }).compileComponents()

--- a/src-ui/src/app/components/manage/workflows/workflows.component.spec.ts
+++ b/src-ui/src/app/components/manage/workflows/workflows.component.spec.ts
@ -24,6 +24,7 @@ import {
  WorkflowTriggerType,
 } from 'src/app/data/workflow-trigger'
 import { WorkflowActionType } from 'src/app/data/workflow-action'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 const workflows: Workflow[] = [
  {
@ -101,6 +102,7 @@ describe('WorkflowsComponent', () => {
        ReactiveFormsModule,
        NgbModalModule,
        NgbPopoverModule,
+        NgxBootstrapIconsModule.pick(allIcons),
      ],
    })

--- a/src-ui/src/app/components/not-found/not-found.component.spec.ts
+++ b/src-ui/src/app/components/not-found/not-found.component.spec.ts
@ -3,6 +3,7 @@ import { NotFoundComponent } from './not-found.component'
 import { By } from '@angular/platform-browser'
 import { LogoComponent } from '../common/logo/logo.component'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'

 describe('NotFoundComponent', () => {
  let component: NotFoundComponent
@ -11,7 +12,10 @@ describe('NotFoundComponent', () => {
  beforeEach(async () => {
    TestBed.configureTestingModule({
      declarations: [NotFoundComponent, LogoComponent],
-      imports: [HttpClientTestingModule],
+      imports: [
+        HttpClientTestingModule,
+        NgxBootstrapIconsModule.pick(allIcons),
+      ],
    }).compileComponents()

    fixture = TestBed.createComponent(NotFoundComponent)