From 784d116a77458e3c34a40673bb6652aa09a5424b Mon Sep 17 00:00:00 2001
From: Annika Nowak <annika.nowak@capgemini.com>
Date: Tue, 13 Feb 2024 09:07:48 +0100
Subject: [PATCH 1/4] feat: save and edit search config component

feat: save and edit search config component
---
 .../assets/i18n/de.json                       |   5 +
 .../assets/i18n/en.json                       |   5 +
 libs/portal-integration-angular/src/index.ts  |   1 +
 ...r-edit-search-config-dialog.component.html |  27 ++++
 ...r-edit-search-config-dialog.component.scss |  14 ++
 ...dit-search-config-dialog.component.spec.ts | 147 ++++++++++++++++++
 ...-or-edit-search-config-dialog.component.ts |  59 +++++++
 .../data-view/data-view.component.ts          |  17 +-
 .../interactive-data-view.component.ts        |   9 +-
 .../search-config.component.spec.ts           |  12 +-
 .../search-config/search-config.component.ts  |   4 +-
 .../search-header.component.html              |   3 +-
 .../search-header/search-header.component.ts  |  10 +-
 .../src/lib/core/portal-core.module.ts        |   3 +
 .../src/lib/core/primeng.module.ts            |   3 +
 ...te-or-edit-search-config-dialog.harness.ts |  19 +++
 .../testing/div.harness.ts                    |  10 +-
 .../testing/index.ts                          |   2 +
 .../testing/input.harness.ts                  |   7 +
 .../testing/primeng/p-checkbox.harness.ts     |  34 ++++
 package-lock.json                             |   4 +-
 21 files changed, 366 insertions(+), 29 deletions(-)
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.html
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.scss
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
 create mode 100644 libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
 create mode 100644 libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
 create mode 100644 libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts

diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json
index 943df42d..1dfc1f2e 100644
--- a/libs/portal-integration-angular/assets/i18n/de.json
+++ b/libs/portal-integration-angular/assets/i18n/de.json
@@ -7,6 +7,11 @@
     "CANCEL_BUTTON_LABEL": "Abbrechen",
     "DIALOG_TITLE": "Spalten für benutzerdefinierte Gruppe auswählen"
   },
+  "OCX_SEARCH_CONFIG": {
+    "PLACEHOLDER": "Bitte geben Sie den Namen der Search Config ein.",
+    "SAVE_COLUMNS_OPTION": "Möchten Sie die angezeigten Spalten speichern?",
+    "SAVE_INPUT_FIELDS_OPTION": "Möchten Sie die Werte aus den Suchfeldern speichern?"
+  },
   "OCX_LIST_GRID_SORT": {
     "DROPDOWN": {
       "PLACEHOLDER": "Sortierung auswählen",
diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json
index 81e3d161..379458b1 100644
--- a/libs/portal-integration-angular/assets/i18n/en.json
+++ b/libs/portal-integration-angular/assets/i18n/en.json
@@ -7,6 +7,11 @@
     "CANCEL_BUTTON_LABEL": "Cancel",
     "DIALOG_TITLE": "Custom group column selection"
   },
+  "OCX_SEARCH_CONFIG": {
+    "PLACEHOLDER": "Please enter the name of the search config",
+    "SAVE_COLUMNS_OPTION": "Do you want to save the shown columns?",
+    "SAVE_INPUT_FIELDS_OPTION": "Do you want to save the input values from the input fields?"
+  },
   "OCX_LIST_GRID_SORT": {
     "DROPDOWN": {
       "PLACEHOLDER": "Select sorting",
diff --git a/libs/portal-integration-angular/src/index.ts b/libs/portal-integration-angular/src/index.ts
index bde66c78..e4189909 100644
--- a/libs/portal-integration-angular/src/index.ts
+++ b/libs/portal-integration-angular/src/index.ts
@@ -56,6 +56,7 @@ export * from './lib/core/components/search-config/search-config.component'
 export * from './lib/core/components/loading-indicator/loading-indicator.component'
 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'
 
 // services
 export * from './lib/services/app.menu.service'
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.html b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.html
new file mode 100644
index 00000000..e8b4d141
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.html
@@ -0,0 +1,27 @@
+<form [formGroup]="searchConfigFormGroup" [class]="'searchConfigDialog'">
+  <div>
+    <input
+      type="text"
+      pInputText
+      formControlName="searchConfigName"
+      id="searchConfigName"
+      [placeholder]="placeHolderKey | translate"
+    />
+  </div>
+
+  <div>
+    <p-checkbox formControlName="saveInputValues" [value]="saveInputValues" [binary]="true" inputId="saveInputValuesId">
+    </p-checkbox>
+    <label for="saveInputValuesId">{{ ("OCX_SEARCH_CONFIG.SAVE_INPUT_FIELDS_OPTION" | translate) }}</label>
+  </div>
+
+  <div>
+    <p-checkbox
+      formControlName="saveColumns"
+      [value]="saveColumns"
+      [binary]="true"
+      inputId="saveColumnsId"
+    ></p-checkbox>
+    <label for="saveColumnsId">{{ ("OCX_SEARCH_CONFIG.SAVE_COLUMNS_OPTION" | translate) }}</label>
+  </div>
+</form>
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.scss b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.scss
new file mode 100644
index 00000000..a530b42b
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.scss
@@ -0,0 +1,14 @@
+.searchConfigDialog {
+  display: flex;
+  flex-direction: column;
+  gap: 1em;
+  margin-bottom: 1em;
+}
+
+:host ::ng-deep .p-inputtext {
+  width: 100%;
+}
+
+:host ::ng-deep .p-checkbox {
+  margin-right: 1em;
+}
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
new file mode 100644
index 00000000..c55e300b
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
@@ -0,0 +1,147 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing'
+import { CreateOrEditSearchConfigDialogComponent } from './create-or-edit-search-config-dialog.component'
+import { CheckboxModule } from 'primeng/checkbox'
+import { MockAuthModule } from '../../../mock-auth/mock-auth.module'
+import { TranslateTestingModule } from 'ngx-translate-testing'
+import { HttpClientTestingModule } from '@angular/common/http/testing'
+import { TranslateService } from '@ngx-translate/core'
+import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'
+import { PCheckboxHarness, CreateOrEditSearchConfigDialogHarness } from 'libs/portal-integration-angular/testing'
+import { DialogState } from '../../../services/portal-dialog.service'
+import { ReactiveFormsModule } from '@angular/forms'
+import { InputTextModule } from 'primeng/inputtext'
+
+describe('CreateOrEditSearchConfigDialogComponent', () => {
+  let component: CreateOrEditSearchConfigDialogComponent
+  let fixture: ComponentFixture<CreateOrEditSearchConfigDialogComponent>
+  let translateService: TranslateService
+  let dialogHarness: CreateOrEditSearchConfigDialogHarness
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [CreateOrEditSearchConfigDialogComponent],
+      imports: [
+        CheckboxModule,
+        MockAuthModule,
+        TranslateTestingModule.withTranslations({
+          en: require('./../../../../../assets/i18n/en.json'),
+          de: require('./../../../../../assets/i18n/de.json'),
+        }),
+        HttpClientTestingModule,
+        ReactiveFormsModule,
+        InputTextModule,
+      ],
+    }).compileComponents()
+
+    fixture = TestBed.createComponent(CreateOrEditSearchConfigDialogComponent)
+    component = fixture.componentInstance
+
+    translateService = TestBed.inject(TranslateService)
+    translateService.setDefaultLang('en')
+    translateService.use('en')
+
+    fixture.detectChanges()
+    dialogHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, CreateOrEditSearchConfigDialogHarness)
+  })
+
+  it('should create the component', () => {
+    expect(component).toBeTruthy()
+  })
+
+  it('should load the CreateOrEditSearchConfigDialogHarness', async () => {
+    expect(dialogHarness).toBeTruthy()
+  })
+
+  it('should set the DialogResult of the saveInputValuesId checkbox to true when the saveInputValuesId checkbox is checked', async () => {
+    const saveInputValuesCheckbox = await dialogHarness.getHarness(
+      PCheckboxHarness.with({ inputid: 'saveInputValuesId' })
+    )
+    await saveInputValuesCheckbox.click()
+    const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
+    component.ocxDialogButtonClicked(_state)
+    let dialogResult = {
+      searchConfigName: '',
+      saveInputValues: true,
+      saveColumns: false,
+    }
+    expect(component.dialogResult).toEqual(dialogResult)
+  })
+
+  it('should set the DialogResult of the saveColumnsId checkbox initially false', async () => {
+    const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
+    await component.ocxDialogButtonClicked(_state)
+    let dialogResult = {
+      searchConfigName: '',
+      saveInputValues: false,
+      saveColumns: false,
+    }
+    expect(component.dialogResult).toEqual(dialogResult)
+  })
+
+  it('should set the DialogResult of the searchConfig input Field to the entered value', async () => {
+    await (await dialogHarness.getSearchConfigInputHarness('searchConfigName')).setValue('search Config')
+    const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
+    await component.ocxDialogButtonClicked(_state)
+    let dialogResult = {
+      searchConfigName: 'search Config',
+      saveInputValues: false,
+      saveColumns: false,
+    }
+    expect(component.dialogResult).toEqual(dialogResult)
+  })
+
+  it('should set the saveColumnsId checkbox initially to unchecked', async () => {
+    const saveInputValuesCheckbox = await dialogHarness.getSaveColumnsCheckboxHarness()
+    const checked = await saveInputValuesCheckbox.isChecked()
+    expect(checked).toBeFalsy()
+  })
+
+  it('should set the saveInputValues checkbox initially to unchecked', async () => {
+    const saveInputValuesCheckbox = await dialogHarness.getSaveInputValuesCheckboxHarness()
+    const checked = await saveInputValuesCheckbox.isChecked()
+    expect(checked).toBeFalsy()
+  })
+
+  it('should set the saveInputValues checkbox to true when it is clicked', async () => {
+    const saveInputValuesCheckbox = await dialogHarness.getSaveInputValuesCheckboxHarness()
+    await saveInputValuesCheckbox.click()
+    const checked = await saveInputValuesCheckbox.isChecked()
+    expect(checked).toBeTruthy()
+  })
+
+  it('should emit true when the searchConfig name is not an empty string and the saveColumnsCheckBox is clicked', async () => {
+    let done: () => void
+    let finished = new Promise<void>((resolve) => (done = resolve))
+    let enabled = false
+    component.primaryButtonEnabled.subscribe((v) => {
+      enabled = v
+      done()
+    })
+
+    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness('searchConfigName')
+    searchConfigInputHarness.setValue('test')
+    const saveInputValuesCheckbox = await dialogHarness.getSaveColumnsCheckboxHarness()
+    await saveInputValuesCheckbox.click()
+
+    await finished
+    expect(enabled).toEqual(true)
+  })
+
+  it('emit true when the searchConfig Name is not an empty string and the saveInputValuesCheckbox is clicked', async () => {
+    let done: () => void
+    let finished = new Promise<void>((resolve) => (done = resolve))
+    let enabled = false
+    component.primaryButtonEnabled.subscribe((v) => {
+      enabled = v
+      done()
+    })
+
+    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness('searchConfigName')
+    searchConfigInputHarness.setValue('test')
+    const saveInputValuesCheckbox = await dialogHarness.getSaveInputValuesCheckboxHarness()
+    await saveInputValuesCheckbox.click()
+
+    await finished
+    expect(enabled).toEqual(true)
+  })
+})
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
new file mode 100644
index 00000000..32dced31
--- /dev/null
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
@@ -0,0 +1,59 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core'
+import { FormControl, FormGroup } from '@angular/forms'
+import {
+  DialogButtonClicked,
+  DialogPrimaryButtonDisabled,
+  DialogResult,
+  DialogState,
+} from '../../../services/portal-dialog.service'
+import { Observable, map } from 'rxjs'
+
+export type CreateOrEditSearchDialogContent = {
+  searchConfigName: string
+  saveInputValues: boolean
+  saveColumns: boolean
+}
+@Component({
+  selector: 'ocx-create-or-edit-search-config-dialog',
+  templateUrl: './create-or-edit-search-config-dialog.component.html',
+  styleUrls: ['./create-or-edit-search-config-dialog.component.scss'],
+})
+export class CreateOrEditSearchConfigDialogComponent
+  implements
+    DialogPrimaryButtonDisabled,
+    DialogResult<CreateOrEditSearchDialogContent>,
+    DialogButtonClicked<CreateOrEditSearchConfigDialogComponent>
+{
+  @Input() searchConfigName: string = ''
+  @Input() saveInputValues: boolean = false
+  @Input() saveColumns: boolean = false
+  @Input() placeHolderKey: string = 'OCX_SEARCH_CONFIG.PLACEHOLDER'
+  @Output() primaryButtonEnabled: EventEmitter<boolean> = new EventEmitter()
+  searchConfigFormGroup: FormGroup = new FormGroup({
+    searchConfigName: new FormControl<string>(this.searchConfigName),
+    saveInputValues: new FormControl<boolean>(this.saveInputValues),
+    saveColumns: new FormControl<boolean>(this.saveColumns),
+  })
+  dialogResult: CreateOrEditSearchDialogContent = { searchConfigName: '', saveInputValues: false, saveColumns: false }
+  constructor() {
+    this.searchConfigFormGroup.valueChanges
+      .pipe(
+        map(
+          (dialogFormValues: CreateOrEditSearchDialogContent) =>
+            !!dialogFormValues.searchConfigName && (dialogFormValues.saveInputValues || dialogFormValues.saveColumns)
+        )
+      )
+      .subscribe(this.primaryButtonEnabled)
+  }
+
+  ocxDialogButtonClicked(
+    _state: DialogState<CreateOrEditSearchConfigDialogComponent>
+  ): boolean | Observable<boolean> | Promise<boolean> | undefined {
+    this.dialogResult = {
+      searchConfigName: this.searchConfigFormGroup?.get('searchConfigName')?.value,
+      saveInputValues: this.searchConfigFormGroup?.get('saveInputValues')?.value,
+      saveColumns: this.searchConfigFormGroup?.get('saveColumns')?.value,
+    }
+    return true
+  }
+}
diff --git a/libs/portal-integration-angular/src/lib/core/components/data-view/data-view.component.ts b/libs/portal-integration-angular/src/lib/core/components/data-view/data-view.component.ts
index 9a90cb7b..f9da3921 100644
--- a/libs/portal-integration-angular/src/lib/core/components/data-view/data-view.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/data-view/data-view.component.ts
@@ -58,7 +58,7 @@ export class DataViewComponent implements DoCheck, OnInit {
   @Input() sortDirection: DataSortDirection = DataSortDirection.NONE
   @Input() listGridPaginator = true
   @Input() tablePaginator = true
-  @Input() totalRecordsOnServer: number | undefined 
+  @Input() totalRecordsOnServer: number | undefined
   @Input() currentPageShowingKey = 'OCX_DATA_TABLE.SHOWING'
   @Input() currentPageShowingWithTotalOnServerKey = 'OCX_DATA_TABLE.SHOWING_WITH_TOTAL_ON_SERVER'
   @Input() selectedRows: Row[] = []
@@ -158,11 +158,14 @@ export class DataViewComponent implements DoCheck, OnInit {
     return this.injector.get('InteractiveDataViewComponent', null)?.deleteItem.observed || this.deleteItem.observed
   }
   get selectionChangedObserved(): boolean {
-    return this.injector.get('InteractiveDataViewComponent', null)?.selectionChanged.observed || this.selectionChanged.observed
+    return (
+      this.injector.get('InteractiveDataViewComponent', null)?.selectionChanged.observed ||
+      this.selectionChanged.observed
+    )
   }
 
   constructor(private injector: Injector) {}
-  
+
   ngOnInit(): void {
     this.firstColumnId = this.columns[0]?.id
   }
@@ -224,8 +227,8 @@ export class DataViewComponent implements DoCheck, OnInit {
           })
         }
       }
-      if(this.selectionChangedObserved) {
-        if(!this._dataTableComponent?.selectionChanged.observed) {
+      if (this.selectionChangedObserved) {
+        if (!this._dataTableComponent?.selectionChanged.observed) {
           this._dataTableComponent?.selectionChanged.subscribe((event) => {
             this.onRowSelectionChange(event)
           })
@@ -233,7 +236,7 @@ export class DataViewComponent implements DoCheck, OnInit {
       }
     }
   }
-  
+
   filtering(event: any) {
     this.filters = event
     this.filtered.emit(event)
@@ -263,7 +266,7 @@ export class DataViewComponent implements DoCheck, OnInit {
   }
 
   onRowSelectionChange(event: Row[]) {
-    if(this.selectionChangedObserved){
+    if (this.selectionChangedObserved) {
       this.selectionChanged.emit(event)
     }
   }
diff --git a/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts b/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
index e99f1ba0..266c3eb8 100644
--- a/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
@@ -55,6 +55,7 @@ export class InteractiveDataViewComponent implements OnInit {
   @Input() listGridPaginator = true
   @Input() tablePaginator = true
   @Input() selectedRows: Row[] = []
+  @Input() displayedColumns: DataTableColumn[] = []
   @ContentChild('tableCell') tableCell: TemplateRef<any> | undefined
   @ContentChild('tableDateCell') tableDateCell: TemplateRef<any> | undefined
   @ContentChild('tableRelativeDateCell') tableRelativeDateCell: TemplateRef<any> | undefined
@@ -74,7 +75,7 @@ export class InteractiveDataViewComponent implements OnInit {
   @Output() dataViewLayoutChange = new EventEmitter<'grid' | 'list' | 'table'>()
   @Output() displayedColumnsChange = new EventEmitter<DataTableColumn[]>()
   @Output() selectionChanged: EventEmitter<Row[]> = new EventEmitter()
-  displayedColumns: DataTableColumn[] = []
+
   selectedGroupKey = ''
   isDeleteItemObserved: boolean | undefined
   isViewItemObserved: boolean | undefined
@@ -220,8 +221,8 @@ export class InteractiveDataViewComponent implements OnInit {
         })
       }
     }
-    if(this.selectionChanged.observed) {
-      if(!this._dataViewComponent?.selectionChanged.observed) {
+    if (this.selectionChanged.observed) {
+      if (!this._dataViewComponent?.selectionChanged.observed) {
         this._dataViewComponent?.selectionChanged.subscribe((event) => {
           this.onRowSelectionChange(event)
         })
@@ -236,7 +237,7 @@ export class InteractiveDataViewComponent implements OnInit {
   }
 
   onRowSelectionChange(event: Row[]) {
-    if(this.selectionChanged.observed){
+    if (this.selectionChanged.observed) {
       this.selectionChanged.emit(event)
     }
   }
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 229285ea..50de2329 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
@@ -30,7 +30,7 @@ describe('SearchConfigComponent', () => {
     },
   ]
 
-  const searchConfigsEntries: SearchConfig[] = [
+  const searchConfigs: SearchConfig[] = [
     {
       id: '01',
       name: 'Basic search config',
@@ -82,7 +82,7 @@ describe('SearchConfigComponent', () => {
 
     fixture = TestBed.createComponent(SearchConfigComponent)
     component = fixture.componentInstance
-    component.searchConfigs = searchConfigsEntries
+    component.searchConfigs = searchConfigs
     translateService = TestBed.inject(TranslateService)
     translateService.setDefaultLang('en')
     translateService.use('en')
@@ -110,7 +110,7 @@ describe('SearchConfigComponent', () => {
     const searchConfigHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, SearchConfigHarness)
     const dropdown = await searchConfigHarness.getSearchConfigDropdown()
     const items = await dropdown?.getDropdownItems()
-    expect(items?.length).toEqual(searchConfigsEntries.length)
+    expect(items?.length).toEqual(searchConfigs.length)
   })
 
   it('should display no dropdown if the search config is empty', async () => {
@@ -124,14 +124,14 @@ describe('SearchConfigComponent', () => {
     const searchConfigHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, SearchConfigHarness)
     const dropdown = await searchConfigHarness.getSearchConfigDropdown()
     const selectedDropdownItem = await dropdown?.selectedDropdownItemText(0)
-    expect(selectedDropdownItem).toEqual(searchConfigsEntries[0].name)
+    expect(selectedDropdownItem).toEqual(searchConfigs[0].name)
   })
 
   it('should display the values in the fields after selecting the fist hard coded search config', async () => {
     const searchConfigHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, SearchConfigHarness)
     const dropdown = await searchConfigHarness.getSearchConfigDropdown()
     const selectedDropdownItem = await dropdown?.selectedDropdownItemText(1)
-    expect(selectedDropdownItem).toEqual(searchConfigsEntries[1].name)
+    expect(selectedDropdownItem).toEqual(searchConfigs[1].name)
   })
 
   it('should display the values in the fields correctly after selecting the fist search config and then selecting the second search config', async () => {
@@ -139,7 +139,7 @@ describe('SearchConfigComponent', () => {
     const dropdown = await searchConfigHarness.getSearchConfigDropdown()
     let selectedDropdownItem = await dropdown?.selectedDropdownItemText(0)
     selectedDropdownItem = await dropdown?.selectedDropdownItemText(1)
-    expect(selectedDropdownItem).toEqual(searchConfigsEntries[1].name)
+    expect(selectedDropdownItem).toEqual(searchConfigs[1].name)
   })
 
   it('should have the option to remove the selection', async () => {
diff --git a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
index 671b63dc..51f99b96 100644
--- a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
@@ -14,7 +14,7 @@ export class SearchConfigComponent implements OnInit {
   @Input() placeholderKey = 'OCX_SEARCH_HEADER.OCX_SEARCH_CONFIG.DROPDOWN_DEFAULT'
 
   @Output()
-  selectedSearchConfig: EventEmitter<SearchConfig[]> = new EventEmitter()
+  selectedSearchConfig: EventEmitter<SearchConfig> = new EventEmitter()
 
   formGroup: FormGroup | undefined
   ngOnInit(): void {
@@ -23,7 +23,7 @@ export class SearchConfigComponent implements OnInit {
     })
   }
 
-  onSearchConfigChange(event: SearchConfig[]) {
+  onSearchConfigChange(event: SearchConfig) {
     this.selectedSearchConfig?.emit(event)
   }
 }
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 98f0abbb..55b723d3 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
@@ -4,7 +4,8 @@
   [actions]="headerActions"
 >
   <ng-template #additionalToolbarContent>
-    <ocx-search-config [searchConfigs]="searchConfigsEntries"> </ocx-search-config>
+    <ocx-search-config [searchConfigs]="searchConfigs" (selectedSearchConfig)="confirmSearchConfig($event)">
+    </ocx-search-config>
     <ng-container *ngIf="_additionalToolbarContent" [ngTemplateOutlet]="_additionalToolbarContent"></ng-container>
   </ng-template>
   <div class="search-criteria-container">
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 0680ddd0..7fc95c58 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
@@ -24,8 +24,9 @@ import { SearchConfig } from '../../../model/search-config'
   styleUrls: ['./search-header.component.scss'],
 })
 export class SearchHeaderComponent implements AfterViewInit {
-  @Input() searchConfigsEntries: SearchConfig[] | undefined
+  @Input() searchConfigs: SearchConfig[] | undefined
   @Input() headline = ''
+  @Input() viewMode: 'basic' | 'advanced' = 'basic'
   @Input() manualBreadcrumbs = false
   _actions: Action[] = []
   @Input()
@@ -39,7 +40,8 @@ export class SearchHeaderComponent implements AfterViewInit {
 
   @Output() searched: EventEmitter<any> = new EventEmitter()
   @Output() resetted: EventEmitter<any> = new EventEmitter()
-  @Output() selectedSearchConfig: EventEmitter<any> = new EventEmitter()
+  @Output() selectedSearchConfig: EventEmitter<SearchConfig> = new EventEmitter()
+  @Output() viewModeChanged: EventEmitter<string> = new EventEmitter()
   @ContentChild('additionalToolbarContent')
   additionalToolbarContent: TemplateRef<any> | undefined
 
@@ -49,7 +51,6 @@ export class SearchHeaderComponent implements AfterViewInit {
 
   @ViewChild('searchParameterFields') searchParameterFields: ElementRef | undefined
 
-  viewMode: 'basic' | 'advanced' = 'basic'
   hasAdvanced = false
   headerActions: Action[] = []
 
@@ -59,6 +60,7 @@ export class SearchHeaderComponent implements AfterViewInit {
 
   toggleViewMode() {
     this.viewMode = this.viewMode === 'basic' ? 'advanced' : 'basic'
+    this.viewModeChanged?.emit(this.viewMode)
     this.updateHeaderActions()
     setTimeout(() => this.addKeyUpEventListener())
   }
@@ -103,7 +105,7 @@ export class SearchHeaderComponent implements AfterViewInit {
     }
   }
 
-  confirmSearchConfig(event: any) {
+  confirmSearchConfig(event: SearchConfig) {
     this.selectedSearchConfig?.emit(event)
   }
 }
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 98e64f1c..393b6a49 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
@@ -86,6 +86,7 @@ import { UserProfileAPIService } from '../services/userprofile-api.service'
 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'
 
 export class PortalMissingTranslationHandler implements MissingTranslationHandler {
   handle(params: MissingTranslationHandlerParams) {
@@ -167,6 +168,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle
     OcxContentComponent,
     OcxContentContainerComponent,
     SearchConfigComponent,
+    CreateOrEditSearchConfigDialogComponent,
   ],
   providers: [
     {
@@ -237,6 +239,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle
     OcxContentComponent,
     OcxContentContainerComponent,
     SearchConfigComponent,
+    CreateOrEditSearchConfigDialogComponent,
   ],
   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 ade47c52..ec99f0a7 100644
--- a/libs/portal-integration-angular/src/lib/core/primeng.module.ts
+++ b/libs/portal-integration-angular/src/lib/core/primeng.module.ts
@@ -22,6 +22,7 @@ import { DialogModule } from 'primeng/dialog'
 import { InputSwitchModule } from 'primeng/inputswitch'
 import { DataViewModule } from 'primeng/dataview'
 import { ChartModule } from 'primeng/chart'
+import { CheckboxModule } from 'primeng/checkbox'
 
 @NgModule({
   imports: [
@@ -49,6 +50,7 @@ import { ChartModule } from 'primeng/chart'
     DataViewModule,
     ChartModule,
     MessageModule,
+    CheckboxModule,
   ],
   exports: [
     BadgeModule,
@@ -75,6 +77,7 @@ import { ChartModule } from 'primeng/chart'
     DataViewModule,
     ChartModule,
     MessageModule,
+    CheckboxModule,
   ],
 })
 export class PrimeNgModule {}
diff --git a/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts b/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
new file mode 100644
index 00000000..b3367ce7
--- /dev/null
+++ b/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
@@ -0,0 +1,19 @@
+import { ContentContainerComponentHarness } from '@angular/cdk/testing'
+import { PCheckboxHarness } from './primeng/p-checkbox.harness'
+import { InputHarness } from './input.harness'
+
+export class CreateOrEditSearchConfigDialogHarness extends ContentContainerComponentHarness {
+  static hostSelector = 'ocx-create-or-edit-search-config-dialog'
+
+  getSaveInputValuesCheckboxHarness() {
+    return this.getHarness(PCheckboxHarness.with({ inputid: 'saveInputValuesId' }))
+  }
+
+  getSaveColumnsCheckboxHarness() {
+    return this.getHarness(PCheckboxHarness.with({ inputid: 'saveColumnsId' }))
+  }
+
+  getSearchConfigInputHarness(inputId: string) {
+    return this.getHarness(InputHarness.with({ id: 'searchConfigName' }))
+  }
+}
diff --git a/libs/portal-integration-angular/testing/div.harness.ts b/libs/portal-integration-angular/testing/div.harness.ts
index 39669eae..6cf90005 100644
--- a/libs/portal-integration-angular/testing/div.harness.ts
+++ b/libs/portal-integration-angular/testing/div.harness.ts
@@ -27,10 +27,14 @@ export class DivHarness extends ComponentHarness {
 
   async getClassList() {
     const host = await this.host()
-    const attributeString = await host.getAttribute("class");
-    if(attributeString) {
-        return attributeString.trim().split(" ")
+    const attributeString = await host.getAttribute('class')
+    if (attributeString) {
+      return attributeString.trim().split(' ')
     }
     return []
   }
+
+  async click(): Promise<void> {
+    await (await this.host()).click()
+  }
 }
diff --git a/libs/portal-integration-angular/testing/index.ts b/libs/portal-integration-angular/testing/index.ts
index 4ff94656..d2744661 100644
--- a/libs/portal-integration-angular/testing/index.ts
+++ b/libs/portal-integration-angular/testing/index.ts
@@ -8,6 +8,7 @@ export * from './primeng/p-multiSelectListItem.harness'
 export * from './primeng/p-picklist.harness'
 export * from './primeng/p-selectButton.harness'
 export * from './primeng/p-paginator.harness'
+export * from './primeng/p-checkbox.harness'
 
 export * from './button-dialog.harness'
 export * from './button.harness'
@@ -33,6 +34,7 @@ export * from './search-config.harness'
 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 '@angular/cdk/testing'
 export * from '@angular/cdk/testing/testbed'
diff --git a/libs/portal-integration-angular/testing/input.harness.ts b/libs/portal-integration-angular/testing/input.harness.ts
index 32cab9d5..834eb479 100644
--- a/libs/portal-integration-angular/testing/input.harness.ts
+++ b/libs/portal-integration-angular/testing/input.harness.ts
@@ -20,6 +20,9 @@ export class InputHarness extends ComponentHarness {
   async getValue(): Promise<string | null> {
     return await (await this.host()).getProperty<string>('value')
   }
+  async getChecked(): Promise<boolean> {
+    return await (await this.host()).getProperty<boolean>('checked')
+  }
 
   async setValue(value: string | Date): Promise<void> {
     if (value instanceof Date) {
@@ -33,6 +36,10 @@ export class InputHarness extends ComponentHarness {
         })} ${value.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`
       )
     } else {
+      await (await this.host()).clear()
+      if (value) {
+        await (await this.host()).sendKeys(value)
+      }
       await (await this.host()).setInputValue(value)
     }
   }
diff --git a/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts b/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts
new file mode 100644
index 00000000..4ae10a9e
--- /dev/null
+++ b/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts
@@ -0,0 +1,34 @@
+import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing'
+import { DivHarness, DivHarnessFilters } from '../div.harness'
+import { InputHarness } from '../input.harness'
+
+export interface PCheckBoxHarnessFilters extends BaseHarnessFilters {
+  inputid?: string
+}
+export class PCheckboxHarness extends ComponentHarness {
+  static hostSelector = 'p-checkbox'
+
+  static with(options: PCheckBoxHarnessFilters): HarnessPredicate<PCheckboxHarness> {
+    return new HarnessPredicate(PCheckboxHarness, options).addOption('inputid', options.inputid, (harness, inputid) =>
+      HarnessPredicate.stringMatches(harness.getId(), inputid)
+    )
+  }
+
+  getCheckBoxDiv = this.locatorForOptional(DivHarness.with({ class: 'p-checkbox-box' }))
+
+  async isChecked(): Promise<boolean> {
+    return (await this.locatorFor(InputHarness)()).getChecked()
+  }
+
+  async getId(): Promise<string | null> {
+    return await (await this.host()).getAttribute('inputId')
+  }
+  async isHidden(): Promise<boolean> {
+    const attr = await (await this.host()).getAttribute('hidden')
+    return Boolean(attr)
+  }
+
+  async click(): Promise<void> {
+    await (await this.getCheckBoxDiv())?.click()
+  }
+}
diff --git a/package-lock.json b/package-lock.json
index 9b027d24..337af6ef 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@onecx/onecx-portal-ui-libs",
-  "version": "4.3.0",
+  "version": "4.5.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@onecx/onecx-portal-ui-libs",
-      "version": "4.3.0",
+      "version": "4.5.0",
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {

From 683a8277e350714097011ff748137a13250ccc72 Mon Sep 17 00:00:00 2001
From: Annika Nowak <annika.nowak@capgemini.com>
Date: Thu, 22 Feb 2024 14:30:24 +0100
Subject: [PATCH 2/4] fix: smaller fixes from Github Actions

---
 ...edit-search-config-dialog.component.spec.ts | 18 +++++++++---------
 ...e-or-edit-search-config-dialog.component.ts | 14 +++++++-------
 ...ate-or-edit-search-config-dialog.harness.ts |  2 +-
 .../testing/primeng/p-checkbox.harness.ts      |  7 ++++---
 4 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
index c55e300b..077467fe 100644
--- a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.spec.ts
@@ -6,7 +6,7 @@ import { TranslateTestingModule } from 'ngx-translate-testing'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
 import { TranslateService } from '@ngx-translate/core'
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'
-import { PCheckboxHarness, CreateOrEditSearchConfigDialogHarness } from 'libs/portal-integration-angular/testing'
+import { PCheckboxHarness, CreateOrEditSearchConfigDialogHarness } from '../../../../../testing'
 import { DialogState } from '../../../services/portal-dialog.service'
 import { ReactiveFormsModule } from '@angular/forms'
 import { InputTextModule } from 'primeng/inputtext'
@@ -59,7 +59,7 @@ describe('CreateOrEditSearchConfigDialogComponent', () => {
     await saveInputValuesCheckbox.click()
     const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
     component.ocxDialogButtonClicked(_state)
-    let dialogResult = {
+    const dialogResult = {
       searchConfigName: '',
       saveInputValues: true,
       saveColumns: false,
@@ -70,7 +70,7 @@ describe('CreateOrEditSearchConfigDialogComponent', () => {
   it('should set the DialogResult of the saveColumnsId checkbox initially false', async () => {
     const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
     await component.ocxDialogButtonClicked(_state)
-    let dialogResult = {
+    const dialogResult = {
       searchConfigName: '',
       saveInputValues: false,
       saveColumns: false,
@@ -79,10 +79,10 @@ describe('CreateOrEditSearchConfigDialogComponent', () => {
   })
 
   it('should set the DialogResult of the searchConfig input Field to the entered value', async () => {
-    await (await dialogHarness.getSearchConfigInputHarness('searchConfigName')).setValue('search Config')
+    await (await dialogHarness.getSearchConfigInputHarness()).setValue('search Config')
     const _state: DialogState<CreateOrEditSearchConfigDialogComponent> = { button: 'primary', result: undefined }
     await component.ocxDialogButtonClicked(_state)
-    let dialogResult = {
+    const dialogResult = {
       searchConfigName: 'search Config',
       saveInputValues: false,
       saveColumns: false,
@@ -111,14 +111,14 @@ describe('CreateOrEditSearchConfigDialogComponent', () => {
 
   it('should emit true when the searchConfig name is not an empty string and the saveColumnsCheckBox is clicked', async () => {
     let done: () => void
-    let finished = new Promise<void>((resolve) => (done = resolve))
+    const finished = new Promise<void>((resolve) => (done = resolve))
     let enabled = false
     component.primaryButtonEnabled.subscribe((v) => {
       enabled = v
       done()
     })
 
-    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness('searchConfigName')
+    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness()
     searchConfigInputHarness.setValue('test')
     const saveInputValuesCheckbox = await dialogHarness.getSaveColumnsCheckboxHarness()
     await saveInputValuesCheckbox.click()
@@ -129,14 +129,14 @@ describe('CreateOrEditSearchConfigDialogComponent', () => {
 
   it('emit true when the searchConfig Name is not an empty string and the saveInputValuesCheckbox is clicked', async () => {
     let done: () => void
-    let finished = new Promise<void>((resolve) => (done = resolve))
+    const finished = new Promise<void>((resolve) => (done = resolve))
     let enabled = false
     component.primaryButtonEnabled.subscribe((v) => {
       enabled = v
       done()
     })
 
-    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness('searchConfigName')
+    const searchConfigInputHarness = await dialogHarness.getSearchConfigInputHarness()
     searchConfigInputHarness.setValue('test')
     const saveInputValuesCheckbox = await dialogHarness.getSaveInputValuesCheckboxHarness()
     await saveInputValuesCheckbox.click()
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
index 32dced31..49ff95b2 100644
--- a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
@@ -24,15 +24,15 @@ export class CreateOrEditSearchConfigDialogComponent
     DialogResult<CreateOrEditSearchDialogContent>,
     DialogButtonClicked<CreateOrEditSearchConfigDialogComponent>
 {
-  @Input() searchConfigName: string = ''
-  @Input() saveInputValues: boolean = false
-  @Input() saveColumns: boolean = false
-  @Input() placeHolderKey: string = 'OCX_SEARCH_CONFIG.PLACEHOLDER'
+  @Input() searchConfigName: string | undefined
+  @Input() saveInputValues: boolean | undefined
+  @Input() saveColumns: boolean | undefined
+  @Input() placeHolderKey = 'OCX_SEARCH_CONFIG.PLACEHOLDER'
   @Output() primaryButtonEnabled: EventEmitter<boolean> = new EventEmitter()
   searchConfigFormGroup: FormGroup = new FormGroup({
-    searchConfigName: new FormControl<string>(this.searchConfigName),
-    saveInputValues: new FormControl<boolean>(this.saveInputValues),
-    saveColumns: new FormControl<boolean>(this.saveColumns),
+    searchConfigName: new FormControl<string>(''),
+    saveInputValues: new FormControl<boolean>(false),
+    saveColumns: new FormControl<boolean>(false),
   })
   dialogResult: CreateOrEditSearchDialogContent = { searchConfigName: '', saveInputValues: false, saveColumns: false }
   constructor() {
diff --git a/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts b/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
index b3367ce7..d056751b 100644
--- a/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
+++ b/libs/portal-integration-angular/testing/create-or-edit-search-config-dialog.harness.ts
@@ -13,7 +13,7 @@ export class CreateOrEditSearchConfigDialogHarness extends ContentContainerCompo
     return this.getHarness(PCheckboxHarness.with({ inputid: 'saveColumnsId' }))
   }
 
-  getSearchConfigInputHarness(inputId: string) {
+  getSearchConfigInputHarness() {
     return this.getHarness(InputHarness.with({ id: 'searchConfigName' }))
   }
 }
diff --git a/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts b/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts
index 4ae10a9e..5d435ac4 100644
--- a/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts
+++ b/libs/portal-integration-angular/testing/primeng/p-checkbox.harness.ts
@@ -1,5 +1,5 @@
 import { BaseHarnessFilters, ComponentHarness, HarnessPredicate } from '@angular/cdk/testing'
-import { DivHarness, DivHarnessFilters } from '../div.harness'
+import { DivHarness } from '../div.harness'
 import { InputHarness } from '../input.harness'
 
 export interface PCheckBoxHarnessFilters extends BaseHarnessFilters {
@@ -8,14 +8,14 @@ export interface PCheckBoxHarnessFilters extends BaseHarnessFilters {
 export class PCheckboxHarness extends ComponentHarness {
   static hostSelector = 'p-checkbox'
 
+  getCheckBoxDiv = this.locatorForOptional(DivHarness.with({ class: 'p-checkbox-box' }))
+
   static with(options: PCheckBoxHarnessFilters): HarnessPredicate<PCheckboxHarness> {
     return new HarnessPredicate(PCheckboxHarness, options).addOption('inputid', options.inputid, (harness, inputid) =>
       HarnessPredicate.stringMatches(harness.getId(), inputid)
     )
   }
 
-  getCheckBoxDiv = this.locatorForOptional(DivHarness.with({ class: 'p-checkbox-box' }))
-
   async isChecked(): Promise<boolean> {
     return (await this.locatorFor(InputHarness)()).getChecked()
   }
@@ -23,6 +23,7 @@ export class PCheckboxHarness extends ComponentHarness {
   async getId(): Promise<string | null> {
     return await (await this.host()).getAttribute('inputId')
   }
+
   async isHidden(): Promise<boolean> {
     const attr = await (await this.host()).getAttribute('hidden')
     return Boolean(attr)

From 5197a47b470d3d004db149f0302531bcfb5c3927 Mon Sep 17 00:00:00 2001
From: Annika Nowak <annika.nowak@capgemini.com>
Date: Mon, 26 Feb 2024 09:37:05 +0100
Subject: [PATCH 3/4] fix: improvement from code review

---
 libs/portal-integration-angular/assets/i18n/de.json         | 2 +-
 libs/portal-integration-angular/assets/i18n/en.json         | 2 +-
 .../create-or-edit-search-config-dialog.component.ts        | 2 +-
 .../components/search-config/search-config.component.ts     | 6 +++---
 .../components/search-header/search-header.component.html   | 2 +-
 .../components/search-header/search-header.component.ts     | 6 +++---
 6 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json
index 47b1f24a..49f81244 100644
--- a/libs/portal-integration-angular/assets/i18n/de.json
+++ b/libs/portal-integration-angular/assets/i18n/de.json
@@ -17,7 +17,7 @@
     }
   },
   "OCX_SEARCH_CONFIG": {
-    "PLACEHOLDER": "Bitte geben Sie den Namen der Search Config ein.",
+    "PLACEHOLDER": "Bitte geben Sie den Namen der Suchkonfiguration an.",
     "SAVE_COLUMNS_OPTION": "Möchten Sie die angezeigten Spalten speichern?",
     "SAVE_INPUT_FIELDS_OPTION": "Möchten Sie die Werte aus den Suchfeldern speichern?"
   },
diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json
index 382c1443..1ec7f442 100644
--- a/libs/portal-integration-angular/assets/i18n/en.json
+++ b/libs/portal-integration-angular/assets/i18n/en.json
@@ -17,7 +17,7 @@
     }
   },
   "OCX_SEARCH_CONFIG": {
-    "PLACEHOLDER": "Please enter the name of the search config",
+    "PLACEHOLDER": "Please enter the name of the search configuration",
     "SAVE_COLUMNS_OPTION": "Do you want to save the shown columns?",
     "SAVE_INPUT_FIELDS_OPTION": "Do you want to save the input values from the input fields?"
   },
diff --git a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
index 49ff95b2..b0205c84 100644
--- a/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component.ts
@@ -27,7 +27,7 @@ export class CreateOrEditSearchConfigDialogComponent
   @Input() searchConfigName: string | undefined
   @Input() saveInputValues: boolean | undefined
   @Input() saveColumns: boolean | undefined
-  @Input() placeHolderKey = 'OCX_SEARCH_CONFIG.PLACEHOLDER'
+  placeHolderKey = 'OCX_SEARCH_CONFIG.PLACEHOLDER'
   @Output() primaryButtonEnabled: EventEmitter<boolean> = new EventEmitter()
   searchConfigFormGroup: FormGroup = new FormGroup({
     searchConfigName: new FormControl<string>(''),
diff --git a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
index 51f99b96..884af52c 100644
--- a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.ts
@@ -14,7 +14,7 @@ export class SearchConfigComponent implements OnInit {
   @Input() placeholderKey = 'OCX_SEARCH_HEADER.OCX_SEARCH_CONFIG.DROPDOWN_DEFAULT'
 
   @Output()
-  selectedSearchConfig: EventEmitter<SearchConfig> = new EventEmitter()
+  selectedSearchConfigChanged: EventEmitter<SearchConfig> = new EventEmitter()
 
   formGroup: FormGroup | undefined
   ngOnInit(): void {
@@ -23,7 +23,7 @@ export class SearchConfigComponent implements OnInit {
     })
   }
 
-  onSearchConfigChange(event: SearchConfig) {
-    this.selectedSearchConfig?.emit(event)
+  onSearchConfigChange(searchConfig: SearchConfig) {
+    this.selectedSearchConfigChanged?.emit(searchConfig)
   }
 }
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 55b723d3..5b0ce2c0 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
@@ -4,7 +4,7 @@
   [actions]="headerActions"
 >
   <ng-template #additionalToolbarContent>
-    <ocx-search-config [searchConfigs]="searchConfigs" (selectedSearchConfig)="confirmSearchConfig($event)">
+    <ocx-search-config [searchConfigs]="searchConfigs" (selectedSearchConfigChanged)="confirmSearchConfig($event)">
     </ocx-search-config>
     <ng-container *ngIf="_additionalToolbarContent" [ngTemplateOutlet]="_additionalToolbarContent"></ng-container>
   </ng-template>
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 7fc95c58..9d2d445d 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
@@ -40,7 +40,7 @@ export class SearchHeaderComponent implements AfterViewInit {
 
   @Output() searched: EventEmitter<any> = new EventEmitter()
   @Output() resetted: EventEmitter<any> = new EventEmitter()
-  @Output() selectedSearchConfig: EventEmitter<SearchConfig> = new EventEmitter()
+  @Output() selectedSearchConfigChanged: EventEmitter<SearchConfig> = new EventEmitter()
   @Output() viewModeChanged: EventEmitter<string> = new EventEmitter()
   @ContentChild('additionalToolbarContent')
   additionalToolbarContent: TemplateRef<any> | undefined
@@ -105,7 +105,7 @@ export class SearchHeaderComponent implements AfterViewInit {
     }
   }
 
-  confirmSearchConfig(event: SearchConfig) {
-    this.selectedSearchConfig?.emit(event)
+  confirmSearchConfig(searchConfig: SearchConfig) {
+    this.selectedSearchConfigChanged?.emit(searchConfig)
   }
 }

From 4dbef2d96ad555df0e2913c99a234faeb67f880b Mon Sep 17 00:00:00 2001
From: Annika Nowak <annika.nowak@capgemini.com>
Date: Mon, 26 Feb 2024 09:57:34 +0100
Subject: [PATCH 4/4] fix: after merge correction

---
 .../interactive-data-view/interactive-data-view.component.ts     | 1 -
 1 file changed, 1 deletion(-)

diff --git a/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts b/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
index e75aca56..65cbb6e8 100644
--- a/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
+++ b/libs/portal-integration-angular/src/lib/core/components/interactive-data-view/interactive-data-view.component.ts
@@ -81,7 +81,6 @@ export class InteractiveDataViewComponent implements OnInit {
   @Output() selectionChanged: EventEmitter<Row[]> = new EventEmitter()
 
   @Output() pageChanged: EventEmitter<number> = new EventEmitter()
-  displayedColumns: DataTableColumn[] = []
   selectedGroupKey = ''
   isDeleteItemObserved: boolean | undefined
   isViewItemObserved: boolean | undefined