diff --git a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.html b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.html index 232923d29..c0211fead 100644 --- a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.html +++ b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.html @@ -14,4 +14,17 @@ > {{ errorMessage }}

+ + @if (invalidProperties) { + + } diff --git a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.spec.ts b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.spec.ts index 477ecdf52..3f5207165 100644 --- a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.spec.ts +++ b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.spec.ts @@ -99,4 +99,56 @@ describe('FeedbackErrorDialogComponent', () => { expect(iconElement).toHaveAttribute('size', '1.5rem'); }); }); + + describe('invalidProperties', () => { + it('should not display invalidProperties when not present', () => { + // Arrange + currentDialogData = { errorMessage: 'Test error' }; + spectator = createComponent(); + + // Assert + expect(spectator.query('[data-what="invalid-properties"]')).toBeFalsy(); + }); + + it('should display invalidProperties from error object', () => { + // Arrange + currentDialogData = { + error: { + invalidProperties: { + field1: 'Fehler bei Feld 1', + field2: 'Fehler bei Feld 2', + }, + }, + }; + spectator = createComponent(); + + // Assert + const list = spectator.query('[data-what="invalid-properties"]'); + expect(list).toBeTruthy(); + expect(list).toHaveText('field1'); + expect(list).toHaveText('Fehler bei Feld 1'); + expect(list).toHaveText('field2'); + expect(list).toHaveText('Fehler bei Feld 2'); + }); + + it('should display invalidProperties from error.error (HttpErrorResponse)', () => { + // Arrange + currentDialogData = { + error: { + error: { + invalidProperties: { + email: 'Ungültige E-Mail', + }, + }, + }, + }; + spectator = createComponent(); + + // Assert + const list = spectator.query('[data-what="invalid-properties"]'); + expect(list).toBeTruthy(); + expect(list).toHaveText('email'); + expect(list).toHaveText('Ungültige E-Mail'); + }); + }); }); diff --git a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.ts b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.ts index e253dfa18..de7574b72 100644 --- a/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.ts +++ b/libs/ui/dialog/src/lib/feedback-error-dialog/feedback-error-dialog.component.ts @@ -1,4 +1,5 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { KeyValuePipe } from '@angular/common'; import { DialogContentDirective } from '../dialog-content.directive'; import { NgIcon, provideIcons } from '@ng-icons/core'; import { isaActionClose } from '@isa/icons'; @@ -26,7 +27,7 @@ export type FeedbackErrorDialogData = selector: 'ui-feedback-error-dialog', templateUrl: './feedback-error-dialog.component.html', changeDetection: ChangeDetectionStrategy.OnPush, - imports: [NgIcon], + imports: [NgIcon, KeyValuePipe], providers: [provideIcons({ isaActionClose })], host: { '[class]': '["ui-feedback-error-dialog"]', @@ -54,4 +55,24 @@ export class FeedbackErrorDialogComponent extends DialogContentDirective< })); return 'Ein unbekannter Fehler ist aufgetreten'; } + + /** Hole invalidProperties wenn vorhanden (direkt am error oder in error.error) */ + get invalidProperties(): Record | null { + if (!('error' in this.data)) return null; + + const err = this.data.error as Record; + + // Check 1: Direkt auf error + if (err?.['invalidProperties']) { + return err['invalidProperties'] as Record; + } + + // Check 2: Auf error.error (HttpErrorResponse) + const inner = err?.['error'] as Record; + if (inner?.['invalidProperties']) { + return inner['invalidProperties'] as Record; + } + + return null; + } }