AAE-45774 Show error for date fields if invalid format (#11886)

* AAE-45774 Show error for date fields if invalid format

* apply copilot suggestions

lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html

@@ -82,6 +82,11 @@
                 [startAt]="valueDate"
                 [ngClass]="{ 'cdk-visually-hidden': !editable || isReadonlyProperty}"
             />
+            @if (cardViewDateTimeControl.hasError('matDatepickerParse')) {
+                <mat-error>
+                    {{ 'FORM.FIELD.VALIDATOR.INVALID_DATE_FORMAT' | translate: { format: property.format ?? '' } }}
+                </mat-error>
+            }
         </mat-form-field>
     } @else {
         <mat-form-field class="adf-property-field adf-dateitem-editable" [floatLabel]="property.default ? 'always' : null">

lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.spec.ts

@@ -459,6 +459,21 @@ describe('CardViewDateItemComponent', () => {
             expect(component.cardViewDateTimeControl.value).not.toBeNull();
         });
 
+        it('should render error message when manual input has invalid date format', async () => {
+            fixture.detectChanges();
+
+            const manualInput = await testingUtils.getMatInputByDataAutomationId('datepicker-manual-input-dateKey');
+            await manualInput.setValue('not-a-date');
+            await manualInput.blur();
+            fixture.detectChanges();
+            await fixture.whenStable();
+            fixture.detectChanges();
+
+            expect(component.cardViewDateTimeControl.invalid).toBeTrue();
+            const formField = await testingUtils.getMatFormFieldByCSS('.adf-dateitem-editable');
+            expect(await formField.getTextErrors()).toContain('FORM.FIELD.VALIDATOR.INVALID_DATE_FORMAT');
+        });
+
         it('should clear the form control value when onDateClear is called', () => {
             fixture.detectChanges();