@sitecore-jss/sitecore-jss-react 21.3.0-canary.40 → 21.3.0-canary.41
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.
|
@@ -58,23 +58,25 @@ const FEaaSComponent = (props) => {
|
|
|
58
58
|
return null;
|
|
59
59
|
}
|
|
60
60
|
let data = null;
|
|
61
|
-
if (
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
61
|
+
if (props.fetchedData === null || props.fetchedData === undefined) {
|
|
62
|
+
if ((_b = props.params) === null || _b === void 0 ? void 0 : _b.ComponentDataOverride) {
|
|
63
|
+
// Use override data if provided
|
|
64
|
+
try {
|
|
65
|
+
data = JSON.parse(props.params.ComponentDataOverride);
|
|
66
|
+
}
|
|
67
|
+
catch (e) {
|
|
68
|
+
data = null;
|
|
69
|
+
}
|
|
65
70
|
}
|
|
66
|
-
|
|
67
|
-
data
|
|
71
|
+
else if (props.fields) {
|
|
72
|
+
// Otherwise use datasource data (provided in fields)
|
|
73
|
+
data = (0, utils_1.getDataFromFields)(props.fields);
|
|
68
74
|
}
|
|
69
75
|
}
|
|
70
|
-
else if (props.fields) {
|
|
71
|
-
// Otherwise use datasource data (provided in fields)
|
|
72
|
-
data = (0, utils_1.getDataFromFields)(props.fields);
|
|
73
|
-
}
|
|
74
76
|
// FEaaS control would still be hydrated by client
|
|
75
77
|
// we pass all the props as a workaround to avoid hydration error, until we convert all JSS components to server side
|
|
76
78
|
// this also allows component to fall back to full client-side rendering when template or src is empty
|
|
77
|
-
return (react_1.default.createElement(FEAAS.Component, { data: data, template: props.template
|
|
79
|
+
return (react_1.default.createElement(FEAAS.Component, { data: props.fetchedData || data, template: props.template, cdn: (_c = props.params) === null || _c === void 0 ? void 0 : _c.ComponentHostName, library: (_d = props.params) === null || _d === void 0 ? void 0 : _d.LibraryId, version: (_e = props.params) === null || _e === void 0 ? void 0 : _e.ComponentVersion, component: (_f = props.params) === null || _f === void 0 ? void 0 : _f.ComponentId, instance: (_g = props.params) === null || _g === void 0 ? void 0 : _g.ComponentInstanceId, revision: computedRevision }));
|
|
78
80
|
};
|
|
79
81
|
exports.FEaaSComponent = FEaaSComponent;
|
|
80
82
|
/**
|
|
@@ -88,25 +90,65 @@ function fetchFEaaSComponentServerProps(params, pageState, endpointOverride) {
|
|
|
88
90
|
return __awaiter(this, void 0, void 0, function* () {
|
|
89
91
|
const revisionFallback = pageState && pageState !== layout_1.LayoutServicePageState.Normal ? 'staged' : 'published';
|
|
90
92
|
const src = endpointOverride || (0, exports.composeComponentEndpoint)(params, revisionFallback);
|
|
93
|
+
let template = '';
|
|
94
|
+
let fetchedData = null;
|
|
95
|
+
const fetchDataOptions = params.ComponentDataOverride
|
|
96
|
+
? JSON.parse(params.ComponentDataOverride)
|
|
97
|
+
: {};
|
|
91
98
|
try {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
revisionFallback,
|
|
95
|
-
template,
|
|
96
|
-
};
|
|
99
|
+
template = yield fetchComponentTemplate(src, params, revisionFallback);
|
|
100
|
+
fetchedData = yield fetchData(fetchDataOptions);
|
|
97
101
|
}
|
|
98
102
|
catch (e) {
|
|
99
|
-
console.error(`Fetch FEAAS component from ${src} failed. Ensure the component revision "${params.ComponentRevision ||
|
|
100
|
-
revisionFallback}" is present`);
|
|
101
103
|
console.error(e);
|
|
102
|
-
// leave revision fallback in so we can re-try with client-side rendering
|
|
103
|
-
return {
|
|
104
|
-
revisionFallback,
|
|
105
|
-
};
|
|
106
104
|
}
|
|
105
|
+
return {
|
|
106
|
+
fetchedData,
|
|
107
|
+
revisionFallback,
|
|
108
|
+
template,
|
|
109
|
+
};
|
|
107
110
|
});
|
|
108
111
|
}
|
|
109
112
|
exports.fetchFEaaSComponentServerProps = fetchFEaaSComponentServerProps;
|
|
113
|
+
/**
|
|
114
|
+
* @param {string} src component endpoint
|
|
115
|
+
* @param {FEaaSComponentParams} params rendering parameters for FEAAS component
|
|
116
|
+
* @param {RevisionType} revisionFallback fallback revision to fetch if revision is absent in params
|
|
117
|
+
*/
|
|
118
|
+
function fetchComponentTemplate(src, params, revisionFallback) {
|
|
119
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
120
|
+
try {
|
|
121
|
+
const { template } = yield FEAAS.fetchComponent(src);
|
|
122
|
+
return template;
|
|
123
|
+
}
|
|
124
|
+
catch (error) {
|
|
125
|
+
console.error(`Fetch FEAAS component from ${src} failed. Ensure the component revision "${params.ComponentRevision ||
|
|
126
|
+
revisionFallback}" is present`);
|
|
127
|
+
throw error;
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
/**
|
|
132
|
+
* Fetches component data based on the provided data options.
|
|
133
|
+
* This function asynchronously fetches data using the FEAAS.DataSettings.fetch method.
|
|
134
|
+
*
|
|
135
|
+
* @param {FEAAS.DataOptions} dataOptions - Options to customize data fetching.
|
|
136
|
+
* @returns {Promise<FEAAS.DataScopes>} A promise that resolves with the fetched data,
|
|
137
|
+
* or rejects with an error if data fetching encounters an issue.
|
|
138
|
+
* @throws {Error} If an error occurs during data fetching, it is propagated as an error.
|
|
139
|
+
*/
|
|
140
|
+
function fetchData(dataOptions) {
|
|
141
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
142
|
+
try {
|
|
143
|
+
const fetchedData = yield FEAAS.DataSettings.fetch(dataOptions || {});
|
|
144
|
+
return fetchedData;
|
|
145
|
+
}
|
|
146
|
+
catch (error) {
|
|
147
|
+
console.error('Fetch FEAAS component data settings failed');
|
|
148
|
+
throw error;
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
}
|
|
110
152
|
/**
|
|
111
153
|
* Build component endpoint URL from component's params
|
|
112
154
|
* @param {FEaaSComponentParams} params rendering parameters for FEAAS component
|
|
@@ -29,23 +29,25 @@ export const FEaaSComponent = (props) => {
|
|
|
29
29
|
return null;
|
|
30
30
|
}
|
|
31
31
|
let data = null;
|
|
32
|
-
if (
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
32
|
+
if (props.fetchedData === null || props.fetchedData === undefined) {
|
|
33
|
+
if ((_b = props.params) === null || _b === void 0 ? void 0 : _b.ComponentDataOverride) {
|
|
34
|
+
// Use override data if provided
|
|
35
|
+
try {
|
|
36
|
+
data = JSON.parse(props.params.ComponentDataOverride);
|
|
37
|
+
}
|
|
38
|
+
catch (e) {
|
|
39
|
+
data = null;
|
|
40
|
+
}
|
|
36
41
|
}
|
|
37
|
-
|
|
38
|
-
data
|
|
42
|
+
else if (props.fields) {
|
|
43
|
+
// Otherwise use datasource data (provided in fields)
|
|
44
|
+
data = getDataFromFields(props.fields);
|
|
39
45
|
}
|
|
40
46
|
}
|
|
41
|
-
else if (props.fields) {
|
|
42
|
-
// Otherwise use datasource data (provided in fields)
|
|
43
|
-
data = getDataFromFields(props.fields);
|
|
44
|
-
}
|
|
45
47
|
// FEaaS control would still be hydrated by client
|
|
46
48
|
// we pass all the props as a workaround to avoid hydration error, until we convert all JSS components to server side
|
|
47
49
|
// this also allows component to fall back to full client-side rendering when template or src is empty
|
|
48
|
-
return (React.createElement(FEAAS.Component, { data: data, template: props.template
|
|
50
|
+
return (React.createElement(FEAAS.Component, { data: props.fetchedData || data, template: props.template, cdn: (_c = props.params) === null || _c === void 0 ? void 0 : _c.ComponentHostName, library: (_d = props.params) === null || _d === void 0 ? void 0 : _d.LibraryId, version: (_e = props.params) === null || _e === void 0 ? void 0 : _e.ComponentVersion, component: (_f = props.params) === null || _f === void 0 ? void 0 : _f.ComponentId, instance: (_g = props.params) === null || _g === void 0 ? void 0 : _g.ComponentInstanceId, revision: computedRevision }));
|
|
49
51
|
};
|
|
50
52
|
/**
|
|
51
53
|
* Fetches server component props required for server rendering, based on rendering params.
|
|
@@ -58,21 +60,61 @@ export function fetchFEaaSComponentServerProps(params, pageState, endpointOverri
|
|
|
58
60
|
return __awaiter(this, void 0, void 0, function* () {
|
|
59
61
|
const revisionFallback = pageState && pageState !== LayoutServicePageState.Normal ? 'staged' : 'published';
|
|
60
62
|
const src = endpointOverride || composeComponentEndpoint(params, revisionFallback);
|
|
63
|
+
let template = '';
|
|
64
|
+
let fetchedData = null;
|
|
65
|
+
const fetchDataOptions = params.ComponentDataOverride
|
|
66
|
+
? JSON.parse(params.ComponentDataOverride)
|
|
67
|
+
: {};
|
|
61
68
|
try {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
revisionFallback,
|
|
65
|
-
template,
|
|
66
|
-
};
|
|
69
|
+
template = yield fetchComponentTemplate(src, params, revisionFallback);
|
|
70
|
+
fetchedData = yield fetchData(fetchDataOptions);
|
|
67
71
|
}
|
|
68
72
|
catch (e) {
|
|
73
|
+
console.error(e);
|
|
74
|
+
}
|
|
75
|
+
return {
|
|
76
|
+
fetchedData,
|
|
77
|
+
revisionFallback,
|
|
78
|
+
template,
|
|
79
|
+
};
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* @param {string} src component endpoint
|
|
84
|
+
* @param {FEaaSComponentParams} params rendering parameters for FEAAS component
|
|
85
|
+
* @param {RevisionType} revisionFallback fallback revision to fetch if revision is absent in params
|
|
86
|
+
*/
|
|
87
|
+
function fetchComponentTemplate(src, params, revisionFallback) {
|
|
88
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
89
|
+
try {
|
|
90
|
+
const { template } = yield FEAAS.fetchComponent(src);
|
|
91
|
+
return template;
|
|
92
|
+
}
|
|
93
|
+
catch (error) {
|
|
69
94
|
console.error(`Fetch FEAAS component from ${src} failed. Ensure the component revision "${params.ComponentRevision ||
|
|
70
95
|
revisionFallback}" is present`);
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
96
|
+
throw error;
|
|
97
|
+
}
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* Fetches component data based on the provided data options.
|
|
102
|
+
* This function asynchronously fetches data using the FEAAS.DataSettings.fetch method.
|
|
103
|
+
*
|
|
104
|
+
* @param {FEAAS.DataOptions} dataOptions - Options to customize data fetching.
|
|
105
|
+
* @returns {Promise<FEAAS.DataScopes>} A promise that resolves with the fetched data,
|
|
106
|
+
* or rejects with an error if data fetching encounters an issue.
|
|
107
|
+
* @throws {Error} If an error occurs during data fetching, it is propagated as an error.
|
|
108
|
+
*/
|
|
109
|
+
function fetchData(dataOptions) {
|
|
110
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
111
|
+
try {
|
|
112
|
+
const fetchedData = yield FEAAS.DataSettings.fetch(dataOptions || {});
|
|
113
|
+
return fetchedData;
|
|
114
|
+
}
|
|
115
|
+
catch (error) {
|
|
116
|
+
console.error('Fetch FEAAS component data settings failed');
|
|
117
|
+
throw error;
|
|
76
118
|
}
|
|
77
119
|
});
|
|
78
120
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sitecore-jss/sitecore-jss-react",
|
|
3
|
-
"version": "21.3.0-canary.
|
|
3
|
+
"version": "21.3.0-canary.41",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -62,14 +62,14 @@
|
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
64
|
"@sitecore-feaas/clientside": "^0.3.0",
|
|
65
|
-
"@sitecore-jss/sitecore-jss": "^21.3.0-canary.
|
|
65
|
+
"@sitecore-jss/sitecore-jss": "^21.3.0-canary.41",
|
|
66
66
|
"deep-equal": "^2.1.0",
|
|
67
67
|
"prop-types": "^15.8.1",
|
|
68
68
|
"style-attr": "^1.3.0"
|
|
69
69
|
},
|
|
70
70
|
"description": "",
|
|
71
71
|
"types": "types/index.d.ts",
|
|
72
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "99f1b478d91b9a562ad721b8ca75a64eadc6d73d",
|
|
73
73
|
"files": [
|
|
74
74
|
"dist",
|
|
75
75
|
"types"
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as FEAAS from '@sitecore-feaas/clientside/react';
|
|
1
2
|
import { ComponentFields, LayoutServicePageState } from '@sitecore-jss/sitecore-jss/layout';
|
|
2
3
|
export declare const FEAAS_COMPONENT_RENDERING_NAME = "FEaaSComponent";
|
|
3
4
|
/**
|
|
@@ -28,6 +29,10 @@ type FEaaSComponentServerProps = {
|
|
|
28
29
|
* Default revision to be fetched. Should be 'staged' for editing/preview. Can be overriden by params.ComponentRevision
|
|
29
30
|
*/
|
|
30
31
|
revisionFallback?: RevisionType;
|
|
32
|
+
/**
|
|
33
|
+
* Fetched data from server component props for server rendering, based on rendering params.
|
|
34
|
+
*/
|
|
35
|
+
fetchedData?: FEAAS.DataScopes;
|
|
31
36
|
};
|
|
32
37
|
/**
|
|
33
38
|
* FEaaS props for client side component. Should be used as fallback when server props are not provided.
|