fix: adapt SearchConfig interface and use the type PrimeIcon for icons

libs/portal-integration-angular/src/index.ts

@@ -128,3 +128,4 @@ export * from './lib/core/utils/add-initialize-module-guard.utils'
 export * from './lib/core/utils/translate-service-initializer.utils'
 export * from './lib/core/utils/portal-api-configuration.utils'
 export * from './lib/core/utils/caching-translate-loader.utils'
+export * from './lib/core/utils/primeicon.utils'

libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.html

@@ -1,25 +1,25 @@
 <div>
-    <ng-container #container></ng-container>
-    <ng-content></ng-content>
-    <div class="w-full flex justify-content-end mb-3">
-        <button
-            id="buttonDialogSecondaryButton"
-            pButton 
-            *ngIf="dialogData.config.secondaryButtonIncluded"
-            class="mx-2"
-            [icon]="dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''"
-            (click)="secondaryButtonAction()"
-            [label]="dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters"
-            [disabled]="secondaryButtonDisabled$ | async"
-        ></button>
-        <button 
-            id="buttonDialogPrimaryButton"
-            pButton
-            class="mx-2"
-            [icon]="dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''"
-            (click)="primaryButtonAction()"
-            [label]="dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters"
-            [disabled]="primaryButtonDisabled$ | async"
-        ></button>
-    </div>
-</div>
+  <ng-container #container></ng-container>
+  <ng-content></ng-content>
+  <div class="w-full flex justify-content-end mb-3">
+    <button
+      id="buttonDialogSecondaryButton"
+      pButton
+      *ngIf="dialogData.config.secondaryButtonIncluded"
+      class="mx-2"
+      [icon]="dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''"
+      (click)="secondaryButtonAction()"
+      [label]="dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters"
+      [disabled]="secondaryButtonDisabled$ | async"
+    ></button>
+    <button
+      id="buttonDialogPrimaryButton"
+      pButton
+      class="mx-2"
+      [icon]="dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''"
+      (click)="primaryButtonAction()"
+      [label]="dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters"
+      [disabled]="primaryButtonDisabled$ | async"
+    ></button>
+  </div>
+</div>

libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts

@@ -1,8 +1,9 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
 import { PrimeIcons } from 'primeng/api'
+import { PrimeIcon } from '../../utils/primeicon.utils'
 
 interface ViewingLayouts {
-  icon: PrimeIcons
+  icon: PrimeIcon
   layout: 'grid' | 'list' | 'table'
   title?: string
   titleKey: string
@@ -39,7 +40,7 @@ export class DataLayoutSelectionComponent implements OnInit {
     this.layout = 'table'
   }
 
-  onDataViewLayoutChange(event: { icon: PrimeIcons; layout: 'grid' | 'list' | 'table' }): void {
+  onDataViewLayoutChange(event: { icon: PrimeIcon; layout: 'grid' | 'list' | 'table' }): void {
     this.dataViewLayoutChange.emit(event.layout)
   }
 }

libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts

@@ -6,15 +6,22 @@ import { ColumnViewTemplate } from '../../../model/column-view-template'
 import { ColumnTogglerComponent } from './column-toggler-component/column-toggler.component'
 import { ViewTemplatePickerComponent } from './view-template-picker/view-template-picker.component'
 import { PrimeIcons } from 'primeng/api'
+import { PrimeIcon } from '../../utils/primeicon.utils'
 
 interface ViewingModes {
-  icon: PrimeIcons
+  icon: PrimeIcon
   mode: string
   title?: string
   titleKey?: string
 }
 
-const ALL_VIEW_MODES = [
+type ViewMode = {
+  icon: PrimeIcon
+  mode: string
+  titleKey: string
+}
+
+const ALL_VIEW_MODES: ViewMode[] = [
   { icon: PrimeIcons.LIST, mode: 'list', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.LIST' },
   { icon: PrimeIcons.TH_LARGE, mode: 'grid', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.GRID' },
   { icon: PrimeIcons.TABLE, mode: 'table', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.TABLE' },
@@ -249,7 +256,7 @@ export class DataViewControlsComponent implements OnInit, OnChanges {
       })
   }
 
-  viewModeChange(event: { icon: PrimeIcons; mode: string }): void {
+  viewModeChange(event: { icon: PrimeIcon; mode: string }): void {
     this.dataViewChange.emit(event.mode)
     this.enableToggleColumnButton(event.mode)
   }

libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts

@@ -6,24 +6,33 @@ import { PrimeIcons } from 'primeng/api'
 import { DiagramData } from '../../../model/diagram-data'
 import { DiagramType } from '../../../model/diagram-type'
 import { ColorUtils } from '../../utils/colorutils'
+import { PrimeIcon } from '../../utils/primeicon.utils'
 
 export interface DiagramLayouts {
-  icon: PrimeIcons
+  icon: PrimeIcon
   layout: DiagramType
   title?: string
   titleKey: string
 }
 
 const allDiagramTypes: DiagramLayouts[] = [
   { icon: PrimeIcons.CHART_PIE, layout: DiagramType.PIE, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.PIE' },
-  { icon: PrimeIcons.BARS, layout: DiagramType.HORIZONTAL_BAR, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.HORIZONTAL_BAR' },
-  { icon: PrimeIcons.CHART_BAR, layout: DiagramType.VERTICAL_BAR, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.VERTICAL_BAR' },
+  {
+    icon: PrimeIcons.BARS,
+    layout: DiagramType.HORIZONTAL_BAR,
+    titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.HORIZONTAL_BAR',
+  },
+  {
+    icon: PrimeIcons.CHART_BAR,
+    layout: DiagramType.VERTICAL_BAR,
+    titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.VERTICAL_BAR',
+  },
 ]
 
 @Component({
   selector: 'ocx-diagram',
   templateUrl: './diagram.component.html',
-  styleUrls: ['./diagram.component.scss']
+  styleUrls: ['./diagram.component.scss'],
 })
 export class DiagramComponent implements OnInit, OnChanges {
   @Input() data: DiagramData[] | undefined
@@ -41,7 +50,7 @@ export class DiagramComponent implements OnInit, OnChanges {
     this.chartType = this.diagramTypeToChartType(value)
   }
   private _supportedDiagramTypes: DiagramType[] = []
-  @Input() 
+  @Input()
   get supportedDiagramTypes(): DiagramType[] {
     return this._supportedDiagramTypes
   }

libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.spec.ts

@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed, getTestBed } from '@angular/core/testing'
-import { Action, PageHeaderComponent } from './page-header.component'
+import { Action, ObjectDetailItem, PageHeaderComponent } from './page-header.component'
 import { RouterTestingModule } from '@angular/router/testing'
 import { ConfigurationService } from '../../../services/configuration.service'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
@@ -115,22 +115,14 @@ describe('PageHeaderComponent', () => {
   })
 
   it('should check permissions and render buttons accordingly', async () => {
-    expect(
-      await pageHeaderHarness.getInlineActionButtons()
-    ).toHaveLength(0)
-    expect(
-      await pageHeaderHarness.getOverflowActionButtons()
-    ).toHaveLength(0)
+    expect(await pageHeaderHarness.getInlineActionButtons()).toHaveLength(0)
+    expect(await pageHeaderHarness.getOverflowActionButtons()).toHaveLength(0)
 
     component.actions = mockActions
 
-    expect(
-      await pageHeaderHarness.getInlineActionButtons()
-    ).toHaveLength(1)
+    expect(await pageHeaderHarness.getInlineActionButtons()).toHaveLength(1)
     expect(await pageHeaderHarness.getElementByTitle('My Test Action')).toBeTruthy()
-    expect(
-      await pageHeaderHarness.getOverflowActionButtons()
-    ).toHaveLength(1)
+    expect(await pageHeaderHarness.getOverflowActionButtons()).toHaveLength(1)
     expect(await pageHeaderHarness.getElementByTitle('More actions')).toBeTruthy()
     expect(userServiceSpy).toHaveBeenCalledTimes(3)
   })
@@ -140,27 +132,19 @@ describe('PageHeaderComponent', () => {
 
     userServiceSpy.mockReturnValue(false)
 
-    expect(
-      await pageHeaderHarness.getInlineActionButtons()
-    ).toHaveLength(0)
-    expect(
-      await pageHeaderHarness.getOverflowActionButtons()
-    ).toHaveLength(0)
+    expect(await pageHeaderHarness.getInlineActionButtons()).toHaveLength(0)
+    expect(await pageHeaderHarness.getOverflowActionButtons()).toHaveLength(0)
 
     component.actions = mockActions
 
-    expect(
-      await pageHeaderHarness.getInlineActionButtons()
-    ).toHaveLength(0)
+    expect(await pageHeaderHarness.getInlineActionButtons()).toHaveLength(0)
     expect(await pageHeaderHarness.getElementByTitle('My Test Action')).toBeFalsy()
-    expect(
-      await pageHeaderHarness.getOverflowActionButtons()
-    ).toHaveLength(0)
+    expect(await pageHeaderHarness.getOverflowActionButtons()).toHaveLength(0)
     expect(await pageHeaderHarness.getElementByTitle('More actions')).toBeFalsy()
     expect(userServiceSpy).toHaveBeenCalledTimes(3)
   })
 
-  it("should render objectDetails as object info in the page header", async () => {
+  it('should render objectDetails as object info in the page header', async () => {
     const objectDetailsWithoutIcons = [
       {
         label: 'Venue',
@@ -174,7 +158,7 @@ describe('PageHeaderComponent', () => {
     expect((await pageHeaderHarness.getObjectInfos()).length).toEqual(0)
 
     component.objectDetails = objectDetailsWithoutIcons
-    
+
     expect((await pageHeaderHarness.getObjectInfos()).length).toEqual(2)
     const objectDetailLabels = await pageHeaderHarness.getObjectDetailLabels()
     const objectDetailValues = await pageHeaderHarness.getObjectDetailValues()
@@ -192,29 +176,29 @@ describe('PageHeaderComponent', () => {
     })
   })
 
-  it("should render objectDetails with icons as object info in the page header", async () => {
-    const objectDetailsWithIcons = [
+  it('should render objectDetails with icons as object info in the page header', async () => {
+    const objectDetailsWithIcons: ObjectDetailItem[] = [
       {
         label: 'Venue',
         value: 'AIE Munich',
       },
       {
         label: 'Status',
         value: 'Confirmed',
-        icon: PrimeIcons.CHECK
+        icon: PrimeIcons.CHECK,
       },
       {
         label: 'Done?',
-        icon: PrimeIcons.EXCLAMATION_CIRCLE
+        icon: PrimeIcons.EXCLAMATION_CIRCLE,
       },
       {
-        label: 'Empty'
-      }
+        label: 'Empty',
+      },
     ]
     expect((await pageHeaderHarness.getObjectInfos()).length).toEqual(0)
 
     component.objectDetails = objectDetailsWithIcons
-    
+
     expect((await pageHeaderHarness.getObjectInfos()).length).toEqual(4)
     const objectDetailLabels = await pageHeaderHarness.getObjectDetailLabels()
     const objectDetailValues = await pageHeaderHarness.getObjectDetailValues()
@@ -228,7 +212,7 @@ describe('PageHeaderComponent', () => {
     })
 
     objectDetailValues.forEach(async (value, i) => {
-      if(objectDetailsWithIcons[i].value) {
+      if (objectDetailsWithIcons[i].value) {
         expect(await value.text()).toEqual(objectDetailsWithIcons[i].value)
       }
     })
@@ -248,8 +232,8 @@ describe('PageHeaderComponent', () => {
 
     const menuItems = await pageHeaderHarness.getOverFlowMenuItems()
     expect(menuItems.length).toBe(2)
-    expect(await menuItems[0].getText()).toBe("My Test Overflow Action")
-    expect(await menuItems[1].getText()).toBe("My Test Overflow Disabled Action")
+    expect(await menuItems[0].getText()).toBe('My Test Overflow Action')
+    expect(await menuItems[1].getText()).toBe('My Test Overflow Disabled Action')
   })
 
   it('should use provided action callback on overflow button click', async () => {
@@ -258,15 +242,15 @@ describe('PageHeaderComponent', () => {
     component.actions = mockActions
 
     const menuOverflowButtons = await pageHeaderHarness.getOverflowActionButtons()
-    
+
     expect(menuOverflowButtons).toBeTruthy()
     expect(menuOverflowButtons.length).toBe(1)
     await menuOverflowButtons[0].click()
 
     const menuItems = await pageHeaderHarness.getOverFlowMenuItems()
     expect(menuItems.length).toBe(2)
     const enabledActionElement = await menuItems[0].host()
-    expect(await(enabledActionElement.hasClass('p-disabled'))).toBe(false)
+    expect(await enabledActionElement.hasClass('p-disabled')).toBe(false)
     await enabledActionElement.click()
     expect(console.log).toHaveBeenCalledTimes(1)
   })
@@ -283,7 +267,7 @@ describe('PageHeaderComponent', () => {
 
     const overFlowMenuItems = await pageHeaderHarness.getOverFlowMenuItems()
     const disabledActionElement = overFlowMenuItems[1]
-    
+
     expect(overFlowMenuItems).toBeTruthy()
     expect(overFlowMenuItems?.length).toBe(2)
     expect(disabledActionElement).toBeTruthy()

libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts

@@ -17,6 +17,7 @@ import { BreadcrumbService } from '../../../services/breadcrumb.service'
 import { TranslateService } from '@ngx-translate/core'
 import { AppStateService } from '../../../services/app-state.service'
 import { UserService } from '../../../services/user.service'
+import { PrimeIcon } from '../../utils/primeicon.utils'
 
 /**
  * Action definition.
@@ -46,7 +47,7 @@ export interface ObjectDetailItem {
   label: string
   value?: string
   tooltip?: string
-  icon?: PrimeIcons
+  icon?: PrimeIcon
   labelPipe?: Type<any>
   valuePipe?: Type<any>
   valuePipeArgs?: string

libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts

@@ -34,16 +34,16 @@ describe('SearchConfigComponent', () => {
     {
       id: '01',
       name: 'Basic search config',
-      version: 1,
-      readonly: true,
+      fieldListVersion: 1,
+      isReadonly: true,
       isAdvanced: true,
       values: searchConfigurations[0],
     },
     {
       id: '02',
       name: 'Adapted search config',
-      version: 1,
-      readonly: true,
+      fieldListVersion: 1,
+      isReadonly: true,
       isAdvanced: true,
       values: searchConfigurations[1],
     },

libs/portal-integration-angular/src/lib/core/utils/primeicon.utils.ts

@@ -0,0 +1,5 @@
+import { PrimeIcons } from 'primeng/api'
+/**
+ * @example let myIcon : PrimeIcon = PrimeIcons.myIcon
+ */
+export type PrimeIcon = (typeof PrimeIcons)[keyof Omit<typeof PrimeIcons, 'prototype'>]

libs/portal-integration-angular/src/lib/model/button-dialog.ts

@@ -1,5 +1,5 @@
 import { Type } from '@angular/core'
-import { PrimeIcons } from 'primeng/api'
+import { PrimeIcon } from '../core/utils/primeicon.utils'
 
 /**
  * Object describing details for button rendering containing key for translation, optional icon and optional parameters for translation
@@ -22,7 +22,7 @@ import { PrimeIcons } from 'primeng/api'
  */
 export interface ButtonDialogButtonDetails {
   key: string
-  icon?: PrimeIcons
+  icon?: PrimeIcon
   parameters?: Record<string, unknown>
 }
 

libs/portal-integration-angular/src/lib/model/search-config.ts

@@ -2,8 +2,8 @@ export type SearchConfigPrimitive = string | number | bigint | boolean | Date |
 export interface SearchConfig {
   id: string
   name: string
-  version: number
-  readonly: boolean
+  fieldListVersion: number
+  isReadonly: boolean
   isAdvanced: boolean
   values: Record<string, SearchConfigPrimitive>
 }