@k-int/stripes-kint-components 5.24.0 → 5.25.0
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/CHANGELOG.md +14 -0
- package/es/lib/SASQLookupComponent/SASQLookupComponent.js +4 -2
- package/es/lib/SASQViewComponent/SASQViewComponent.js +27 -4
- package/package.json +1 -1
- package/src/lib/SASQLookupComponent/SASQLookupComponent.js +14 -5
- package/src/lib/SASQViewComponent/SASQViewComponent.js +77 -59
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
# [5.25.0](https://gitlab.com/knowledge-integration/folio/stripes-kint-components/compare/v5.24.1...v5.25.0) (2025-08-06)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Features
|
|
5
|
+
|
|
6
|
+
* SASQRoute ViewComponent QueryPromise/ResponseTransform -- ERM-3771 ([ce4eba3](https://gitlab.com/knowledge-integration/folio/stripes-kint-components/commit/ce4eba3162628bfd89940b60ddf9b41b9beb093f))
|
|
7
|
+
|
|
8
|
+
## [5.24.1](https://gitlab.com/knowledge-integration/folio/stripes-kint-components/compare/v5.24.0...v5.24.1) (2025-07-15)
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
### Bug Fixes
|
|
12
|
+
|
|
13
|
+
* Fallback for "foundValues" in SASQLookupComponent ([501f131](https://gitlab.com/knowledge-integration/folio/stripes-kint-components/commit/501f13125ce8501d62fde2f1e70d5ef5f28bdbdb))
|
|
14
|
+
|
|
1
15
|
# [5.24.0](https://gitlab.com/knowledge-integration/folio/stripes-kint-components/compare/v5.23.0...v5.24.0) (2025-07-02)
|
|
2
16
|
|
|
3
17
|
|
|
@@ -288,8 +288,10 @@ const SASQLookupComponent = /*#__PURE__*/(0, _react.forwardRef)((props, ref) =>
|
|
|
288
288
|
paneSub: kintIntl.formatKintMessage({
|
|
289
289
|
id: 'found#Values',
|
|
290
290
|
overrideValue: labelOverrides?.foundValues
|
|
291
|
-
},
|
|
292
|
-
|
|
291
|
+
},
|
|
292
|
+
// DEPRECATED data.total should NOT be the first call here, but staying for backwards compatibility. Elsewhere we use data.totalRecords
|
|
293
|
+
{
|
|
294
|
+
total: data?.total ?? data?.totalRecords ?? 0
|
|
293
295
|
}),
|
|
294
296
|
...restOfMainPaneProps,
|
|
295
297
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Body, {
|
|
@@ -18,13 +18,22 @@ const SASQViewComponent = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
|
18
18
|
location,
|
|
19
19
|
match,
|
|
20
20
|
path,
|
|
21
|
+
viewQueryPromise = _ref2 => {
|
|
22
|
+
let {
|
|
23
|
+
endpoint,
|
|
24
|
+
ky,
|
|
25
|
+
resourceId
|
|
26
|
+
} = _ref2;
|
|
27
|
+
return ky.get(`${endpoint}/${resourceId}`).json();
|
|
28
|
+
},
|
|
29
|
+
viewResponseTransform = response => response,
|
|
21
30
|
ViewComponent,
|
|
22
|
-
viewQueryNamespaceGenerator =
|
|
31
|
+
viewQueryNamespaceGenerator = _ref3 => {
|
|
23
32
|
let {
|
|
24
33
|
namespace,
|
|
25
34
|
componentId,
|
|
26
35
|
id: passedId
|
|
27
|
-
} =
|
|
36
|
+
} = _ref3;
|
|
28
37
|
const queryNamespace = [namespace, 'SASQ'];
|
|
29
38
|
if (componentId) {
|
|
30
39
|
queryNamespace.push(componentId);
|
|
@@ -51,8 +60,20 @@ const SASQViewComponent = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
|
51
60
|
endpoint,
|
|
52
61
|
id: match?.params?.id,
|
|
53
62
|
match
|
|
54
|
-
}), () =>
|
|
55
|
-
|
|
63
|
+
}), () => {
|
|
64
|
+
return viewQueryPromise({
|
|
65
|
+
ky,
|
|
66
|
+
resourceId: match?.params?.id,
|
|
67
|
+
endpoint: fetchParameters.endpoint
|
|
68
|
+
});
|
|
69
|
+
}, {
|
|
70
|
+
enabled: !!match?.params?.id,
|
|
71
|
+
// select is a parameter supported by useQuery to transform the response
|
|
72
|
+
// Could be possible to instead pass this down along with the queryOptions
|
|
73
|
+
// Additionally this is assuming the viewResponseTransform is a func as opposed to an object
|
|
74
|
+
select: selectData => {
|
|
75
|
+
return viewResponseTransform(selectData);
|
|
76
|
+
}
|
|
56
77
|
});
|
|
57
78
|
(0, _react.useImperativeHandle)(ref, () => ({
|
|
58
79
|
queryProps: {
|
|
@@ -75,6 +96,8 @@ SASQViewComponent.propTypes = {
|
|
|
75
96
|
id: _propTypes.default.string,
|
|
76
97
|
location: _propTypes.default.object,
|
|
77
98
|
match: _propTypes.default.object,
|
|
99
|
+
viewQueryPromise: _propTypes.default.func,
|
|
100
|
+
viewResponseTransform: _propTypes.default.func,
|
|
78
101
|
path: _propTypes.default.string.isRequired,
|
|
79
102
|
ViewComponent: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node])
|
|
80
103
|
};
|
package/package.json
CHANGED
|
@@ -65,7 +65,8 @@ const SASQLookupComponent = forwardRef((props, ref) => {
|
|
|
65
65
|
|
|
66
66
|
return queryNamespace;
|
|
67
67
|
},
|
|
68
|
-
lookupQueryPromise = ({ endpoint, ky, queryParams }) =>
|
|
68
|
+
lookupQueryPromise = ({ endpoint, ky, queryParams }) =>
|
|
69
|
+
ky.get(`${endpoint}${queryParams}`).json(),
|
|
69
70
|
lookupResponseTransform = (response) => response, // Function to transform the response from the query
|
|
70
71
|
mainPaneProps = {},
|
|
71
72
|
mclProps = {},
|
|
@@ -125,7 +126,8 @@ const SASQLookupComponent = forwardRef((props, ref) => {
|
|
|
125
126
|
const filterPaneVisibileKey = `${namespace}-${id}-filterPaneVisibility`;
|
|
126
127
|
|
|
127
128
|
const queryParams = useMemo(
|
|
128
|
-
() =>
|
|
129
|
+
() =>
|
|
130
|
+
queryParameterGenerator(
|
|
129
131
|
// With Typescript this would be a type of SASQ_MAP, and so totalRecords is a valid property in our new shape
|
|
130
132
|
// In generateKiwtQueryParams we can choose to ignore totalRecords, which while being a valid property is not necessary for KIWT queries
|
|
131
133
|
{
|
|
@@ -135,7 +137,13 @@ const SASQLookupComponent = forwardRef((props, ref) => {
|
|
|
135
137
|
},
|
|
136
138
|
query ?? {}
|
|
137
139
|
),
|
|
138
|
-
[
|
|
140
|
+
[
|
|
141
|
+
count,
|
|
142
|
+
currentPage,
|
|
143
|
+
fetchParameters.SASQ_MAP,
|
|
144
|
+
query,
|
|
145
|
+
queryParameterGenerator,
|
|
146
|
+
]
|
|
139
147
|
);
|
|
140
148
|
|
|
141
149
|
const [filterPaneVisible, setFilterPaneVisible] = useLocalStorageState(
|
|
@@ -157,7 +165,7 @@ const SASQLookupComponent = forwardRef((props, ref) => {
|
|
|
157
165
|
return lookupQueryPromise({
|
|
158
166
|
ky,
|
|
159
167
|
queryParams,
|
|
160
|
-
endpoint: fetchParameters.endpoint
|
|
168
|
+
endpoint: fetchParameters.endpoint,
|
|
161
169
|
});
|
|
162
170
|
},
|
|
163
171
|
{
|
|
@@ -350,7 +358,8 @@ const SASQLookupComponent = forwardRef((props, ref) => {
|
|
|
350
358
|
id: 'found#Values',
|
|
351
359
|
overrideValue: labelOverrides?.foundValues,
|
|
352
360
|
},
|
|
353
|
-
|
|
361
|
+
// DEPRECATED data.total should NOT be the first call here, but staying for backwards compatibility. Elsewhere we use data.totalRecords
|
|
362
|
+
{ total: data?.total ?? data?.totalRecords ?? 0 }
|
|
354
363
|
)}
|
|
355
364
|
{...restOfMainPaneProps}
|
|
356
365
|
>
|
|
@@ -3,69 +3,88 @@ import PropTypes from 'prop-types';
|
|
|
3
3
|
|
|
4
4
|
import { useQuery } from 'react-query';
|
|
5
5
|
|
|
6
|
-
import {
|
|
7
|
-
useNamespace,
|
|
8
|
-
useOkapiKy
|
|
9
|
-
} from '@folio/stripes/core';
|
|
6
|
+
import { useNamespace, useOkapiKy } from '@folio/stripes/core';
|
|
10
7
|
|
|
11
|
-
const SASQViewComponent = forwardRef(
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
8
|
+
const SASQViewComponent = forwardRef(
|
|
9
|
+
(
|
|
10
|
+
{
|
|
11
|
+
fetchParameters,
|
|
12
|
+
history,
|
|
13
|
+
id,
|
|
14
|
+
location,
|
|
15
|
+
match,
|
|
16
|
+
path,
|
|
17
|
+
viewQueryPromise = ({ endpoint, ky, resourceId }) =>
|
|
18
|
+
ky.get(`${endpoint}/${resourceId}`).json(),
|
|
19
|
+
viewResponseTransform = (response) => response,
|
|
20
|
+
ViewComponent,
|
|
21
|
+
viewQueryNamespaceGenerator = ({
|
|
22
|
+
namespace,
|
|
23
|
+
componentId,
|
|
24
|
+
id: passedId,
|
|
25
|
+
}) => {
|
|
26
|
+
const queryNamespace = [namespace, 'SASQ'];
|
|
27
|
+
if (componentId) {
|
|
28
|
+
queryNamespace.push(componentId);
|
|
29
|
+
}
|
|
30
|
+
queryNamespace.push('view');
|
|
31
|
+
queryNamespace.push(passedId);
|
|
26
32
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
},
|
|
31
|
-
|
|
33
|
+
return queryNamespace;
|
|
34
|
+
},
|
|
35
|
+
...props
|
|
36
|
+
},
|
|
37
|
+
ref
|
|
38
|
+
) => {
|
|
39
|
+
const { 0: namespace } = useNamespace();
|
|
32
40
|
|
|
33
|
-
|
|
34
|
-
|
|
41
|
+
// If itemEndpoint is available, use that, otherwise use standard endpoint
|
|
42
|
+
const endpoint = fetchParameters?.itemEndpoint ?? fetchParameters?.endpoint;
|
|
35
43
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
44
|
+
const ky = useOkapiKy();
|
|
45
|
+
const { data = {}, ...rest } = useQuery(
|
|
46
|
+
viewQueryNamespaceGenerator({
|
|
47
|
+
componentId: id,
|
|
48
|
+
namespace,
|
|
49
|
+
endpoint,
|
|
50
|
+
id: match?.params?.id,
|
|
51
|
+
match,
|
|
52
|
+
}),
|
|
53
|
+
() => {
|
|
54
|
+
return viewQueryPromise({
|
|
55
|
+
ky,
|
|
56
|
+
resourceId: match?.params?.id,
|
|
57
|
+
endpoint: fetchParameters.endpoint,
|
|
58
|
+
});
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
enabled: !!match?.params?.id,
|
|
62
|
+
// select is a parameter supported by useQuery to transform the response
|
|
63
|
+
// Could be possible to instead pass this down along with the queryOptions
|
|
64
|
+
// Additionally this is assuming the viewResponseTransform is a func as opposed to an object
|
|
65
|
+
select: (selectData) => {
|
|
66
|
+
return viewResponseTransform(selectData);
|
|
67
|
+
},
|
|
68
|
+
}
|
|
69
|
+
);
|
|
50
70
|
|
|
51
|
-
|
|
52
|
-
{
|
|
71
|
+
useImperativeHandle(ref, () => ({
|
|
53
72
|
queryProps: {
|
|
54
73
|
data,
|
|
55
|
-
...rest
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
));
|
|
74
|
+
...rest,
|
|
75
|
+
},
|
|
76
|
+
}));
|
|
59
77
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
}
|
|
78
|
+
return (
|
|
79
|
+
<ViewComponent
|
|
80
|
+
onClose={() => history.push(`${path}${location.search}`)}
|
|
81
|
+
queryProps={{ ...rest }}
|
|
82
|
+
resource={data}
|
|
83
|
+
{...props}
|
|
84
|
+
/>
|
|
85
|
+
);
|
|
86
|
+
}
|
|
87
|
+
);
|
|
69
88
|
|
|
70
89
|
SASQViewComponent.propTypes = {
|
|
71
90
|
fetchParameters: PropTypes.object,
|
|
@@ -73,11 +92,10 @@ SASQViewComponent.propTypes = {
|
|
|
73
92
|
id: PropTypes.string,
|
|
74
93
|
location: PropTypes.object,
|
|
75
94
|
match: PropTypes.object,
|
|
95
|
+
viewQueryPromise: PropTypes.func,
|
|
96
|
+
viewResponseTransform: PropTypes.func,
|
|
76
97
|
path: PropTypes.string.isRequired,
|
|
77
|
-
ViewComponent: PropTypes.oneOfType([
|
|
78
|
-
PropTypes.func,
|
|
79
|
-
PropTypes.node
|
|
80
|
-
]),
|
|
98
|
+
ViewComponent: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
|
|
81
99
|
};
|
|
82
100
|
|
|
83
101
|
export default SASQViewComponent;
|