Enable conditional validation of fields in DDF forms

Author: skateman

app/javascript/forms/data-driven-form.jsx

@@ -16,6 +16,7 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 
 import defaultComponentMapper from './mappers/componentMapper';
+import validatorMapper from './mappers/validatorMapper';
 import SpyField from './spy-field';
 
 Validators.messages = {
@@ -60,6 +61,7 @@ const MiqFormRenderer = ({
   return (
     <FormRender
       componentMapper={{ ...componentMapper, 'spy-field': SpyField }}
+      validatorMapper={validatorMapper}
       FormTemplate={MiqFormTemplate}
       schema={{ fields: [...fields, { component: 'spy-field', name: 'spy-field', initialize }], ...schema }}
       {...props}

app/javascript/forms/mappers/validatorMapper.jsx

@@ -0,0 +1,12 @@
+import { parseCondition, validatorMapper } from '@data-driven-forms/react-form-renderer';
+
+const conditionalValidator = fn => ({ condition, ...schema }) => (value, allValues, meta) => (
+  !condition || parseCondition(condition, allValues).result ? fn(schema)(value, allValues, meta) : undefined
+);
+
+const mapper = Object.keys(validatorMapper).reduce((obj, key) => ({
+  ...obj,
+  [key]: conditionalValidator(validatorMapper[key]),
+}), {});
+
+export default mapper;

package.json

@@ -33,8 +33,8 @@
   "dependencies": {
     "@carbon/icons-react": "~10.11.0",
     "@carbon/themes": "~10.12.0",
-    "@data-driven-forms/pf3-component-mapper": "~2.8.13",
-    "@data-driven-forms/react-form-renderer": "~2.8.13",
+    "@data-driven-forms/pf3-component-mapper": "~2.8.23",
+    "@data-driven-forms/react-form-renderer": "~2.8.23",
     "@manageiq/react-ui-components": "~0.11.70",
     "@manageiq/ui-components": "~1.4.3",
     "@pf3/select": "~1.12.6",