From 186fae874a752f734b87c45d35a9c4c5c0e79bc2 Mon Sep 17 00:00:00 2001
From: Bastian Jakobi <55296998+bastianjakobi@users.noreply.github.com>
Date: Tue, 27 Feb 2024 11:58:05 +0100
Subject: [PATCH 1/6] refactor: migrate icons in TS to PrimeIcons (#151)

* refactor: migrate all custom icons in ts to PrimeIcons

* fix: fix remaining types
---
 .../button-dialog.component.spec.ts             | 17 +++++++++--------
 .../data-layout-selection.component.ts          | 11 ++++++-----
 .../data-list-grid/data-list-grid.component.ts  |  8 ++++----
 .../data-view-controls.component.ts             | 11 ++++++-----
 .../components/diagram/diagram.component.ts     |  2 +-
 .../page-header.component.stories.ts            |  4 ++--
 .../page-header/page-header.component.ts        |  4 ++--
 .../portal-header/header.component.html         |  2 +-
 .../portal-header/header.component.ts           | 13 +++++++------
 .../src/lib/model/button-dialog.ts              |  3 ++-
 .../lib/services/portal-dialog.service.spec.ts  | 17 +++++++++--------
 .../src/lib/services/portal-dialog.service.ts   |  3 ++-
 .../testing/data-layout-selection.harness.ts    |  9 +++++----
 13 files changed, 56 insertions(+), 48 deletions(-)

diff --git a/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.spec.ts
index 58894c26..47995ce2 100644
--- a/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.spec.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.spec.ts
@@ -9,6 +9,7 @@ import { ButtonDialogComponent } from './button-dialog.component'
 import { MockAuthModule } from '../../../mock-auth/mock-auth.module'
 import { ButtonDialogHarness, DivHarness } from '../../../../../testing'
 import { ButtonDialogConfig } from '../../../model/button-dialog'
+import { PrimeIcons } from 'primeng/api'
 
 @Component({
   template: `<ocx-button-dialog>
@@ -20,12 +21,12 @@ class TestBaseHostComponent {}
 const config: ButtonDialogConfig = {
   primaryButtonDetails: {
     key: 'inlineMain',
-    icon: 'pi pi-plus',
+    icon: PrimeIcons.PLUS,
   },
   secondaryButtonIncluded: true,
   secondaryButtonDetails: {
     key: 'inlineSide',
-    icon: 'pi pi-times',
+    icon: PrimeIcons.TIMES,
   },
 }
 
@@ -121,12 +122,12 @@ describe('ButtonDialogComponent', () => {
       component.dialogData.config = {
         primaryButtonDetails: {
           key: 'CustomMain',
-          icon: 'pi pi-check',
+          icon: PrimeIcons.CHECK,
         },
         secondaryButtonIncluded: true,
         secondaryButtonDetails: {
           key: 'CustomSide',
-          icon: 'pi pi-times',
+          icon: PrimeIcons.TIMES,
         },
       }
 
@@ -134,8 +135,8 @@ describe('ButtonDialogComponent', () => {
       expect(await buttonDialogHarness.getPrimaryButtonLabel()).toBe('CustomMain')
       expect(await buttonDialogHarness.getSecondaryButtonLabel()).toBe('CustomSide')
       // expect correct icon
-      expect(await buttonDialogHarness.getPrimaryButtonIcon()).toBe('pi pi-check')
-      expect(await buttonDialogHarness.getSecondaryButtonIcon()).toBe('pi pi-times')
+      expect(await buttonDialogHarness.getPrimaryButtonIcon()).toBe(PrimeIcons.CHECK)
+      expect(await buttonDialogHarness.getSecondaryButtonIcon()).toBe(PrimeIcons.TIMES)
     })
 
     it('should translate button keys', async () => {
@@ -317,9 +318,9 @@ describe('ButtonDialogComponent', () => {
       buttonDialogHarness = await harnessLoader.getHarness(ButtonDialogHarness)
 
       expect(await buttonDialogHarness.getPrimaryButtonLabel()).toBe('inlineMain')
-      expect(await buttonDialogHarness.getPrimaryButtonIcon()).toBe('pi pi-plus')
+      expect(await buttonDialogHarness.getPrimaryButtonIcon()).toBe(PrimeIcons.PLUS)
       expect(await buttonDialogHarness.getSecondaryButtonLabel()).toBe('inlineSide')
-      expect(await buttonDialogHarness.getSecondaryButtonIcon()).toBe('pi pi-times')
+      expect(await buttonDialogHarness.getSecondaryButtonIcon()).toBe(PrimeIcons.TIMES)
     })
 
     it('should use default emitter inline', async () => {
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts
index 4580be60..1c2cf7e7 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts
@@ -1,16 +1,17 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { PrimeIcons } from 'primeng/api'
 
 interface ViewingLayouts {
-  icon: string
+  icon: PrimeIcons
   layout: 'grid' | 'list' | 'table'
   title?: string
   titleKey: string
 }
 
 const ALL_VIEW_LAYOUTS: ViewingLayouts[] = [
-  { icon: 'pi pi-list', layout: 'list', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.LIST' },
-  { icon: 'pi pi-th-large', layout: 'grid', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.GRID' },
-  { icon: 'pi pi-table', layout: 'table', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.TABLE' },
+  { icon: PrimeIcons.LIST, layout: 'list', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.LIST' },
+  { icon: PrimeIcons.TH_LARGE, layout: 'grid', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.GRID' },
+  { icon: PrimeIcons.TABLE, layout: 'table', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.TABLE' },
 ]
 
 @Component({
@@ -38,7 +39,7 @@ export class DataLayoutSelectionComponent implements OnInit {
     this.layout = 'table'
   }
 
-  onDataViewLayoutChange(event: { icon: string; layout: 'grid' | 'list' | 'table' }): void {
+  onDataViewLayoutChange(event: { icon: PrimeIcons; layout: 'grid' | 'list' | 'table' }): void {
     this.dataViewLayoutChange.emit(event.layout)
   }
 }
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-list-grid/data-list-grid.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-list-grid/data-list-grid.component.ts
index bef9b8c6..c2c162b7 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-list-grid/data-list-grid.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/data-list-grid/data-list-grid.component.ts
@@ -13,7 +13,7 @@ import {
 } from '@angular/core'
 import { Router } from '@angular/router'
 import { TranslateService } from '@ngx-translate/core'
-import { MenuItem } from 'primeng/api'
+import { MenuItem, PrimeIcons } from 'primeng/api'
 import { BehaviorSubject, Observable, combineLatest, map, mergeMap } from 'rxjs'
 import { DataAction } from '../../../model/data-action'
 import { DataSortDirection } from '../../../model/data-sort-direction'
@@ -259,21 +259,21 @@ export class DataListGridComponent extends DataSortBase implements OnInit, DoChe
         if (this.viewItem.observed && this.userService.hasPermission(this.viewPermission || '')) {
           menuItems.push({
             label: translations[this.viewMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.VIEW'],
-            icon: 'pi pi-eye',
+            icon: PrimeIcons.EYE,
             command: () => this.viewItem.emit(this.selectedItem),
           })
         }
         if (this.editItem.observed && this.userService.hasPermission(this.editPermission || '')) {
           menuItems.push({
             label: translations[this.editMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.EDIT'],
-            icon: 'pi pi-pencil',
+            icon: PrimeIcons.PENCIL,
             command: () => this.editItem.emit(this.selectedItem),
           })
         }
         if (this.deleteItem.observed && this.userService.hasPermission(this.deletePermission || '')) {
           menuItems.push({
             label: translations[this.deleteMenuItemKey || 'OCX_DATA_LIST_GRID.MENU.DELETE'],
-            icon: 'pi pi-trash',
+            icon: PrimeIcons.TRASH,
             command: () => this.deleteItem.emit(this.selectedItem),
           })
         }
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts
index 4fa3ff11..c9f6e7ca 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts
@@ -5,18 +5,19 @@ import { Column } from '../../../model/column'
 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'
 
 interface ViewingModes {
-  icon: string
+  icon: PrimeIcons
   mode: string
   title?: string
   titleKey?: string
 }
 
 const ALL_VIEW_MODES = [
-  { icon: 'pi pi-list', mode: 'list', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.LIST' },
-  { icon: 'pi pi-th-large', mode: 'grid', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.GRID' },
-  { icon: 'pi pi-table', mode: 'table', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.TABLE' },
+  { 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' },
 ]
 
 interface DefaultColumnDefinition {
@@ -248,7 +249,7 @@ export class DataViewControlsComponent implements OnInit, OnChanges {
       })
   }
 
-  viewModeChange(event: { icon: string; mode: string }): void {
+  viewModeChange(event: { icon: PrimeIcons; mode: string }): void {
     this.dataViewChange.emit(event.mode)
     this.enableToggleColumnButton(event.mode)
   }
diff --git a/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts b/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
index 55577114..4d8c873f 100644
--- a/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
@@ -8,7 +8,7 @@ import { DiagramType } from '../../../model/diagram-type'
 import { ColorUtils } from '../../utils/colorutils'
 
 export interface DiagramLayouts {
-  icon: string
+  icon: PrimeIcons
   layout: DiagramType
   title?: string
   titleKey: string
diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.stories.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.stories.ts
index 0db7d61c..d5a91c90 100644
--- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.stories.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.stories.ts
@@ -65,7 +65,7 @@ const demoActions: Action[] = [
     },
     title: 'Tooltip for Reload',
     show: 'always',
-    icon: 'pi pi-refresh',
+    icon: PrimeIcons.REFRESH,
   },
   {
     label: 'Delete',
@@ -75,7 +75,7 @@ const demoActions: Action[] = [
     },
     title: 'Tooltip for Delete',
     show: 'always',
-    icon: 'pi pi-trash',
+    icon: PrimeIcons.TRASH,
   },
   {
     label: 'Some action',
diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts
index 490c8404..59e480f9 100644
--- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts
@@ -124,8 +124,8 @@ export class PageHeaderComponent implements OnInit, OnChanges {
   ) {
     this.breadcrumbs = breadcrumbs
     this.home$ = concat(
-      of({ icon: 'pi pi-home', routerLink: '/' }),
-      this.appStateService.currentPortal$.pipe(map((portal) => ({ icon: 'pi pi-home', routerLink: portal.baseUrl })))
+      of({ icon: PrimeIcons.HOME, routerLink: '/' }),
+      this.appStateService.currentPortal$.pipe(map((portal) => ({ icon: PrimeIcons.HOME, routerLink: portal.baseUrl })))
     )
   }
   ngOnChanges(changes: SimpleChanges): void {
diff --git a/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.html b/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.html
index 585bb609..6f839c5a 100644
--- a/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.html
+++ b/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.html
@@ -62,7 +62,7 @@
                 [pTooltip]="item.label || ''"
                 tooltipPosition="bottom"
               >
-                <i [ngClass]="'pi-' + item.icon || ''" class="pi fs-large"></i>
+                <i [ngClass]="item.icon || ''" class="fs-large"></i>
               </a>
             </li>
           </ng-container>
diff --git a/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.ts b/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.ts
index 94a764fd..4fff49b1 100644
--- a/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/portal-header/header.component.ts
@@ -14,6 +14,7 @@ import { ThemeService } from '../../../services/theme.service'
 import { ImageLogoUrlUtils } from '../../utils/image-logo-url.utils'
 import { UserService } from '../../../services/user.service'
 import { AppStateService } from '../../../services/app-state.service'
+import { PrimeIcons } from 'primeng/api'
 
 type MenuItemPerm = MenuItem & { permission: string }
 @Component({
@@ -137,42 +138,42 @@ export class HeaderComponent implements OnInit {
     this.moreMenuItems = [
       {
         command: (e) => this.onOpenFeedback(e),
-        icon: 'comment',
+        icon: PrimeIcons.COMMENT,
         label: 'Feedback',
         disabled: this.feedbackDisabled,
         permission: 'PORTAL_HEADER_GIVE_FEEDBACK#VIEW',
       },
       {
         command: (e) => this.onAddToFavourites(e),
-        icon: 'star',
+        icon: PrimeIcons.STAR,
         label: 'Add to Favorites',
         disabled: this.favoritesDisabled,
         permission: 'PORTAL_HEADER_ADD_TO_MY_FAVORITES#VIEW',
       },
       {
         command: (e) => this.onOpenSupportTicket(e),
-        icon: 'ticket',
+        icon: PrimeIcons.TICKET,
         label: 'Create Support Ticket',
         disabled: this.supportTicketDisabled,
         permission: 'PORTAL_HEADER_CREATE_SUPPORT_TICKET#VIEW',
       },
       {
         command: (e) => this.onTopbarItemClick(e, 'search'),
-        icon: 'search',
+        icon: PrimeIcons.SEARCH,
         label: 'Search',
         disabled: this.searchDisabled,
         permission: 'PORTAL_HEADER_ENTERPRISE_SEARCH#VIEW',
       },
       {
         command: (e) => this.onOpenHelpPage(e),
-        icon: 'question-circle',
+        icon: PrimeIcons.QUESTION_CIRCLE,
         label: 'Show Help for this article',
         disabled: this.helpDisabled,
         permission: 'PORTAL_HEADER_HELP#VIEW',
       },
       {
         command: (e) => this.onOpenHelpPageEditor(e),
-        icon: 'pencil',
+        icon: PrimeIcons.PENCIL,
         label: 'Edit Help for this article',
         disabled: this.helpEditorDisabled,
         permission: 'PORTAL_HEADER_HELP_ITEM_EDITOR#VIEW',
diff --git a/libs/portal-integration-angular/src/lib/model/button-dialog.ts b/libs/portal-integration-angular/src/lib/model/button-dialog.ts
index 9abb4994..ee383173 100644
--- a/libs/portal-integration-angular/src/lib/model/button-dialog.ts
+++ b/libs/portal-integration-angular/src/lib/model/button-dialog.ts
@@ -1,4 +1,5 @@
 import { Type } from '@angular/core'
+import { PrimeIcons } from 'primeng/api'
 
 /**
  * Object describing details for button rendering containing key for translation, optional icon and optional parameters for translation
@@ -21,7 +22,7 @@ import { Type } from '@angular/core'
  */
 export interface ButtonDialogButtonDetails {
   key: string
-  icon?: string
+  icon?: PrimeIcons
   parameters?: Record<string, unknown>
 }
 
diff --git a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts
index bdc9ca67..6b73a77d 100644
--- a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts
+++ b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts
@@ -20,6 +20,7 @@ import {
   PortalDialogService,
 } from './portal-dialog.service'
 import { DivHarness, InputHarness, ButtonDialogHarness } from '../../../testing/index'
+import { PrimeIcons } from 'primeng/api'
 
 @Component({
   template: `<h1>BaseTestComponent</h1>`,
@@ -336,33 +337,33 @@ describe('PortalDialogService', () => {
     fixture.componentInstance.show(
       'title',
       'message',
-      { key: 'BUTTON', icon: 'pi pi-times' },
-      { key: 'BUTTON', icon: 'pi pi-trash' }
+      { key: 'BUTTON', icon: PrimeIcons.TIMES },
+      { key: 'BUTTON', icon: PrimeIcons.TRASH }
     )
 
     const dialogHarness = await rootLoader.getHarness(ButtonDialogHarness)
     const primaryButtonLabel = await dialogHarness.getPrimaryButtonLabel()
     const primaryButtonIcon = await dialogHarness.getPrimaryButtonIcon()
     expect(primaryButtonLabel).toBe(translations['BUTTON'])
-    expect(primaryButtonIcon).toBe('pi pi-times')
+    expect(primaryButtonIcon).toBe(PrimeIcons.TIMES)
 
     const secondaryButtonLabel = await dialogHarness.getSecondaryButtonLabel()
     const secondaryButtonIcon = await dialogHarness.getSecondaryButtonIcon()
     expect(secondaryButtonLabel).toBe(translations['BUTTON'])
-    expect(secondaryButtonIcon).toBe('pi pi-trash')
+    expect(secondaryButtonIcon).toBe(PrimeIcons.TRASH)
   })
 
   it('should display dialog with message and icon if DialogMessage provided as string and icon', async () => {
     jest.spyOn(pDialogService, 'open')
 
-    fixture.componentInstance.show('title', { message: 'MESSAGE', icon: 'pi pi-times' }, 'button1', 'button2')
+    fixture.componentInstance.show('title', { message: 'MESSAGE', icon: PrimeIcons.TIMES }, 'button1', 'button2')
 
     const dialogHarness = await rootLoader.getHarness(ButtonDialogHarness)
     const dialogMessageContentHarness = await dialogHarness.getDialogMessageContent()
     const message = await dialogMessageContentHarness?.getMessageContent()
     expect(message).toEqual(translations['MESSAGE'])
     const icon = await dialogMessageContentHarness?.getIconValue()
-    expect(icon).toContain('pi pi-times')
+    expect(icon).toContain(PrimeIcons.TIMES)
   })
 
   it('should display dialog with message and icon if DialogMessage provided as TranslationKey and icon', async () => {
@@ -370,7 +371,7 @@ describe('PortalDialogService', () => {
 
     fixture.componentInstance.show(
       'title',
-      { message: { key: 'MESSAGE_PARAM', parameters: { val: 'dialogMessageParam' } }, icon: 'pi pi-times' },
+      { message: { key: 'MESSAGE_PARAM', parameters: { val: 'dialogMessageParam' } }, icon: PrimeIcons.TIMES },
       'button1',
       'button2'
     )
@@ -380,7 +381,7 @@ describe('PortalDialogService', () => {
     const message = await dialogMessageContentHarness?.getMessageContent()
     expect(message).toEqual('myMessage dialogMessageParam')
     const icon = await dialogMessageContentHarness?.getIconValue()
-    expect(icon).toContain('pi pi-times')
+    expect(icon).toContain(PrimeIcons.TIMES)
   })
 
   it('should display dialog with custom component if provided', async () => {
diff --git a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
index 78fd25f1..d072dcdb 100644
--- a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
+++ b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
@@ -6,6 +6,7 @@ import { DialogService, DynamicDialogConfig, DynamicDialogRef } from 'primeng/dy
 import { ButtonDialogComponent } from '../core/components/button-dialog/button-dialog.component'
 import { ButtonDialogButtonDetails, ButtonDialogData } from '../model/button-dialog'
 import { DialogMessageContentComponent } from '../core/components/button-dialog/dialog-message-content/dialog-message-content.component'
+import { PrimeIcons } from 'primeng/api'
 
 /**
  * Object containing key for translation with parameters object for translation
@@ -61,7 +62,7 @@ type TranslationKey = string | TranslationKeyWithParameters
  * }
  * ```
  */
-type DialogMessage = { message: TranslationKey; icon: string }
+type DialogMessage = { message: TranslationKey; icon: PrimeIcons }
 
 /**
  * Implement via component class to be displayed by {@link PortalDialogService.openDialog}
diff --git a/libs/portal-integration-angular/testing/data-layout-selection.harness.ts b/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
index 64833aa9..dd179eb7 100644
--- a/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
+++ b/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
@@ -1,5 +1,6 @@
 import { ContentContainerComponentHarness, TestElement } from '@angular/cdk/testing'
 import { PSelectButtonHarness } from './primeng/p-selectButton.harness'
+import { PrimeIcons } from 'primeng/api'
 
 export class DataLayoutSelectionHarness extends ContentContainerComponentHarness {
   static hostSelector = 'ocx-data-layout-selection'
@@ -9,15 +10,15 @@ export class DataLayoutSelectionHarness extends ContentContainerComponentHarness
   }
 
   async getListLayoutSelectionButton() {
-    return await this.isDesiredButton(await this.getAllSelectionButtons(), 'pi pi-list')
+    return await this.isDesiredButton(await this.getAllSelectionButtons(), PrimeIcons.LIST)
   }
 
   async getGridLayoutSelectionButton() {
-    return await this.isDesiredButton(await this.getAllSelectionButtons(), 'pi pi-th-large')
+    return await this.isDesiredButton(await this.getAllSelectionButtons(), PrimeIcons.TH_LARGE)
   }
 
   async getTableLayoutSelectionButton() {
-    return await this.isDesiredButton(await this.getAllSelectionButtons(), 'pi pi-table')
+    return await this.isDesiredButton(await this.getAllSelectionButtons(), PrimeIcons.TABLE)
   }
 
   async getCurrentLayout() {
@@ -28,7 +29,7 @@ export class DataLayoutSelectionHarness extends ContentContainerComponentHarness
     await (await this.getListLayoutSelectionButton())?.click()
   }
 
-  private async isDesiredButton(value: TestElement[], icon: string) {
+  private async isDesiredButton(value: TestElement[], icon: PrimeIcons) {
     for (let index = 0; index < value.length; index++) {
       if ((await value[index].getAttribute('aria-labelledby')) === icon) {
         return value[index]

From 70cf90ed8f906d640ea7280ec850a377b6b7f785 Mon Sep 17 00:00:00 2001
From: markuczy <129275100+markuczy@users.noreply.github.com>
Date: Wed, 28 Feb 2024 06:51:45 +0100
Subject: [PATCH 2/6] feat: column group floating label displayed (#148)

---
 .../assets/i18n/de.json                       |  1 +
 .../assets/i18n/en.json                       |  1 +
 .../column-group-selection.component.html     | 29 ++++++++++---------
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json
index 73abc291..0ebfe097 100644
--- a/libs/portal-integration-angular/assets/i18n/de.json
+++ b/libs/portal-integration-angular/assets/i18n/de.json
@@ -1,5 +1,6 @@
 {
   "OCX_CUSTOM_GROUP_COLUMN_SELECTOR": {
+    "DROPDOWN_LABEL": "Spalten",
     "OPEN_BUTTON_TITLE": "Dialog zur Auswahl einer benutzerdefinierten Gruppe öffnen",
     "ACTIVE_COLUMNS_LABEL": "Aktive Spalten",
     "INACTIVE_COLUMNS_LABEL": "Inaktive Spalten",
diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json
index 8a1165cf..71224bc8 100644
--- a/libs/portal-integration-angular/assets/i18n/en.json
+++ b/libs/portal-integration-angular/assets/i18n/en.json
@@ -1,5 +1,6 @@
 {
   "OCX_CUSTOM_GROUP_COLUMN_SELECTOR": {
+    "DROPDOWN_LABEL": "Columns",
     "OPEN_BUTTON_TITLE": "Open custom group selection dialog",
     "ACTIVE_COLUMNS_LABEL": "Active columns",
     "INACTIVE_COLUMNS_LABEL": "Inactive columns",
diff --git a/libs/portal-integration-angular/src/lib/core/components/column-group-selection/column-group-selection.component.html b/libs/portal-integration-angular/src/lib/core/components/column-group-selection/column-group-selection.component.html
index f1dc2548..ca6b3da4 100644
--- a/libs/portal-integration-angular/src/lib/core/components/column-group-selection/column-group-selection.component.html
+++ b/libs/portal-integration-angular/src/lib/core/components/column-group-selection/column-group-selection.component.html
@@ -1,13 +1,16 @@
-<p-dropdown
-  id="columnGroupSelectionDropdown"
-  *ngIf="(allGroupKeys$ | async)?.length"
-  (onClear)="clearGroupSelection()"
-  (onChange)="changeGroupSelection($event)"
-  [options]="(allGroupKeys$ | async) || []"
-  [placeholder]="placeholderKey | translate"
-  [showClear]="selectedGroupKey !== defaultGroupKey"
-  [(ngModel)]="selectedGroupKey"
->
-  <ng-template let-item pTemplate="item"> {{ item ? (item | translate) : ''}} </ng-template>
-  <ng-template let-item pTemplate="selectedItem"> {{ item ? (item | translate) : ''}} </ng-template>
-</p-dropdown>
+<span class="p-float-label">
+  <p-dropdown
+    id="columnGroupSelectionDropdown"
+    *ngIf="(allGroupKeys$ | async)?.length"
+    (onClear)="clearGroupSelection()"
+    (onChange)="changeGroupSelection($event)"
+    [options]="(allGroupKeys$ | async) || []"
+    [placeholder]="placeholderKey | translate"
+    [showClear]="selectedGroupKey !== defaultGroupKey"
+    [(ngModel)]="selectedGroupKey"
+  >
+    <ng-template let-item pTemplate="item"> {{ item ? (item | translate) : ''}} </ng-template>
+    <ng-template let-item pTemplate="selectedItem"> {{ item ? (item | translate) : ''}} </ng-template>
+  </p-dropdown>
+  <label for="columnGroupSelectionDropdown">{{ ("OCX_CUSTOM_GROUP_COLUMN_SELECTOR.DROPDOWN_LABEL" | translate) }}</label>
+</span>
\ No newline at end of file

From d4bf6c5edb15f49f293290ddd2fdd4639e44fcd8 Mon Sep 17 00:00:00 2001
From: markuczy <129275100+markuczy@users.noreply.github.com>
Date: Wed, 28 Feb 2024 06:52:14 +0100
Subject: [PATCH 3/6] feat: search header allows to provide subheader now
 (#147)

---
 .../core/components/search-header/search-header.component.html   | 1 +
 .../lib/core/components/search-header/search-header.component.ts | 1 +
 2 files changed, 2 insertions(+)

diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html
index 5b0ce2c0..100b4eab 100644
--- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html
+++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html
@@ -1,5 +1,6 @@
 <ocx-page-header
   [header]="headline || ('OCX_SEARCH_HEADER.HEADLINE' | translate)"
+  [subheader]="subheader"
   [manualBreadcrumbs]="manualBreadcrumbs"
   [actions]="headerActions"
 >
diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts
index 9d2d445d..6993629b 100644
--- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts
@@ -26,6 +26,7 @@ import { SearchConfig } from '../../../model/search-config'
 export class SearchHeaderComponent implements AfterViewInit {
   @Input() searchConfigs: SearchConfig[] | undefined
   @Input() headline = ''
+  @Input() subheader: string | undefined
   @Input() viewMode: 'basic' | 'advanced' = 'basic'
   @Input() manualBreadcrumbs = false
   _actions: Action[] = []

From c9c8cdfbc2071d65e21d3f809d97355e1201e079 Mon Sep 17 00:00:00 2001
From: Bastian Jakobi <55296998+bastianjakobi@users.noreply.github.com>
Date: Wed, 28 Feb 2024 14:02:41 +0100
Subject: [PATCH 4/6] feat: lifecycle component (#153)

* feat: create necessary files

* feat: finished first implementation

* feat: change marker color based on active stepper step

* test: test lifecycle component
---
 libs/portal-integration-angular/src/index.ts  |  1 +
 .../lifecycle/lifecycle.component.html        | 13 ++++
 .../lifecycle/lifecycle.component.spec.ts     | 76 +++++++++++++++++++
 .../lifecycle/lifecycle.component.stories.ts  | 57 ++++++++++++++
 .../lifecycle/lifecycle.component.ts          | 16 ++++
 .../src/lib/core/portal-core.module.ts        |  3 +
 .../src/lib/core/primeng.module.ts            |  3 +
 .../testing/index.ts                          |  1 +
 .../testing/lifecycle.harness.ts              |  8 ++
 9 files changed, 178 insertions(+)
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.html
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.spec.ts
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.stories.ts
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.ts
 create mode 100644 libs/portal-integration-angular/testing/lifecycle.harness.ts

diff --git a/libs/portal-integration-angular/src/index.ts b/libs/portal-integration-angular/src/index.ts
index e4189909..939d6229 100644
--- a/libs/portal-integration-angular/src/index.ts
+++ b/libs/portal-integration-angular/src/index.ts
@@ -57,6 +57,7 @@ export * from './lib/core/components/loading-indicator/loading-indicator.compone
 export * from './lib/core/components/content-container/content-container.component'
 export * from './lib/core/components/content/content.component'
 export * from './lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component'
+export * from './lib/core/components/lifecycle/lifecycle.component'
 
 // services
 export * from './lib/services/app.menu.service'
diff --git a/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.html b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.html
new file mode 100644
index 00000000..0d3daff1
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.html
@@ -0,0 +1,13 @@
+<p-timeline [value]="steps">
+  <ng-template pTemplate="marker" let-step>
+    <span class="p-timeline-event-marker" [ngClass]="activeStepId && activeStepId === step.id ? 'bg-primary' : ''"></span>
+</ng-template>
+  <ng-template pTemplate="content" let-step>
+    <div class="pb-4 h-full">
+        <div class="card h-full" [ngClass]="activeStepId && activeStepId === step.id ? 'bg-primary' : ''">
+            <p class="font-bold text-xl" [ngClass]="step.details ? 'mb-2' : ''">{{ step.title }}</p>
+            <p *ngIf="step.details" [ngClass]="activeStepId && activeStepId === step.id ? '' : 'text-color-secondary'">{{ step.details }}</p>
+        </div>
+    </div>
+  </ng-template>
+</p-timeline>
diff --git a/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.spec.ts
new file mode 100644
index 00000000..02c84468
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.spec.ts
@@ -0,0 +1,76 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing'
+import { LifecycleComponent, LifecycleStep } from './lifecycle.component'
+import { TimelineModule } from 'primeng/timeline'
+import { LifecycleHarness, TestbedHarnessEnvironment } from '../../../../../testing'
+import { PrimeNgModule } from '../../primeng.module'
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+import { PortalCoreModule } from '../../portal-core.module'
+
+const mockSteps: LifecycleStep[] = [
+  {
+    id: 'test1',
+    title: 'Test 1',
+  },
+  {
+    id: 'test2',
+    title: 'Test 2',
+    details: 'Test 2 description',
+  },
+  {
+    id: 'test3',
+    title: 'Test 3',
+  },
+]
+
+describe('LifecycleComponent', () => {
+  let component: LifecycleComponent
+  let fixture: ComponentFixture<LifecycleComponent>
+  let lifecycle: LifecycleHarness
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [LifecycleComponent],
+      imports: [TimelineModule, PrimeNgModule, BrowserAnimationsModule, PortalCoreModule],
+    }).compileComponents()
+
+    fixture = TestBed.createComponent(LifecycleComponent)
+    component = fixture.componentInstance
+    fixture.detectChanges()
+    lifecycle = await TestbedHarnessEnvironment.harnessForFixture(fixture, LifecycleHarness)
+  })
+
+  it('should create', () => {
+    expect(component).toBeTruthy()
+    expect(lifecycle).toBeTruthy()
+  })
+
+  it('should not render any initial lifecycle steps', async () => {
+    const steps = await lifecycle.getSteps()
+    expect(steps.length).toBe(0)
+  })
+
+  it('should render given lifecycle steps', async () => {
+    component.steps = mockSteps
+    const steps = await lifecycle.getSteps()
+    const highlightedSteps = await lifecycle.getHighlightedSteps()
+    expect(steps.length).toBe(3)
+    expect(highlightedSteps.length).toBe(0)
+    mockSteps.forEach(async (step, index) => {
+      expect(await steps[index].text()).toEqual(step.title + (step.details ?? ''))
+    })
+  })
+
+  it('should highlight a given lifecycle step', async () => {
+    component.steps = mockSteps
+    component.activeStepId = 'test2'
+    const steps = await lifecycle.getSteps()
+    const highlightedSteps = await lifecycle.getHighlightedSteps()
+    mockSteps.forEach(async (step, index) => {
+      if(step.id == component.activeStepId) {
+        expect(await steps[index].hasClass('bg-primary')).toEqual(true)
+      }
+    })
+    expect(steps.length).toBe(3)
+    expect(highlightedSteps.length).toBe(1) 
+  })
+})
diff --git a/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.stories.ts b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.stories.ts
new file mode 100644
index 00000000..f28ac41e
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.stories.ts
@@ -0,0 +1,57 @@
+import { importProvidersFrom } from '@angular/core'
+import { BrowserModule } from '@angular/platform-browser'
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+import { Meta, StoryFn, applicationConfig, moduleMetadata } from '@storybook/angular'
+import { StorybookTranslateModule } from '../../storybook-translate.module'
+import { LifecycleComponent, LifecycleStep } from './lifecycle.component'
+import { TimelineModule } from 'primeng/timeline'
+import { CardModule } from 'primeng/card'
+
+export default {
+  title: 'LifecycleComponent',
+  component: LifecycleComponent,
+  decorators: [
+    applicationConfig({
+      providers: [importProvidersFrom(BrowserModule), importProvidersFrom(BrowserAnimationsModule)],
+    }),
+    moduleMetadata({
+      declarations: [LifecycleComponent],
+      imports: [StorybookTranslateModule, TimelineModule, CardModule],
+    }),
+  ],
+} as Meta<LifecycleComponent>
+
+const Template: StoryFn<LifecycleComponent> = (args: LifecycleComponent) => ({
+  props: args,
+})
+
+const mockData: LifecycleStep[] = [
+    {
+        id: "todo",
+        title: "ToDo"
+    },
+    {
+        id: "in_progress",
+        title: "In Progress",
+        details: "This event is currently in progress"
+    },
+    {
+        id: "done",
+        title: "Done"
+    }
+]
+
+export const WithoutHighlightedStep = {
+  render: Template,
+  args: {
+    steps: mockData
+  }
+}
+
+export const WithHighlightedStep = {
+    render: Template,
+    args: {
+      steps: mockData,
+      activeStepId: 'in_progress'
+    }
+  }
\ No newline at end of file
diff --git a/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.ts b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.ts
new file mode 100644
index 00000000..cfdb33be
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/lifecycle/lifecycle.component.ts
@@ -0,0 +1,16 @@
+import { Component, Input } from '@angular/core'
+
+export interface LifecycleStep {
+  id: string
+  title: string,
+  details?: string,
+}
+
+@Component({
+  selector: 'ocx-lifecycle',
+  templateUrl: './lifecycle.component.html',
+})
+export class LifecycleComponent {
+  @Input() steps: LifecycleStep[] = []
+  @Input() activeStepId: string | undefined
+}
diff --git a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts
index 393b6a49..059227d8 100644
--- a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts
+++ b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts
@@ -87,6 +87,7 @@ import { createTranslateLoader } from './utils/create-translate-loader.utils'
 import { MessageService } from 'primeng/api'
 import { TranslationCacheService } from '../services/translation-cache.service'
 import { CreateOrEditSearchConfigDialogComponent } from './components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component'
+import { LifecycleComponent } from './components/lifecycle/lifecycle.component'
 
 export class PortalMissingTranslationHandler implements MissingTranslationHandler {
   handle(params: MissingTranslationHandlerParams) {
@@ -169,6 +170,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle
     OcxContentContainerComponent,
     SearchConfigComponent,
     CreateOrEditSearchConfigDialogComponent,
+    LifecycleComponent,
   ],
   providers: [
     {
@@ -240,6 +242,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle
     OcxContentContainerComponent,
     SearchConfigComponent,
     CreateOrEditSearchConfigDialogComponent,
+    LifecycleComponent
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
   entryComponents: [ColumnTogglerComponent],
diff --git a/libs/portal-integration-angular/src/lib/core/primeng.module.ts b/libs/portal-integration-angular/src/lib/core/primeng.module.ts
index ec99f0a7..3983fe84 100644
--- a/libs/portal-integration-angular/src/lib/core/primeng.module.ts
+++ b/libs/portal-integration-angular/src/lib/core/primeng.module.ts
@@ -23,6 +23,7 @@ import { InputSwitchModule } from 'primeng/inputswitch'
 import { DataViewModule } from 'primeng/dataview'
 import { ChartModule } from 'primeng/chart'
 import { CheckboxModule } from 'primeng/checkbox'
+import { TimelineModule } from 'primeng/timeline'
 
 @NgModule({
   imports: [
@@ -51,6 +52,7 @@ import { CheckboxModule } from 'primeng/checkbox'
     ChartModule,
     MessageModule,
     CheckboxModule,
+    TimelineModule,
   ],
   exports: [
     BadgeModule,
@@ -78,6 +80,7 @@ import { CheckboxModule } from 'primeng/checkbox'
     ChartModule,
     MessageModule,
     CheckboxModule,
+    TimelineModule,
   ],
 })
 export class PrimeNgModule {}
diff --git a/libs/portal-integration-angular/testing/index.ts b/libs/portal-integration-angular/testing/index.ts
index d2744661..ecd99352 100644
--- a/libs/portal-integration-angular/testing/index.ts
+++ b/libs/portal-integration-angular/testing/index.ts
@@ -35,6 +35,7 @@ export * from './span.harness'
 export * from './page-header.harness'
 export * from './p-tableCheckbox.harness'
 export * from './create-or-edit-search-config-dialog.harness'
+export * from './lifecycle.harness'
 
 export * from '@angular/cdk/testing'
 export * from '@angular/cdk/testing/testbed'
diff --git a/libs/portal-integration-angular/testing/lifecycle.harness.ts b/libs/portal-integration-angular/testing/lifecycle.harness.ts
new file mode 100644
index 00000000..4365e479
--- /dev/null
+++ b/libs/portal-integration-angular/testing/lifecycle.harness.ts
@@ -0,0 +1,8 @@
+import { ContentContainerComponentHarness } from "@angular/cdk/testing"
+
+export class LifecycleHarness extends ContentContainerComponentHarness {
+    static hostSelector = 'ocx-lifecycle'
+
+    getSteps = this.locatorForAll('.p-timeline-event-content .card')
+    getHighlightedSteps = this.locatorForAll('.p-timeline-event-content .card.bg-primary')
+}
\ No newline at end of file

From 56e09acc4d312b9006da378817fa944f3f1eec59 Mon Sep 17 00:00:00 2001
From: Annika Nowak <139357202+anninowak@users.noreply.github.com>
Date: Wed, 28 Feb 2024 14:55:58 +0100
Subject: [PATCH 5/6] fix: adapt SearchConfig interface and use the type
 PrimeIcon for icons (#152)

* fix: adapt SearchConfig interface and use the type PrimeIcon for icons
---
 libs/portal-integration-angular/src/index.ts  |  1 +
 .../button-dialog.component.html              | 48 +++++++-------
 .../data-layout-selection.component.ts        |  5 +-
 .../data-view-controls.component.ts           | 13 +++-
 .../components/diagram/diagram.component.ts   | 19 ++++--
 .../page-header/page-header.component.spec.ts | 64 +++++++------------
 .../page-header/page-header.component.ts      |  3 +-
 .../search-config.component.spec.ts           |  8 +--
 .../src/lib/core/utils/primeicon.utils.ts     |  5 ++
 .../src/lib/model/button-dialog.ts            |  4 +-
 .../src/lib/model/search-config.ts            |  4 +-
 .../src/lib/services/portal-dialog.service.ts |  4 +-
 .../testing/data-layout-selection.harness.ts  |  3 +-
 .../testing/index.ts                          |  2 +
 .../testing/utils/primeicon.utils.ts          |  3 +
 package-lock.json                             |  4 +-
 16 files changed, 102 insertions(+), 88 deletions(-)
 create mode 100644 libs/portal-integration-angular/src/lib/core/utils/primeicon.utils.ts
 create mode 100644 libs/portal-integration-angular/testing/utils/primeicon.utils.ts

diff --git a/libs/portal-integration-angular/src/index.ts b/libs/portal-integration-angular/src/index.ts
index 939d6229..55151a9f 100644
--- a/libs/portal-integration-angular/src/index.ts
+++ b/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'
diff --git a/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.html b/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.html
index d5e3ce3b..0f8b1934 100644
--- a/libs/portal-integration-angular/src/lib/core/components/button-dialog/button-dialog.component.html
+++ b/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>
\ No newline at end of file
+  <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>
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts
index 1c2cf7e7..c706e006 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-layout-selection/data-layout-selection.component.ts
+++ b/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)
   }
 }
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts
index c9f6e7ca..3ced3701 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-view-controls/data-view-controls.component.ts
+++ b/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)
   }
diff --git a/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts b/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
index 4d8c873f..f050e15c 100644
--- a/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/diagram/diagram.component.ts
@@ -6,9 +6,10 @@ 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
@@ -16,14 +17,22 @@ export interface DiagramLayouts {
 
 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
   }
diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.spec.ts
index ebb3f250..90345b46 100644
--- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.spec.ts
+++ b/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,8 +176,8 @@ 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',
@@ -201,20 +185,20 @@ describe('PageHeaderComponent', () => {
       {
         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,7 +242,7 @@ describe('PageHeaderComponent', () => {
     component.actions = mockActions
 
     const menuOverflowButtons = await pageHeaderHarness.getOverflowActionButtons()
-    
+
     expect(menuOverflowButtons).toBeTruthy()
     expect(menuOverflowButtons.length).toBe(1)
     await menuOverflowButtons[0].click()
@@ -266,7 +250,7 @@ describe('PageHeaderComponent', () => {
     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()
diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts
index 59e480f9..859d5ca4 100644
--- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts
+++ b/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
diff --git a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts
index 50de2329..7f7789b9 100644
--- a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts
+++ b/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],
     },
diff --git a/libs/portal-integration-angular/src/lib/core/utils/primeicon.utils.ts b/libs/portal-integration-angular/src/lib/core/utils/primeicon.utils.ts
new file mode 100644
index 00000000..f8fa2c41
--- /dev/null
+++ b/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'>]
diff --git a/libs/portal-integration-angular/src/lib/model/button-dialog.ts b/libs/portal-integration-angular/src/lib/model/button-dialog.ts
index ee383173..2e5edaae 100644
--- a/libs/portal-integration-angular/src/lib/model/button-dialog.ts
+++ b/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>
 }
 
diff --git a/libs/portal-integration-angular/src/lib/model/search-config.ts b/libs/portal-integration-angular/src/lib/model/search-config.ts
index a88a91a5..95c35bb3 100644
--- a/libs/portal-integration-angular/src/lib/model/search-config.ts
+++ b/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>
 }
diff --git a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
index d072dcdb..86c87b61 100644
--- a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
+++ b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.ts
@@ -6,7 +6,7 @@ import { DialogService, DynamicDialogConfig, DynamicDialogRef } from 'primeng/dy
 import { ButtonDialogComponent } from '../core/components/button-dialog/button-dialog.component'
 import { ButtonDialogButtonDetails, ButtonDialogData } from '../model/button-dialog'
 import { DialogMessageContentComponent } from '../core/components/button-dialog/dialog-message-content/dialog-message-content.component'
-import { PrimeIcons } from 'primeng/api'
+import { PrimeIcon } from '../core/utils/primeicon.utils'
 
 /**
  * Object containing key for translation with parameters object for translation
@@ -62,7 +62,7 @@ type TranslationKey = string | TranslationKeyWithParameters
  * }
  * ```
  */
-type DialogMessage = { message: TranslationKey; icon: PrimeIcons }
+type DialogMessage = { message: TranslationKey; icon: PrimeIcon }
 
 /**
  * Implement via component class to be displayed by {@link PortalDialogService.openDialog}
diff --git a/libs/portal-integration-angular/testing/data-layout-selection.harness.ts b/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
index dd179eb7..3e7da442 100644
--- a/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
+++ b/libs/portal-integration-angular/testing/data-layout-selection.harness.ts
@@ -1,6 +1,7 @@
 import { ContentContainerComponentHarness, TestElement } from '@angular/cdk/testing'
 import { PSelectButtonHarness } from './primeng/p-selectButton.harness'
 import { PrimeIcons } from 'primeng/api'
+import { PrimeIcon } from './utils/primeicon.utils'
 
 export class DataLayoutSelectionHarness extends ContentContainerComponentHarness {
   static hostSelector = 'ocx-data-layout-selection'
@@ -29,7 +30,7 @@ export class DataLayoutSelectionHarness extends ContentContainerComponentHarness
     await (await this.getListLayoutSelectionButton())?.click()
   }
 
-  private async isDesiredButton(value: TestElement[], icon: PrimeIcons) {
+  private async isDesiredButton(value: TestElement[], icon: PrimeIcon) {
     for (let index = 0; index < value.length; index++) {
       if ((await value[index].getAttribute('aria-labelledby')) === icon) {
         return value[index]
diff --git a/libs/portal-integration-angular/testing/index.ts b/libs/portal-integration-angular/testing/index.ts
index ecd99352..4dc030a1 100644
--- a/libs/portal-integration-angular/testing/index.ts
+++ b/libs/portal-integration-angular/testing/index.ts
@@ -37,5 +37,7 @@ export * from './p-tableCheckbox.harness'
 export * from './create-or-edit-search-config-dialog.harness'
 export * from './lifecycle.harness'
 
+export * from './utils/primeicon.utils'
+
 export * from '@angular/cdk/testing'
 export * from '@angular/cdk/testing/testbed'
diff --git a/libs/portal-integration-angular/testing/utils/primeicon.utils.ts b/libs/portal-integration-angular/testing/utils/primeicon.utils.ts
new file mode 100644
index 00000000..6386a7d2
--- /dev/null
+++ b/libs/portal-integration-angular/testing/utils/primeicon.utils.ts
@@ -0,0 +1,3 @@
+import { PrimeIcons } from 'primeng/api'
+
+export type PrimeIcon = (typeof PrimeIcons)[keyof Omit<typeof PrimeIcons, 'prototype'>]
diff --git a/package-lock.json b/package-lock.json
index 337af6ef..2e0e611a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@onecx/onecx-portal-ui-libs",
-  "version": "4.5.0",
+  "version": "4.8.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@onecx/onecx-portal-ui-libs",
-      "version": "4.5.0",
+      "version": "4.8.0",
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {

From f2e760665cb4313385b7a4850dde9d71eca637ac Mon Sep 17 00:00:00 2001
From: semantic-release-bot <semantic-release-bot@martynus.net>
Date: Wed, 28 Feb 2024 14:07:22 +0000
Subject: [PATCH 6/6] chore(release): -v4.9.0 [skip ci]

## [4.9.0](https://github.com/onecx/onecx-portal-ui-libs/compare/v4.8.0...v4.9.0) (2024-02-28)

### Features

* column group floating label displayed ([#148](https://github.com/onecx/onecx-portal-ui-libs/issues/148)) ([70cf90e](https://github.com/onecx/onecx-portal-ui-libs/commit/70cf90ed8f906d640ea7280ec850a377b6b7f785))
* lifecycle component ([#153](https://github.com/onecx/onecx-portal-ui-libs/issues/153)) ([c9c8cdf](https://github.com/onecx/onecx-portal-ui-libs/commit/c9c8cdfbc2071d65e21d3f809d97355e1201e079))
* search header allows to provide subheader now ([#147](https://github.com/onecx/onecx-portal-ui-libs/issues/147)) ([d4bf6c5](https://github.com/onecx/onecx-portal-ui-libs/commit/d4bf6c5edb15f49f293290ddd2fdd4639e44fcd8))

### Bug Fixes

* adapt SearchConfig interface and use the type PrimeIcon for icons ([#152](https://github.com/onecx/onecx-portal-ui-libs/issues/152)) ([56e09ac](https://github.com/onecx/onecx-portal-ui-libs/commit/56e09acc4d312b9006da378817fa944f3f1eec59))

### Refactoring

* migrate icons in TS to PrimeIcons ([#151](https://github.com/onecx/onecx-portal-ui-libs/issues/151)) ([186fae8](https://github.com/onecx/onecx-portal-ui-libs/commit/186fae874a752f734b87c45d35a9c4c5c0e79bc2))
---
 CHANGELOG.md                                 | 19 +++++++++++++++++++
 libs/accelerator/package.json                |  2 +-
 libs/integration-interface/package.json      |  2 +-
 libs/keycloak-auth/package.json              |  2 +-
 libs/portal-integration-angular/package.json |  2 +-
 libs/portal-layout-styles/package.json       |  2 +-
 package.json                                 |  2 +-
 7 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0adb7f44..5949d81a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,22 @@
+## [4.9.0](https://github.com/onecx/onecx-portal-ui-libs/compare/v4.8.0...v4.9.0) (2024-02-28)
+
+
+### Features
+
+* column group floating label displayed ([#148](https://github.com/onecx/onecx-portal-ui-libs/issues/148)) ([70cf90e](https://github.com/onecx/onecx-portal-ui-libs/commit/70cf90ed8f906d640ea7280ec850a377b6b7f785))
+* lifecycle component ([#153](https://github.com/onecx/onecx-portal-ui-libs/issues/153)) ([c9c8cdf](https://github.com/onecx/onecx-portal-ui-libs/commit/c9c8cdfbc2071d65e21d3f809d97355e1201e079))
+* search header allows to provide subheader now ([#147](https://github.com/onecx/onecx-portal-ui-libs/issues/147)) ([d4bf6c5](https://github.com/onecx/onecx-portal-ui-libs/commit/d4bf6c5edb15f49f293290ddd2fdd4639e44fcd8))
+
+
+### Bug Fixes
+
+* adapt SearchConfig interface and use the type PrimeIcon for icons ([#152](https://github.com/onecx/onecx-portal-ui-libs/issues/152)) ([56e09ac](https://github.com/onecx/onecx-portal-ui-libs/commit/56e09acc4d312b9006da378817fa944f3f1eec59))
+
+
+### Refactoring
+
+* migrate icons in TS to PrimeIcons ([#151](https://github.com/onecx/onecx-portal-ui-libs/issues/151)) ([186fae8](https://github.com/onecx/onecx-portal-ui-libs/commit/186fae874a752f734b87c45d35a9c4c5c0e79bc2))
+
 ## [4.8.0](https://github.com/onecx/onecx-portal-ui-libs/compare/v4.7.0...v4.8.0) (2024-02-26)
 
 
diff --git a/libs/accelerator/package.json b/libs/accelerator/package.json
index caf7e084..0eef28af 100644
--- a/libs/accelerator/package.json
+++ b/libs/accelerator/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/accelerator",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "peerDependencies": {
     "tslib": "^2.3.0",
     "rxjs": "7.8.1"
diff --git a/libs/integration-interface/package.json b/libs/integration-interface/package.json
index e6718c07..e4845eee 100644
--- a/libs/integration-interface/package.json
+++ b/libs/integration-interface/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/integration-interface",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "peerDependencies": {
     "tslib": "^2.3.0",
     "rxjs": "7.8.1",
diff --git a/libs/keycloak-auth/package.json b/libs/keycloak-auth/package.json
index c6fda510..908f9533 100644
--- a/libs/keycloak-auth/package.json
+++ b/libs/keycloak-auth/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/keycloak-auth",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "peerDependencies": {
     "@angular/common": ">=15.2.7",
     "@angular/core": ">=15.2.7",
diff --git a/libs/portal-integration-angular/package.json b/libs/portal-integration-angular/package.json
index 634c9706..e573df42 100644
--- a/libs/portal-integration-angular/package.json
+++ b/libs/portal-integration-angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/portal-integration-angular",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "peerDependencies": {
     "@angular-architects/module-federation": "15.0.0",
     "@angular/common": "^15.2.7",
diff --git a/libs/portal-layout-styles/package.json b/libs/portal-layout-styles/package.json
index 46676cce..d5d0f5e1 100644
--- a/libs/portal-layout-styles/package.json
+++ b/libs/portal-layout-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/portal-layout-styles",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "peerDependencies": {
     "tslib": "^2.5.0"
   },
diff --git a/package.json b/package.json
index 72fa6f79..412efc60 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onecx/onecx-portal-ui-libs",
-  "version": "4.8.0",
+  "version": "4.9.0",
   "license": "Apache-2.0",
   "scripts": {
     "sass": "npx sass libs/portal-integration-angular/assets/styles.scss libs/portal-integration-angular/assets/output.css",