@ukhomeoffice/cop-react-form-renderer 3.3.2 → 3.3.3
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/hooks/useRefData.js +5 -3
- package/dist/utils/Data/refDataToOptions.js +21 -5
- package/dist/utils/Data/refDataToOptions.test.js +68 -0
- package/dist/utils/Data/setupRefDataUrlForComponent.js +36 -6
- package/dist/utils/Data/setupRefDataUrlForComponent.test.js +51 -1
- package/dist/utils/FormPage/getFormPage.js +1 -1
- package/dist/utils/FormPage/getFormPage.test.js +1 -1
- package/package.json +1 -1
package/dist/hooks/useRefData.js
CHANGED
|
@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.default = exports.STATUS_LOADING = exports.STATUS_COMPLETE = void 0;
|
|
9
9
|
|
|
10
|
+
var _copReactComponents = require("@ukhomeoffice/cop-react-components");
|
|
11
|
+
|
|
10
12
|
var _react = require("react");
|
|
11
13
|
|
|
12
14
|
var _Data = _interopRequireDefault(require("../utils/Data"));
|
|
@@ -40,7 +42,7 @@ var getRefDataUrl = function getRefDataUrl(component) {
|
|
|
40
42
|
var data = component.data;
|
|
41
43
|
|
|
42
44
|
if (data && !data.options) {
|
|
43
|
-
return data.url;
|
|
45
|
+
return _copReactComponents.Utils.interpolateString(data.url, component.formData);
|
|
44
46
|
}
|
|
45
47
|
|
|
46
48
|
return undefined;
|
|
@@ -66,13 +68,13 @@ var useRefData = function useRefData(component) {
|
|
|
66
68
|
(0, _react.useEffect)(function () {
|
|
67
69
|
if (!url) {
|
|
68
70
|
if (component.data && component.data.options) {
|
|
69
|
-
setData(_Data.default.refData.toOptions(component.data.options));
|
|
71
|
+
setData(_Data.default.refData.toOptions(component.data.options, component.item));
|
|
70
72
|
}
|
|
71
73
|
|
|
72
74
|
setStatus(STATUS_COMPLETE);
|
|
73
75
|
} else if (_status === _useGetRequest2.STATUS_FETCHED) {
|
|
74
76
|
if (_data) {
|
|
75
|
-
setData(_Data.default.refData.toOptions(_data.data));
|
|
77
|
+
setData(_Data.default.refData.toOptions(_data.data, component.item));
|
|
76
78
|
}
|
|
77
79
|
|
|
78
80
|
setStatus(STATUS_COMPLETE);
|
|
@@ -11,22 +11,38 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
11
11
|
|
|
12
12
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
13
|
|
|
14
|
+
var getValueAndLabel = function getValueAndLabel(opt, itemStructure) {
|
|
15
|
+
var _value;
|
|
16
|
+
|
|
17
|
+
var value = opt.value || opt.id;
|
|
18
|
+
var label = opt.label || opt.name;
|
|
19
|
+
|
|
20
|
+
if (itemStructure) {
|
|
21
|
+
value = opt[itemStructure.value] || value;
|
|
22
|
+
label = opt[itemStructure.label] || label;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
return {
|
|
26
|
+
value: (_value = value) === null || _value === void 0 ? void 0 : _value.toString(),
|
|
27
|
+
label: label
|
|
28
|
+
};
|
|
29
|
+
};
|
|
14
30
|
/**
|
|
15
31
|
* Converts ref data items to options.
|
|
16
32
|
* @param {Array} refDataItems An array of ref data items.
|
|
33
|
+
* @param {Object} itemStructure The structure of the item.
|
|
17
34
|
* @returns An array of options.
|
|
18
35
|
*/
|
|
19
|
-
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
var refDataToOptions = function refDataToOptions(refDataItems, itemStructure) {
|
|
20
39
|
if (Array.isArray(refDataItems)) {
|
|
21
40
|
return refDataItems.map(function (opt) {
|
|
22
41
|
if (typeof opt === 'string') {
|
|
23
42
|
return opt;
|
|
24
43
|
}
|
|
25
44
|
|
|
26
|
-
return _objectSpread(_objectSpread({}, opt),
|
|
27
|
-
value: opt.id || opt.value,
|
|
28
|
-
label: opt.name || opt.label
|
|
29
|
-
});
|
|
45
|
+
return _objectSpread(_objectSpread({}, opt), getValueAndLabel(opt, itemStructure));
|
|
30
46
|
});
|
|
31
47
|
}
|
|
32
48
|
|
|
@@ -124,6 +124,74 @@ describe('utils', function () {
|
|
|
124
124
|
type: 'Delta'
|
|
125
125
|
}]);
|
|
126
126
|
});
|
|
127
|
+
it('can handle refData with custom value and label properties', function () {
|
|
128
|
+
var REF_DATA = [{
|
|
129
|
+
id: 1,
|
|
130
|
+
displayName: 'Alpha'
|
|
131
|
+
}, {
|
|
132
|
+
id: 2,
|
|
133
|
+
displayName: 'Bravo'
|
|
134
|
+
}, {
|
|
135
|
+
id: 3,
|
|
136
|
+
displayName: 'Charlie'
|
|
137
|
+
}];
|
|
138
|
+
var ITEM_STRUCTURE = {
|
|
139
|
+
value: 'id',
|
|
140
|
+
label: 'displayName'
|
|
141
|
+
};
|
|
142
|
+
expect((0, _refDataToOptions.default)(REF_DATA, ITEM_STRUCTURE)).toEqual([{
|
|
143
|
+
id: 1,
|
|
144
|
+
displayName: 'Alpha',
|
|
145
|
+
value: '1',
|
|
146
|
+
label: 'Alpha'
|
|
147
|
+
}, {
|
|
148
|
+
id: 2,
|
|
149
|
+
displayName: 'Bravo',
|
|
150
|
+
value: '2',
|
|
151
|
+
label: 'Bravo'
|
|
152
|
+
}, {
|
|
153
|
+
id: 3,
|
|
154
|
+
displayName: 'Charlie',
|
|
155
|
+
value: '3',
|
|
156
|
+
label: 'Charlie'
|
|
157
|
+
}]);
|
|
158
|
+
});
|
|
159
|
+
it('can handle refData with missing custom value and label properties', function () {
|
|
160
|
+
var REF_DATA = [{
|
|
161
|
+
id: 1,
|
|
162
|
+
name: 'Alpha'
|
|
163
|
+
}, {
|
|
164
|
+
id: 2,
|
|
165
|
+
name: 'Bravo',
|
|
166
|
+
displayName: 'Bravo Zulu'
|
|
167
|
+
}, {
|
|
168
|
+
id: 3,
|
|
169
|
+
objId: 'chaz',
|
|
170
|
+
name: 'Charlie'
|
|
171
|
+
}];
|
|
172
|
+
var ITEM_STRUCTURE = {
|
|
173
|
+
value: 'objId',
|
|
174
|
+
label: 'displayName'
|
|
175
|
+
};
|
|
176
|
+
expect((0, _refDataToOptions.default)(REF_DATA, ITEM_STRUCTURE)).toEqual([{
|
|
177
|
+
id: 1,
|
|
178
|
+
name: 'Alpha',
|
|
179
|
+
value: '1',
|
|
180
|
+
label: 'Alpha'
|
|
181
|
+
}, {
|
|
182
|
+
id: 2,
|
|
183
|
+
name: 'Bravo',
|
|
184
|
+
displayName: 'Bravo Zulu',
|
|
185
|
+
value: '2',
|
|
186
|
+
label: 'Bravo Zulu'
|
|
187
|
+
}, {
|
|
188
|
+
id: 3,
|
|
189
|
+
objId: 'chaz',
|
|
190
|
+
name: 'Charlie',
|
|
191
|
+
value: 'chaz',
|
|
192
|
+
label: 'Charlie'
|
|
193
|
+
}]);
|
|
194
|
+
});
|
|
127
195
|
});
|
|
128
196
|
});
|
|
129
197
|
});
|
|
@@ -7,19 +7,49 @@ exports.default = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _copReactComponents = require("@ukhomeoffice/cop-react-components");
|
|
9
9
|
|
|
10
|
+
var _models = require("../../models");
|
|
11
|
+
|
|
10
12
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
11
13
|
|
|
12
14
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
13
15
|
|
|
14
16
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
15
17
|
|
|
18
|
+
var setupRefDataForContainer = function setupRefDataForContainer(container, data) {
|
|
19
|
+
return _objectSpread(_objectSpread({}, container), {}, {
|
|
20
|
+
components: setupRefDataUrlForComponents(container.components, data)
|
|
21
|
+
});
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
var setupRefDataForCollection = function setupRefDataForCollection(collection, data) {
|
|
25
|
+
return _objectSpread(_objectSpread({}, collection), {}, {
|
|
26
|
+
item: setupRefDataUrlForComponents(collection.item, data)
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
var setupRefDataUrlForComponents = function setupRefDataUrlForComponents(components, data) {
|
|
31
|
+
return components.map(function (component) {
|
|
32
|
+
return setupRefDataUrlForComponent(component, data);
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
|
|
16
36
|
var setupRefDataUrlForComponent = function setupRefDataUrlForComponent(component, data) {
|
|
17
|
-
if (component
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
37
|
+
if (component) {
|
|
38
|
+
if (component.type === _models.ComponentTypes.CONTAINER) {
|
|
39
|
+
return setupRefDataForContainer(component, data);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
if (component.type === _models.ComponentTypes.COLLECTION) {
|
|
43
|
+
return setupRefDataForCollection(component, data);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
if (component.data && component.data.url) {
|
|
47
|
+
return _objectSpread(_objectSpread({}, component), {}, {
|
|
48
|
+
data: _objectSpread(_objectSpread({}, component.data), {}, {
|
|
49
|
+
url: _copReactComponents.Utils.interpolateString(component.data.url, data)
|
|
50
|
+
})
|
|
51
|
+
});
|
|
52
|
+
}
|
|
23
53
|
}
|
|
24
54
|
|
|
25
55
|
return component;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _models = require("../../models");
|
|
4
|
+
|
|
3
5
|
var _setupRefDataUrlForComponent = _interopRequireDefault(require("./setupRefDataUrlForComponent"));
|
|
4
6
|
|
|
5
7
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -34,7 +36,7 @@ describe('utils', function () {
|
|
|
34
36
|
};
|
|
35
37
|
expect((0, _setupRefDataUrlForComponent.default)(COMPONENT, DATA)).toEqual(COMPONENT);
|
|
36
38
|
});
|
|
37
|
-
it('should appropriately
|
|
39
|
+
it('should appropriately update the component URL', function () {
|
|
38
40
|
var COMPONENT = {
|
|
39
41
|
id: 'component',
|
|
40
42
|
// eslint-disable-next-line no-template-curly-in-string
|
|
@@ -78,6 +80,54 @@ describe('utils', function () {
|
|
|
78
80
|
}
|
|
79
81
|
});
|
|
80
82
|
});
|
|
83
|
+
it('should appropriately update the component URLs within a container', function () {
|
|
84
|
+
var COMPONENT = {
|
|
85
|
+
id: 'component',
|
|
86
|
+
// eslint-disable-next-line no-template-curly-in-string
|
|
87
|
+
data: {
|
|
88
|
+
url: '${urls.refData}/v1/teams'
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var CONTAINER = {
|
|
92
|
+
id: 'container',
|
|
93
|
+
type: _models.ComponentTypes.CONTAINER,
|
|
94
|
+
components: [COMPONENT]
|
|
95
|
+
};
|
|
96
|
+
expect((0, _setupRefDataUrlForComponent.default)(CONTAINER, DATA)).toEqual({
|
|
97
|
+
id: CONTAINER.id,
|
|
98
|
+
type: CONTAINER.type,
|
|
99
|
+
components: [{
|
|
100
|
+
id: COMPONENT.id,
|
|
101
|
+
data: {
|
|
102
|
+
url: "".concat(DATA.urls.refData, "/v1/teams")
|
|
103
|
+
}
|
|
104
|
+
}]
|
|
105
|
+
});
|
|
106
|
+
});
|
|
107
|
+
it('should appropriately update the component URLs within a collection', function () {
|
|
108
|
+
var COMPONENT = {
|
|
109
|
+
id: 'component',
|
|
110
|
+
// eslint-disable-next-line no-template-curly-in-string
|
|
111
|
+
data: {
|
|
112
|
+
url: '${urls.refData}/v1/teams'
|
|
113
|
+
}
|
|
114
|
+
};
|
|
115
|
+
var COLLECTION = {
|
|
116
|
+
id: 'container',
|
|
117
|
+
type: _models.ComponentTypes.COLLECTION,
|
|
118
|
+
item: [COMPONENT]
|
|
119
|
+
};
|
|
120
|
+
expect((0, _setupRefDataUrlForComponent.default)(COLLECTION, DATA)).toEqual({
|
|
121
|
+
id: COLLECTION.id,
|
|
122
|
+
type: COLLECTION.type,
|
|
123
|
+
item: [{
|
|
124
|
+
id: COMPONENT.id,
|
|
125
|
+
data: {
|
|
126
|
+
url: "".concat(DATA.urls.refData, "/v1/teams")
|
|
127
|
+
}
|
|
128
|
+
}]
|
|
129
|
+
});
|
|
130
|
+
});
|
|
81
131
|
});
|
|
82
132
|
});
|
|
83
133
|
});
|
|
@@ -48,7 +48,7 @@ var getFormPage = function getFormPage(pageOptions, formComponents, formData) {
|
|
|
48
48
|
ret = _objectSpread({}, componentOptions);
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
-
return formData
|
|
51
|
+
return formData ? _Data.default.refData.setupUrl(ret, formData) : ret;
|
|
52
52
|
});
|
|
53
53
|
var actions = (0, _getPageActions.default)(pageOptions);
|
|
54
54
|
return _Container.default.setup(_objectSpread(_objectSpread({}, pageOptions), {}, {
|