👽 [open-formulieren/open-forms#3531] minTime/maxTime validation is mo…

…ved into validate namespace

Following the changes in the types package and
the backend.

CHANGELOG.rst

@@ -2,6 +2,11 @@
 SDK Changelog
 =============
 
+1.6.0 (2023-10-??)
+==================
+
+.. warning:: SDK 1.6.0 requires at least version 2.4.0 of the Open Formulieren API.
+
 1.6.0-alpha.0 (2023-10-02)
 ==========================
 

src/formio/validators/MinMaxTimeValidator.js

@@ -37,8 +37,9 @@ const validateTimeBoundaries = (minBoundary, maxBoundary, timeValue) => {
 const MinMaxTimeValidator = {
   key: 'validate.timeMinMax',
   message(component) {
-    const minTime = moment(component.component.minTime || '00:00:00', 'HH:mm:ss').format('HH:mm');
-    const maxTime = moment(component.component.maxTime || '23:59:59', 'HH:mm:ss').format('HH:mm');
+    const validate = component.component?.validate || {};
+    const minTime = moment(validate?.minTime || '00:00:00', 'HH:mm:ss').format('HH:mm');
+    const maxTime = moment(validate?.maxTime || '23:59:59', 'HH:mm:ss').format('HH:mm');
 
     let errorMessage = component.component.errors?.invalid_time || 'invalid_time';
     const errorKeys = component?.openForms?.validationErrorContext?.minMaxTimeValidatorErrorKeys;
@@ -65,9 +66,10 @@ const MinMaxTimeValidator = {
   check(component, setting, value) {
     if (!value) return true;
 
+    const validate = component.component?.validate || {};
     const {isValid, errorKeys} = validateTimeBoundaries(
-      component.component.minTime,
-      component.component.maxTime,
+      validate?.minTime,
+      validate?.maxTime,
       value
     );
 

src/jstests/formio/components/fixtures/time.js

@@ -1,6 +1,6 @@
 export const timeForm = {
   type: 'form',
-  components: [{label: 'time', key: 'time', type: 'time'}],
+  components: [{label: 'time', key: 'time', type: 'time', validate: {}}],
   title: 'Test Time form',
   display: 'Test Time form',
   name: 'testTimeForm',

src/jstests/formio/components/time.spec.js

@@ -12,8 +12,8 @@ Formio.use(OpenFormsModule);
 describe('Time Component', () => {
   test('Time component with min/max time validation', done => {
     let formJSON = _.cloneDeep(timeForm);
-    formJSON.components[0].minTime = '09:00:00';
-    formJSON.components[0].maxTime = '17:00:00';
+    formJSON.components[0].validate.minTime = '09:00:00';
+    formJSON.components[0].validate.maxTime = '17:00:00';
 
     const validValues = ['09:00:00', '10:30:00', '11:11:11'];
 
@@ -84,7 +84,7 @@ describe('Time Component', () => {
 
   test('Time component with only min time validation', done => {
     let formJSON = _.cloneDeep(timeForm);
-    formJSON.components[0].minTime = '09:00:00';
+    formJSON.components[0].validate.minTime = '09:00:00';
 
     const validValues = ['17:00:00'];
 
@@ -123,7 +123,7 @@ describe('Time Component', () => {
 
   test('Time component with only max time validation', done => {
     let formJSON = _.cloneDeep(timeForm);
-    formJSON.components[0].maxTime = '09:00:00';
+    formJSON.components[0].validate.maxTime = '09:00:00';
 
     const validValues = ['08:00:00'];
 
@@ -162,8 +162,8 @@ describe('Time Component', () => {
 
   test('Time component with min time boundary larger than max time boundary', done => {
     let formJSON = _.cloneDeep(timeForm);
-    formJSON.components[0].maxTime = '01:00:00';
-    formJSON.components[0].minTime = '08:00:00';
+    formJSON.components[0].validate.maxTime = '01:00:00';
+    formJSON.components[0].validate.minTime = '08:00:00';
 
     const validValues = ['09:00:00', '00:30:00'];
 
@@ -209,8 +209,8 @@ describe('Time Component', () => {
       minTime: 'Custom error! Min time {{ minTime }}',
       maxTime: 'Custom error! max time {{ maxTime }}',
     };
-    formJSON.components[0].maxTime = '13:00:00';
-    formJSON.components[0].minTime = '12:00:00';
+    formJSON.components[0].validate.maxTime = '13:00:00';
+    formJSON.components[0].validate.minTime = '12:00:00';
 
     const element = document.createElement('div');
 
@@ -240,8 +240,8 @@ describe('Time Component', () => {
       minTime: 'Custom error! Min time {{ minTime }}',
       maxTime: 'Custom error! max time {{ maxTime }}',
     };
-    formJSON.components[0].maxTime = '01:00:00'; // One o'clock in the night of the next day
-    formJSON.components[0].minTime = '08:00:00';
+    formJSON.components[0].validate.maxTime = '01:00:00'; // One o'clock in the night of the next day
+    formJSON.components[0].validate.minTime = '08:00:00';
 
     const element = document.createElement('div');
 
@@ -271,7 +271,7 @@ describe('Time Component', () => {
       minTime: 'Custom error! Min time {{ minTime }}',
       maxTime: 'Custom error! max time {{ maxTime }}',
     };
-    formJSON.components[0].minTime = '13:00:00';
+    formJSON.components[0].validate.minTime = '13:00:00';
 
     const element = document.createElement('div');
 
@@ -301,7 +301,7 @@ describe('Time Component', () => {
       minTime: 'Custom error! Min time {{ minTime }}',
       maxTime: 'Custom error! Max time {{ maxTime }}',
     };
-    formJSON.components[0].maxTime = '13:00:00';
+    formJSON.components[0].validate.maxTime = '13:00:00';
 
     const element = document.createElement('div');
 
@@ -329,7 +329,7 @@ describe('Time Component', () => {
     formJSON.components[0].errors = {
       invalid_time: '',
     };
-    formJSON.components[0].maxTime = '13:00:00';
+    formJSON.components[0].validate.maxTime = '13:00:00';
 
     const element = document.createElement('div');