feat: [DHIS2-18310] enable non-Gregorian calendars in views & lists & forms

src/components/AppLoader/init.js

@@ -131,7 +131,7 @@ async function initializeMetaDataAsync(dbLocale: string, onQueryApi: Function, m
 
 async function initializeSystemSettingsAsync(
     uiLocale: string,
-    systemSettings: { dateFormat: string, serverTimeZoneId: string },
+    systemSettings: { dateFormat: string, serverTimeZoneId: string, calendar: string, },
 ) {
     const systemSettingsCacheData = await cacheSystemSettings(uiLocale, systemSettings);
     await buildSystemSettingsAsync(systemSettingsCacheData);
@@ -158,7 +158,7 @@ export async function initializeAsync(
     const systemSettings = await onQueryApi({
         resource: 'system/info',
         params: {
-            fields: 'dateFormat,serverTimeZoneId',
+            fields: 'dateFormat,serverTimeZoneId,calendar',
         },
     });
 

src/core_modules/capture-core-utils/date/index.js

@@ -1,2 +1,5 @@
 // @flow
 export { getFormattedStringFromMomentUsingEuropeanGlyphs } from './date.utils';
+export { padWithZeros } from './padWithZeros';
+export { temporalToString } from './temporalToString';
+export { stringToTemporal } from './stringToTemporal';

src/core_modules/capture-core-utils/date/padWithZeros.js

@@ -0,0 +1,12 @@
+// @flow
+
+/**
+ * Pads a string or number with zeros at the start to reach a minimum length
+ * @export
+ * @param {string|number} value - the value to pad
+ * @param {number} length - length required
+ * @returns {string}
+ */
+export function padWithZeros(value: string | number, length: number): string {
+    return String(value).padStart(length, '0');
+}

src/core_modules/capture-core-utils/date/stringToTemporal.js

@@ -0,0 +1,45 @@
+// @flow
+import { Temporal } from '@js-temporal/polyfill';
+
+/**
+ * Converts a date string into a Temporal.PlainDate object using the specified calendar
+ * @export
+ * @param {?string} dateString - The date string to convert
+ * @param {?string} calendarType - The calendar type to use
+ * @param {?string} dateFormat - The current system date format ('YYYY-MM-DD' or 'DD-MM-YYYY')
+ * @returns {(Temporal.PlainDate | null)}
+ */
+
+type PlainDate = {
+    year: number,
+    month: number,
+    day: number
+};
+
+export function stringToTemporal(dateString: ?string,
+    calendar: ?string,
+    dateFormat: ?string): PlainDate | null {
+    if (!dateString) {
+        return null;
+    }
+    try {
+        const dateWithHyphen = dateString.replace(/[\/\.]/g, '-');
+
+        let year; let month; let day;
+
+        if (dateFormat === 'YYYY-MM-DD') {
+            [year, month, day] = dateWithHyphen.split('-').map(Number);
+        }
+        if (dateFormat === 'DD-MM-YYYY') {
+            [day, month, year] = dateWithHyphen.split('-').map(Number);
+        }
+        return Temporal.PlainDate.from({
+            year,
+            month,
+            day,
+            calendar,
+        });
+    } catch (error) {
+        return null;
+    }
+}

src/core_modules/capture-core-utils/date/temporalToString.js

@@ -0,0 +1,33 @@
+// @flow
+import { padWithZeros } from './padWithZeros';
+
+/**
+ * Converts a Temporal.PlainDate to a formatted date string (YYYY-MM-DD or DD-MM-YYYY)
+ * @param {Temporal.PlainDate | null} temporalDate - The Temporal date to convert
+ * @param {?string} dateFormat - The current system date format ('YYYY-MM-DD' or 'DD-MM-YYYY')
+ * @returns {string} Formatted date string, or empty string if invalid
+ */
+
+type PlainDate = {
+    year: number,
+    month: number,
+    day: number
+};
+
+export function temporalToString(temporalDate: PlainDate | null, dateFormat: ?string): string {
+    if (!temporalDate) {
+        return '';
+    }
+
+    try {
+        const year = temporalDate.year;
+        const month = temporalDate.month;
+        const day = temporalDate.day;
+
+        return dateFormat === 'YYYY-MM-DD' ?
+            `${padWithZeros(year, 4)}-${padWithZeros(month, 2)}-${padWithZeros(day, 2)}` :
+            `${padWithZeros(day, 2)}-${padWithZeros(month, 2)}-${padWithZeros(year, 4)}`;
+    } catch (error) {
+        return '';
+    }
+}

src/core_modules/capture-core-utils/parsers/index.js

@@ -1,4 +1,3 @@
 // @flow
-export { parseDate } from './date.parser';
 export { parseNumber } from './number.parser';
 export { parseTime } from './time.parser';

src/core_modules/capture-core/components/D2Form/field/configs/ageField/getAgeFieldConfig.js

@@ -2,6 +2,7 @@
 import { orientations } from '../../../../FormFields/New';
 import { createFieldConfig, createProps } from '../base/configBaseDefaultForm';
 import { AgeFieldForForm } from '../../Components';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import { type DataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -15,6 +16,8 @@ export const getAgeFieldConfig = (metaData: DataElement, options: Object, queryS
         shrinkDisabled: options.formHorizontal,
         dateCalendarWidth: options.formHorizontal ? 250 : 350,
         datePopupAnchorPosition: getCalendarAnchorPosition(options.formHorizontal),
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, options, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateField/getDateFieldConfig.js

@@ -2,6 +2,8 @@
 import moment from 'moment';
 import { createFieldConfig, createProps } from '../base/configBaseDefaultForm';
 import { DateFieldForForm } from '../../Components';
+import { convertDateObjectToDateFormatString } from '../../../../../../capture-core/utils/converters/date';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DateDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -15,7 +17,9 @@ export const getDateFieldConfig = (metaData: DateDataElement, options: Object, q
         maxWidth: options.formHorizontal ? 150 : 350,
         calendarWidth: options.formHorizontal ? 250 : 350,
         popupAnchorPosition: getCalendarAnchorPosition(options.formHorizontal),
-        calendarMaxMoment: !metaData.allowFutureDate ? moment() : undefined,
+        calendarMax: !metaData.allowFutureDate ? convertDateObjectToDateFormatString(moment()) : undefined,
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, options, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateField/getDateFieldConfigForCustomForm.js

@@ -2,6 +2,8 @@
 import moment from 'moment';
 import { createFieldConfig, createProps } from '../base/configBaseCustomForm';
 import { DateFieldForCustomForm } from '../../Components';
+import { convertDateObjectToDateFormatString } from '../../../../../../capture-core/utils/converters/date';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DateDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -10,7 +12,9 @@ export const getDateFieldConfigForCustomForm = (metaData: DateDataElement, optio
         width: 350,
         maxWidth: 350,
         calendarWidth: 350,
-        calendarMaxMoment: !metaData.allowFutureDate ? moment() : undefined,
+        calendarMax: !metaData.allowFutureDate ? convertDateObjectToDateFormatString(moment()) : undefined,
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateRangeField/getDateRangeFieldConfig.js

@@ -1,6 +1,7 @@
 // @flow
 import { createFieldConfig, createProps } from '../base/configBaseDefaultForm';
 import { DateRangeFieldForForm } from '../../Components';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DataElement as MetaDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -14,6 +15,8 @@ export const getDateRangeFieldConfig = (metaData: MetaDataElement, options: Obje
         maxWidth: options.formHorizontal ? 150 : 350,
         calendarWidth: options.formHorizontal ? 250 : 350,
         popupAnchorPosition: getCalendarAnchorPosition(options.formHorizontal),
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, options, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateTimeField/getDateTimeFieldConfig.js

@@ -2,6 +2,7 @@
 import { orientations } from '../../../../FormFields/New';
 import { createFieldConfig, createProps } from '../base/configBaseDefaultForm';
 import { DateTimeFieldForForm } from '../../Components';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DataElement as MetaDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -17,6 +18,8 @@ export const getDateTimeFieldConfig = (metaData: MetaDataElement, options: Objec
         shrinkDisabled: options.formHorizontal,
         calendarWidth: options.formHorizontal ? '250px' : '350px',
         popupAnchorPosition: getCalendarAnchorPosition(options.formHorizontal),
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, options, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateTimeField/getDateTimeFieldConfigForCustomForm.js

@@ -2,6 +2,7 @@
 import { orientations } from '../../../../FormFields/New';
 import { createFieldConfig, createProps } from '../base/configBaseCustomForm';
 import { DateTimeFieldForCustomForm } from '../../Components';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DataElement as MetaDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -12,6 +13,8 @@ export const getDateTimeFieldConfigForCustomForm = (metaData: MetaDataElement, o
         calendarWidth: '350px',
         orientation: orientations.HORIZONTAL,
         shrinkDisabled: false,
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/D2Form/field/configs/dateTimeRangeField/getDateTimeRangeFieldConfig.js

@@ -2,6 +2,7 @@
 import { orientations } from '../../../../FormFields/New';
 import { createFieldConfig, createProps } from '../base/configBaseDefaultForm';
 import { DateTimeRangeFieldForForm } from '../../Components';
+import { systemSettingsStore } from '../../../../../metaDataMemoryStores';
 import type { DataElement as MetaDataElement } from '../../../../../metaData';
 import type { QuerySingleResource } from '../../../../../utils/api/api.types';
 
@@ -17,6 +18,8 @@ export const getDateTimeRangeFieldConfig = (metaData: MetaDataElement, options:
         shrinkDisabled: options.formHorizontal,
         calendarWidth: options.formHorizontal ? 250 : 350,
         popupAnchorPosition: getCalendarAnchorPosition(options.formHorizontal),
+        calendarType: systemSettingsStore.get().calendar,
+        dateFormat: systemSettingsStore.get().dateFormat,
     }, options, metaData);
 
     return createFieldConfig({

src/core_modules/capture-core/components/DataEntries/Enrollment/EnrollmentDataEntry.component.js

@@ -42,6 +42,8 @@ import {
     withAOCFieldBuilder,
     withDataEntryFields,
 } from '../../DataEntryDhis2Helpers';
+import { convertDateObjectToDateFormatString } from '../../../../capture-core/utils/converters/date';
+import { systemSettingsStore } from '../../../metaDataMemoryStores';
 
 const overrideMessagePropNames = {
     errorMessage: 'validationError',
@@ -111,7 +113,11 @@ const getEnrollmentDateSettings = () => {
             required: true,
             calendarWidth: props.formHorizontal ? 250 : 350,
             popupAnchorPosition: getCalendarAnchorPosition(props.formHorizontal),
-            calendarMaxMoment: !props.enrollmentMetadata.allowFutureEnrollmentDate ? moment() : undefined,
+            calendarMax: !props.enrollmentMetadata.allowFutureEnrollmentDate ?
+                convertDateObjectToDateFormatString(moment()) :
+                undefined,
+            calendarType: systemSettingsStore.get().calendar,
+            dateFormat: systemSettingsStore.get().dateFormat,
         }),
         getPropName: () => 'enrolledAt',
         getValidatorContainers: getEnrollmentDateValidatorContainer,
@@ -159,7 +165,11 @@ const getIncidentDateSettings = () => {
             required: true,
             calendarWidth: props.formHorizontal ? 250 : 350,
             popupAnchorPosition: getCalendarAnchorPosition(props.formHorizontal),
-            calendarMaxMoment: !props.enrollmentMetadata.allowFutureIncidentDate ? moment() : undefined,
+            calendarMax: !props.enrollmentMetadata.allowFutureIncidentDate ?
+                convertDateObjectToDateFormatString(moment()) :
+                undefined,
+            calendarType: systemSettingsStore.get().calendar,
+            dateFormat: systemSettingsStore.get().dateFormat,
         }),
         getPropName: () => 'occurredAt',
         getPassOnFieldData: () => true,

src/core_modules/capture-core/components/DataEntries/Enrollment/EnrollmentWithFirstStageDataEntry/EnrollmentWithFirstStageDataEntry.component.js

@@ -25,6 +25,7 @@ import { withCleanUp } from './withCleanUp';
 import { getEventDateValidatorContainers } from './fieldValidators/eventDate.validatorContainersGetter';
 import { stageMainDataIds } from './getDataEntryPropsToInclude';
 import { withTransformPropName } from '../../../../HOC';
+import { systemSettingsStore } from '../../../../metaDataMemoryStores';
 
 const overrideMessagePropNames = {
     errorMessage: 'validationError',
@@ -219,6 +220,8 @@ const getReportDateSettingsFn = () => {
             required: true,
             calendarWidth: props.formHorizontal ? 250 : 350,
             popupAnchorPosition: getCalendarAnchorPosition(props.formHorizontal),
+            calendarType: systemSettingsStore.get().calendar,
+            dateFormat: systemSettingsStore.get().dateFormat,
         }),
         getPropName: () => stageMainDataIds.OCCURRED_AT,
         getValidatorContainers: () => getEventDateValidatorContainers(),