From 7f63cd82cf951be6a0b42f8be4ec62b0d6d8943a Mon Sep 17 00:00:00 2001 From: SheenaMalhotra182 Date: Mon, 21 Aug 2023 14:24:48 +0530 Subject: [PATCH] [ACS-5857] made dateFormat configurable for DateCloudWidget --- .../widgets/date/date-cloud.widget.html | 4 ++-- .../widgets/date/date-cloud.widget.spec.ts | 19 +++++++++--------- .../widgets/date/date-cloud.widget.ts | 20 +++++++++++-------- .../src/lib/models/date-format-cloud.model.ts | 2 +- 4 files changed, 25 insertions(+), 20 deletions(-) diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html index 4c305c5858..52d4df1dde 100644 --- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html +++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html @@ -22,11 +22,11 @@ - + { @@ -51,7 +52,7 @@ describe('DateWidgetComponent', () => { widget.ngOnInit(); - const expected = format(new Date(minValue), widget.DATE_FORMAT); + const expected = format(new Date(minValue), DATE_FORMAT_CLOUD); expect(widget.minDate).toEqual(expected); }); @@ -74,7 +75,7 @@ describe('DateWidgetComponent', () => { }); widget.ngOnInit(); - const expected = format(new Date(maxValue), widget.DATE_FORMAT); + const expected = format(new Date(maxValue), DATE_FORMAT_CLOUD); expect(widget.maxDate).toEqual(expected); }); @@ -91,7 +92,7 @@ describe('DateWidgetComponent', () => { widget.field = field; const todayDate = new Date(); - widget.onDateChanged({ value: format(todayDate, widget.DATE_FORMAT) }); + widget.onDateChanged({ value: format(todayDate, DATE_FORMAT_CLOUD) }); expect(widget.onFieldChanged).toHaveBeenCalledWith(field); }); @@ -293,7 +294,7 @@ describe('DateWidgetComponent', () => { await fixture.whenStable(); const todayDate = new Date(); - const expected = format(subDays(todayDate, widget.field.minDateRangeValue), widget.DATE_FORMAT); + const expected = format(subDays(todayDate, widget.field.minDateRangeValue), DATE_FORMAT_CLOUD); expect(widget.minDate).toEqual(expected); }); @@ -343,7 +344,7 @@ describe('DateWidgetComponent', () => { await fixture.whenStable(); const todayDate = new Date(); - const expected = format(addDays(todayDate, widget.field.maxDateRangeValue), widget.DATE_FORMAT); + const expected = format(addDays(todayDate, widget.field.maxDateRangeValue), DATE_FORMAT_CLOUD); expect(widget.maxDate).toEqual(expected); }); @@ -403,7 +404,7 @@ describe('DateWidgetComponent', () => { fixture.detectChanges(); await fixture.whenStable(); - const expectedMinValueString = format(new Date('2022-07-21'), widget.DATE_FORMAT); + const expectedMinValueString = format(new Date('2022-07-21'), DATE_FORMAT_CLOUD); expect(widget.field.minValue).toEqual(expectedMinValueString); expect(widget.maxDate).toBeUndefined(); @@ -423,7 +424,7 @@ describe('DateWidgetComponent', () => { fixture.detectChanges(); await fixture.whenStable(); - const expectedMaxValueString = format(new Date('2022-07-30'), widget.DATE_FORMAT); + const expectedMaxValueString = format(new Date('2022-07-30'), DATE_FORMAT_CLOUD); expect(widget.field.maxValue).toEqual(expectedMaxValueString); expect(widget.minDate).toBeUndefined(); @@ -462,8 +463,8 @@ describe('DateWidgetComponent', () => { fixture.detectChanges(); await fixture.whenStable(); - const expectedMaxValueString = format(new Date('2022-07-30'), widget.DATE_FORMAT); - const expectedMinValueString = format(new Date('2022-07-12'), widget.DATE_FORMAT); + const expectedMaxValueString = format(new Date('2022-07-30'), DATE_FORMAT_CLOUD); + const expectedMinValueString = format(new Date('2022-07-12'), DATE_FORMAT_CLOUD); expect(widget.field.maxValue).toEqual(expectedMaxValueString); expect(widget.field.minValue).toEqual(expectedMinValueString); diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts index ebb9def188..67690d007c 100644 --- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts +++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.ts @@ -17,13 +17,14 @@ /* eslint-disable @angular-eslint/component-selector */ -import { Component, OnInit, ViewEncapsulation, OnDestroy } from '@angular/core'; -import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core'; +import { Component, OnInit, ViewEncapsulation, OnDestroy, Inject } from '@angular/core'; +import { DateAdapter, MAT_DATE_FORMATS, MatDateFormats } from '@angular/material/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { WidgetComponent, UserPreferencesService, UserPreferenceValues, FormService, DateFnsUtils } from '@alfresco/adf-core'; import { addDays, format, isValid, subDays } from 'date-fns'; import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns-adapter'; +import { DATE_FORMAT_CLOUD } from '../../../../models/date-format-cloud.model'; @Component({ selector: 'date-widget', @@ -57,7 +58,8 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit, constructor(public formService: FormService, private dateAdapter: DateAdapter, - private userPreferencesService: UserPreferencesService) { + private userPreferencesService: UserPreferencesService, + @Inject(MAT_DATE_FORMATS) private dateFormatConfig: MatDateFormats) { super(formService); } @@ -67,25 +69,27 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit, .pipe(takeUntil(this.onDestroy$)) .subscribe(locale => this.dateAdapter.setLocale(DateFnsUtils.getLocaleFromString(locale))); + this.dateFormatConfig.display.dateInput = this.field.dateDisplayFormat; + if (this.field) { if (this.field.dynamicDateRangeSelection) { const today = this.getTodaysFormattedDate(); if (Number.isInteger(this.field.minDateRangeValue)) { - this.minDate = format(subDays(today, this.field.minDateRangeValue), this.DATE_FORMAT); + this.minDate = format(subDays(today, this.field.minDateRangeValue), DATE_FORMAT_CLOUD); this.field.minValue = this.minDate; } if (Number.isInteger(this.field.maxDateRangeValue)) { - this.maxDate = format(addDays(today, this.field.maxDateRangeValue), this.DATE_FORMAT); + this.maxDate = format(addDays(today, this.field.maxDateRangeValue), DATE_FORMAT_CLOUD); this.field.maxValue = this.maxDate; } } else { if (this.field.minValue) { - this.minDate = format(new Date(this.field.minValue), this.DATE_FORMAT); + this.minDate = format(new Date(this.field.minValue), DATE_FORMAT_CLOUD); } if (this.field.maxValue) { - this.maxDate = format(new Date(this.field.maxValue), this.DATE_FORMAT); + this.maxDate = format(new Date(this.field.maxValue), DATE_FORMAT_CLOUD); } } } @@ -103,7 +107,7 @@ export class DateCloudWidgetComponent extends WidgetComponent implements OnInit, onDateChanged(newDateValue) { const date = new Date(newDateValue); if (isValid(date)) { - this.field.value = format(date, this.DATE_FORMAT); + this.field.value = format(date, this.field.dateDisplayFormat); } else { this.field.value = newDateValue; } diff --git a/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts b/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts index 786c8c316b..79f48c0033 100644 --- a/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts +++ b/lib/process-services-cloud/src/lib/models/date-format-cloud.model.ts @@ -15,4 +15,4 @@ * limitations under the License. */ -export const DATE_FORMAT_CLOUD = 'YYYY-MM-DD'; +export const DATE_FORMAT_CLOUD = 'yyyy-MM-dd';