@ukhomeoffice/cop-react-form-renderer 6.14.3 → 6.14.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/CollectionSummary/BannerStrip.scss +4 -0
- package/dist/components/FormPage/FormPage.js +8 -10
- package/dist/components/FormRenderer/FormRenderer.js +5 -10
- package/dist/utils/Condition/meetsCondition.js +2 -2
- package/dist/utils/Validate/validateOnPageLoad.js +23 -0
- package/dist/utils/Validate/validateOnPageLoad.test.js +88 -0
- package/package.json +1 -1
|
@@ -12,6 +12,7 @@ var _utils = _interopRequireDefault(require("../../utils"));
|
|
|
12
12
|
var _FormComponent = _interopRequireDefault(require("../FormComponent"));
|
|
13
13
|
var _PageActions = _interopRequireDefault(require("../PageActions"));
|
|
14
14
|
require("./FormPage.scss");
|
|
15
|
+
var _validateOnPageLoad = require("../../utils/Validate/validateOnPageLoad");
|
|
15
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
17
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
17
18
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
@@ -24,7 +25,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
|
|
|
24
25
|
// Styles
|
|
25
26
|
const DEFAULT_CLASS = exports.DEFAULT_CLASS = 'hods-form__page';
|
|
26
27
|
const FormPage = _ref => {
|
|
27
|
-
var
|
|
28
|
+
var _formPage$actions, _page$actions;
|
|
28
29
|
let {
|
|
29
30
|
page,
|
|
30
31
|
pages,
|
|
@@ -37,8 +38,7 @@ const FormPage = _ref => {
|
|
|
37
38
|
classModifiers,
|
|
38
39
|
className,
|
|
39
40
|
submitting,
|
|
40
|
-
pageId
|
|
41
|
-
fromTarget
|
|
41
|
+
pageId
|
|
42
42
|
} = _ref;
|
|
43
43
|
const [patch, setPatch] = (0, _react.useState)({});
|
|
44
44
|
const {
|
|
@@ -47,12 +47,12 @@ const FormPage = _ref => {
|
|
|
47
47
|
} = (0, _hooks.useValidation)();
|
|
48
48
|
const [patchLabel, setPatchLabel] = (0, _react.useState)({});
|
|
49
49
|
const [isPageRendered, setIsPageRendered] = (0, _react.useState)(false);
|
|
50
|
-
const runOnLoad =
|
|
50
|
+
const runOnLoad = (0, _react.useMemo)(() => (0, _validateOnPageLoad.doValidateOnPageLoad)(page), [page]);
|
|
51
51
|
(0, _react.useEffect)(() => {
|
|
52
52
|
setIsPageRendered(true);
|
|
53
53
|
}, []);
|
|
54
54
|
(0, _react.useEffect)(() => {
|
|
55
|
-
if (isPageRendered &&
|
|
55
|
+
if (isPageRendered && runOnLoad) {
|
|
56
56
|
validate.page(page);
|
|
57
57
|
}
|
|
58
58
|
}, [pageId, isPageRendered]);
|
|
@@ -120,9 +120,9 @@ const FormPage = _ref => {
|
|
|
120
120
|
}));
|
|
121
121
|
let errorMessages = null;
|
|
122
122
|
if (runOnLoad && (errors === null || errors === void 0 ? void 0 : errors.length) > 0) {
|
|
123
|
-
var _page$
|
|
123
|
+
var _page$customValidatio;
|
|
124
124
|
errorMessages = [{
|
|
125
|
-
error: page === null || page === void 0 || (_page$
|
|
125
|
+
error: page === null || page === void 0 || (_page$customValidatio = page.customValidation) === null || _page$customValidatio === void 0 || (_page$customValidatio = _page$customValidatio[0]) === null || _page$customValidatio === void 0 ? void 0 : _page$customValidatio.message
|
|
126
126
|
}];
|
|
127
127
|
} else if ((errors === null || errors === void 0 ? void 0 : errors.length) > 0 && !runOnLoad) {
|
|
128
128
|
errorMessages = errors;
|
|
@@ -174,7 +174,6 @@ FormPage.propTypes = {
|
|
|
174
174
|
}).isRequired,
|
|
175
175
|
pages: _propTypes.default.arrayOf(_propTypes.default.shape({})),
|
|
176
176
|
submitting: _propTypes.default.bool,
|
|
177
|
-
fromTarget: _propTypes.default.bool,
|
|
178
177
|
pageId: _propTypes.default.string.isRequired
|
|
179
178
|
};
|
|
180
179
|
FormPage.defaultProps = {
|
|
@@ -186,7 +185,6 @@ FormPage.defaultProps = {
|
|
|
186
185
|
onTopLevelChange: undefined,
|
|
187
186
|
onWrapperChange: undefined,
|
|
188
187
|
pages: [],
|
|
189
|
-
submitting: false
|
|
190
|
-
fromTarget: false
|
|
188
|
+
submitting: false
|
|
191
189
|
};
|
|
192
190
|
var _default = exports.default = FormPage;
|
|
@@ -54,8 +54,7 @@ const FormRenderer = _ref => {
|
|
|
54
54
|
noChangeAction,
|
|
55
55
|
newPageId,
|
|
56
56
|
viewOnly,
|
|
57
|
-
hideBlankRows
|
|
58
|
-
fromTarget
|
|
57
|
+
hideBlankRows
|
|
59
58
|
} = _ref;
|
|
60
59
|
return /*#__PURE__*/_react.default.createElement(_context.HooksContextProvider, {
|
|
61
60
|
overrides: hooks
|
|
@@ -76,8 +75,7 @@ const FormRenderer = _ref => {
|
|
|
76
75
|
noChangeAction: noChangeAction,
|
|
77
76
|
newPageId: newPageId,
|
|
78
77
|
viewOnly: viewOnly,
|
|
79
|
-
hideBlankRows: hideBlankRows
|
|
80
|
-
fromTarget: fromTarget
|
|
78
|
+
hideBlankRows: hideBlankRows
|
|
81
79
|
})));
|
|
82
80
|
};
|
|
83
81
|
const DEFAULT_CLASS = exports.DEFAULT_CLASS = 'hods-form';
|
|
@@ -100,8 +98,7 @@ const InternalFormRenderer = _ref2 => {
|
|
|
100
98
|
noChangeAction,
|
|
101
99
|
newPageId,
|
|
102
100
|
viewOnly,
|
|
103
|
-
hideBlankRows
|
|
104
|
-
fromTarget
|
|
101
|
+
hideBlankRows
|
|
105
102
|
} = _ref2;
|
|
106
103
|
// Set up the initial states.
|
|
107
104
|
const [data, setData] = (0, _react.useState)({});
|
|
@@ -326,8 +323,7 @@ const InternalFormRenderer = _ref2 => {
|
|
|
326
323
|
classModifiers: formState.page.classModifiers,
|
|
327
324
|
className: formState.page.className,
|
|
328
325
|
submitting: submitting,
|
|
329
|
-
pageId: pageId
|
|
330
|
-
fromTarget: fromTarget
|
|
326
|
+
pageId: pageId
|
|
331
327
|
}), formState.page && !formState.cya && formState.page.collection && /*#__PURE__*/_react.default.createElement(_CollectionPage.default, {
|
|
332
328
|
page: formState.page,
|
|
333
329
|
pages: pages,
|
|
@@ -370,8 +366,7 @@ const propTypes = {
|
|
|
370
366
|
/** See <a href="/?path=/docs/f-json--page#formtypes">FormTypes</a>. */
|
|
371
367
|
type: _propTypes.default.oneOf([_models.FormTypes.CYA, _models.FormTypes.FORM, _models.FormTypes.HUB, _models.FormTypes.TASK, _models.FormTypes.WIZARD, _models.FormTypes.TASK_CYA, _models.FormTypes.FORM_WITH_TASK]).isRequired,
|
|
372
368
|
viewOnly: _propTypes.default.bool,
|
|
373
|
-
hideBlankRows: _propTypes.default.bool
|
|
374
|
-
fromTarget: _propTypes.default.bool.isRequired
|
|
369
|
+
hideBlankRows: _propTypes.default.bool
|
|
375
370
|
};
|
|
376
371
|
const defaultProps = {
|
|
377
372
|
classBlock: DEFAULT_CLASS,
|
|
@@ -69,7 +69,7 @@ const meetsCondition = (condition, value, data) => {
|
|
|
69
69
|
if (!value || !compare) {
|
|
70
70
|
return false;
|
|
71
71
|
}
|
|
72
|
-
const valFloat = parseFloat(value.replace(',', ''));
|
|
72
|
+
const valFloat = Array.isArray(value) ? value.length : parseFloat(value.replace(',', ''));
|
|
73
73
|
const compareFloat = parseFloat(compare.replace(',', ''));
|
|
74
74
|
return valFloat < compareFloat;
|
|
75
75
|
}
|
|
@@ -78,7 +78,7 @@ const meetsCondition = (condition, value, data) => {
|
|
|
78
78
|
if (!value || !compare) {
|
|
79
79
|
return false;
|
|
80
80
|
}
|
|
81
|
-
const valFloat = parseFloat(value.replace(/,/g, ''));
|
|
81
|
+
const valFloat = Array.isArray(value) ? value.length : parseFloat(value.replace(/,/g, ''));
|
|
82
82
|
const compareFloat = parseFloat(compare.replace(/,/g, ''));
|
|
83
83
|
return valFloat > compareFloat;
|
|
84
84
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.doValidateOnPageLoad = void 0;
|
|
7
|
+
var _Condition = _interopRequireDefault(require("../Condition"));
|
|
8
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
+
const doValidateOnPageLoad = page => {
|
|
10
|
+
var _validation$runWhen, _validation$runWhen2;
|
|
11
|
+
if (!(page !== null && page !== void 0 && page.customValidation)) return false;
|
|
12
|
+
|
|
13
|
+
// Find the validation with `onLoad` set to true
|
|
14
|
+
const validation = page === null || page === void 0 ? void 0 : page.customValidation.find(item => {
|
|
15
|
+
var _item$runWhen;
|
|
16
|
+
return ((_item$runWhen = item.runWhen) === null || _item$runWhen === void 0 ? void 0 : _item$runWhen.onLoad) === true;
|
|
17
|
+
});
|
|
18
|
+
if (!validation) return false;
|
|
19
|
+
|
|
20
|
+
// Check if the constraint is met using the condition
|
|
21
|
+
return (_validation$runWhen = validation.runWhen) !== null && _validation$runWhen !== void 0 && _validation$runWhen.constraint ? _Condition.default.meetsOne((_validation$runWhen2 = validation.runWhen) === null || _validation$runWhen2 === void 0 ? void 0 : _validation$runWhen2.constraint, page.formData) : false;
|
|
22
|
+
};
|
|
23
|
+
exports.doValidateOnPageLoad = doValidateOnPageLoad;
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _Condition = _interopRequireDefault(require("../Condition"));
|
|
4
|
+
var _validateOnPageLoad = require("./validateOnPageLoad");
|
|
5
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
6
|
+
describe('doValidateOnPageLoad', () => {
|
|
7
|
+
const formData = {
|
|
8
|
+
people: [{
|
|
9
|
+
name: 'John Doe'
|
|
10
|
+
}, {
|
|
11
|
+
name: 'Jane Doe'
|
|
12
|
+
}]
|
|
13
|
+
};
|
|
14
|
+
it('should return false if page.customValidation is not defined', () => {
|
|
15
|
+
const page = {
|
|
16
|
+
formData
|
|
17
|
+
};
|
|
18
|
+
const result = (0, _validateOnPageLoad.doValidateOnPageLoad)(page);
|
|
19
|
+
expect(result).toBe(false);
|
|
20
|
+
});
|
|
21
|
+
it('should return false if no validation item has onLoad set to true', () => {
|
|
22
|
+
const page = {
|
|
23
|
+
customValidation: [{
|
|
24
|
+
message: "Validation without onLoad",
|
|
25
|
+
runWhen: {
|
|
26
|
+
onLoad: false
|
|
27
|
+
}
|
|
28
|
+
}],
|
|
29
|
+
formData
|
|
30
|
+
};
|
|
31
|
+
const result = (0, _validateOnPageLoad.doValidateOnPageLoad)(page);
|
|
32
|
+
expect(result).toBe(false);
|
|
33
|
+
});
|
|
34
|
+
it('should return false if validation constraint is not met', () => {
|
|
35
|
+
const page = {
|
|
36
|
+
customValidation: [{
|
|
37
|
+
message: "Update all people details before continuing",
|
|
38
|
+
runWhen: {
|
|
39
|
+
onLoad: true,
|
|
40
|
+
constraint: [{
|
|
41
|
+
field: 'people',
|
|
42
|
+
op: _Condition.default.GREATER_THAN,
|
|
43
|
+
value: 3 // Condition that will fail
|
|
44
|
+
}]
|
|
45
|
+
}
|
|
46
|
+
}],
|
|
47
|
+
formData
|
|
48
|
+
};
|
|
49
|
+
jest.spyOn(_Condition.default, 'meetsOne').mockImplementation(() => false);
|
|
50
|
+
const result = (0, _validateOnPageLoad.doValidateOnPageLoad)(page);
|
|
51
|
+
expect(result).toBe(false);
|
|
52
|
+
expect(_Condition.default.meetsOne).toHaveBeenCalledWith(page.customValidation[0].runWhen.constraint, formData);
|
|
53
|
+
});
|
|
54
|
+
it('should return true if validation constraint is met', () => {
|
|
55
|
+
const page = {
|
|
56
|
+
customValidation: [{
|
|
57
|
+
message: "Update all people details before continuing",
|
|
58
|
+
runWhen: {
|
|
59
|
+
onLoad: true,
|
|
60
|
+
constraint: [{
|
|
61
|
+
field: 'people',
|
|
62
|
+
op: _Condition.default.GREATER_THAN,
|
|
63
|
+
value: 0 // Condition that will pass
|
|
64
|
+
}]
|
|
65
|
+
}
|
|
66
|
+
}],
|
|
67
|
+
formData
|
|
68
|
+
};
|
|
69
|
+
jest.spyOn(_Condition.default, 'meetsOne').mockImplementation(() => true);
|
|
70
|
+
const result = (0, _validateOnPageLoad.doValidateOnPageLoad)(page);
|
|
71
|
+
expect(result).toBe(true);
|
|
72
|
+
expect(_Condition.default.meetsOne).toHaveBeenCalledWith(page.customValidation[0].runWhen.constraint, formData);
|
|
73
|
+
});
|
|
74
|
+
it('should return false if no matching validation is found', () => {
|
|
75
|
+
const page = {
|
|
76
|
+
customValidation: [{
|
|
77
|
+
message: "Validation without constraint",
|
|
78
|
+
runWhen: {
|
|
79
|
+
onLoad: true,
|
|
80
|
+
constraint: null
|
|
81
|
+
}
|
|
82
|
+
}],
|
|
83
|
+
formData
|
|
84
|
+
};
|
|
85
|
+
const result = (0, _validateOnPageLoad.doValidateOnPageLoad)(page);
|
|
86
|
+
expect(result).toBe(false);
|
|
87
|
+
});
|
|
88
|
+
});
|