[HXCS-2818] CardViewDateItem component ignore timezone when displaying dates (#9304)

* [HXCS-2818] card-view-dateitem interpret dates as local, store them as utc

* [HXCS-2818] refactoring

---------

Co-authored-by: Adriano Costa <Adriano.Costa@hyland.comgit>
This commit is contained in:
Adriano Costa
2024-02-05 16:52:27 +01:00
committed by GitHub
parent 47d1165d5f
commit efd8e8d0ed
4 changed files with 37 additions and 25 deletions

View File

@@ -27,6 +27,7 @@ import { TranslationService } from '../../../translation/translation.service';
import { ADF_DATE_FORMATS, AdfDateFnsAdapter } from '../../../common/utils/date-fns-adapter';
import { ADF_DATETIME_FORMATS, AdfDateTimeFnsAdapter } from '../../../common/utils/datetime-fns-adapter';
import { isValid } from 'date-fns';
import { DateFnsUtils } from '../../../common/utils/date-fns-utils';
@Component({
providers: [
@@ -99,10 +100,11 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
if (event.value) {
if (isValid(event.value)) {
this.property.value = new Date(event.value);
this.valueDate = new Date(event.value);
if (this.property.type === 'date') {
this.property.value.setHours(0, 0, 0, 0);
this.property.value = DateFnsUtils.forceUtc(event.value);
this.valueDate = DateFnsUtils.forceLocal(event.value);
}
this.valueDate = event.value;
this.update();
}
}
@@ -125,9 +127,9 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
addDateToList(event: MatDatetimepickerInputEvent<Date>) {
if (event.value) {
if (isValid(event.value) && this.property.multivalued && Array.isArray(this.property.value)) {
const localDate = event.value;
let localDate = new Date(event.value);
if (this.property.type === 'date') {
localDate.setHours(0, 0, 0, 0);
localDate = DateFnsUtils.forceUtc(event.value);
}
this.property.value.push(localDate);
this.update();
@@ -148,11 +150,9 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
private initSingleValueProperty() {
if (this.property.value && !Array.isArray(this.property.value)) {
this.property.value = new Date(this.property.value);
if (this.property.type === 'date') {
this.property.value.setHours(0, 0, 0, 0);
}
this.valueDate = this.property.value;
const date = new Date(this.property.value);
this.property.value = date;
this.valueDate = this.property.type === 'date' ? DateFnsUtils.forceLocal(date) : date;
}
}
@@ -161,14 +161,10 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
this.property.value = [];
}
if (Array.isArray(this.property.value) && this.property.value.length > 0) {
this.property.value = this.property.value.map((date: Date) => {
const localDate = new Date(date);
if (this.property.type === 'date') {
localDate.setHours(0, 0, 0, 0);
}
return localDate;
});
this.valueDate = this.property.value[0];
this.property.value = this.property.value.map((date: Date | string) => new Date(date));
this.valueDate = this.property.type === 'date'
? DateFnsUtils.forceLocal(this.property.value[0])
: this.property.value[0];
}
}
}

View File

@@ -20,6 +20,7 @@ import { DynamicComponentModel } from '../../common/services/dynamic-component-m
import { CardViewBaseItemModel } from './card-view-baseitem.model';
import { CardViewDateItemProperties } from '../interfaces/card-view.interfaces';
import { LocalizedDatePipe } from '../../pipes/localized-date.pipe';
import { DateFnsUtils } from '../../common/utils/date-fns-utils';
type DateItemType = Date | Date[] | null;
@@ -40,18 +41,19 @@ export class CardViewDateItemModel extends CardViewBaseItemModel<DateItemType> i
if (cardViewDateItemProperties.locale) {
this.locale = cardViewDateItemProperties.locale;
}
}
get displayValue(): string | string[] {
if (this.multivalued) {
if (this.value && Array.isArray(this.value)) {
return this.value.map((date) => this.transformDate(date));
return this.value.map((date) => this.transformDate(this.prepareDate(date)));
} else {
return this.default ? [this.default] : [];
}
} else {
return this.value && !Array.isArray(this.value) ? this.transformDate(this.value) : this.default;
return this.value && !Array.isArray(this.value)
? this.transformDate(this.prepareDate(this.value))
: this.default;
}
}
@@ -59,4 +61,8 @@ export class CardViewDateItemModel extends CardViewBaseItemModel<DateItemType> i
this.localizedDatePipe = new LocalizedDatePipe();
return this.localizedDatePipe.transform(value, this.format, this.locale);
}
private prepareDate(date: Date): Date {
return this.type === 'date' ? DateFnsUtils.forceLocal(date) : date;
}
}

View File

@@ -15,9 +15,10 @@
* limitations under the License.
*/
import { format, parse, parseISO, isValid, isBefore, isAfter } from 'date-fns';
import { format, parse, parseISO, isValid, isBefore, isAfter, lightFormat } from 'date-fns';
import { ar, cs, da, de, enUS, es, fi, fr, it, ja, nb, nl, pl, ptBR, ru, sv, zhCN } from 'date-fns/locale';
export class DateFnsUtils {
static getLocaleFromString(locale: string): Locale {
let dateFnsLocale: Locale;
@@ -201,4 +202,13 @@ export class DateFnsUtils {
static localToUtc(date: Date): Date {
return new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds());
}
static forceLocal(date: Date): Date {
return new Date(lightFormat(date, 'yyyy-MM-dd'));
}
static forceUtc(date: Date): Date {
return new Date(lightFormat(date, 'yyyy-MM-dd').concat('T00:00:00.000Z'));
}
}