diff --git a/packages/form-js-viewer/src/render/components/form-fields/Datetime.js b/packages/form-js-viewer/src/render/components/form-fields/Datetime.js index f92b5ef41..ea98f135c 100644 --- a/packages/form-js-viewer/src/render/components/form-fields/Datetime.js +++ b/packages/form-js-viewer/src/render/components/form-fields/Datetime.js @@ -15,7 +15,7 @@ import { Timepicker } from './parts/Timepicker'; import { formFieldClasses, prefixId } from '../Util'; import { sanitizeDateTimePickerValue } from '../util/sanitizerUtil'; -import { parseIsoTime, serializeDate, serializeDateTime, serializeTime } from '../util/dateTimeUtil'; +import { parseIsoTime, serializeDate, serializeDateTime, serializeTime, getNullDateTime, isValidDate, isValidTime } from '../util/dateTimeUtil'; const type = 'datetime'; @@ -49,14 +49,9 @@ export function Datetime(props) { const { formId } = useContext(FormContext); const dateTimeGroupRef = useRef(); - const getNullDateTime = () => ({ date: new Date(Date.parse(null)), time: null }); - const [ dateTime, setDateTime ] = useState(getNullDateTime()); const [ dateTimeUpdateRequest, setDateTimeUpdateRequest ] = useState(null); - const isValidDate = (date) => date && !isNaN(date.getTime()); - const isValidTime = (time) => !isNaN(parseInt(time)); - const useDatePicker = useMemo(() => subtype === DATETIME_SUBTYPES.DATE || subtype === DATETIME_SUBTYPES.DATETIME, [ subtype ]); const useTimePicker = useMemo(() => subtype === DATETIME_SUBTYPES.TIME || subtype === DATETIME_SUBTYPES.DATETIME, [ subtype ]); @@ -113,9 +108,13 @@ export function Datetime(props) { newDateTimeValue = serializeDateTime(date, time, timeSerializingFormat); } + if (value === newDateTimeValue) { + return; + } + onChange({ value: newDateTimeValue, field }); - }, [ field, onChange, subtype, timeSerializingFormat ]); + }, [ value, field, onChange, subtype, timeSerializingFormat ]); useEffect(() => { if (dateTimeUpdateRequest) { diff --git a/packages/form-js-viewer/src/render/components/util/dateTimeUtil.js b/packages/form-js-viewer/src/render/components/util/dateTimeUtil.js index f200149a9..5c52b3e86 100644 --- a/packages/form-js-viewer/src/render/components/util/dateTimeUtil.js +++ b/packages/form-js-viewer/src/render/components/util/dateTimeUtil.js @@ -212,6 +212,21 @@ export function isInvalidDateString(value) { return isNaN(new Date(Date.parse(value)).getTime()); } +export function getNullDateTime() { + return { + date: new Date(Date.parse(null)), + time: null + }; +} + +export function isValidDate(date) { + return date && !isNaN(date.getTime()); +} + +export function isValidTime(time) { + return !isNaN(parseInt(time)); +} + function _getSignedPaddedHours(minutes) { if (minutes > 0) { return '-' + _getZeroPaddedString(Math.floor(minutes / 60));