pb-sxp-ui 1.0.83 → 1.0.85
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/index.cjs +22 -18
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +92 -93
- package/dist/index.js +22 -18
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +22 -18
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/Consent/index.d.ts +0 -1
- package/es/core/components/Consent/index.js +0 -1
- package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/es/core/context/SxpDataSourceProvider.js +21 -17
- package/lib/core/components/Consent/index.d.ts +0 -1
- package/lib/core/components/Consent/index.js +0 -1
- package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/lib/core/context/SxpDataSourceProvider.js +21 -17
- package/package.json +1 -1
@@ -1,7 +1,6 @@
|
|
1
1
|
import React, { memo, useEffect, useMemo } from 'react';
|
2
2
|
import qs from 'qs';
|
3
3
|
import { useSxpDataSource } from '../../../core/hooks';
|
4
|
-
import './index.less';
|
5
4
|
import { AGREE_POLICY } from '../../../core/utils/localStore';
|
6
5
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
7
6
|
const { setIsAgreePolicy, bffEventReport } = useSxpDataSource();
|
@@ -113,6 +113,7 @@ export interface SxpDataSourceProviderProps {
|
|
113
113
|
consentHeight?: number;
|
114
114
|
isOpenConsent?: boolean;
|
115
115
|
globalConfig?: ISxpPageRenderProps['globalConfig'];
|
116
|
+
isEditor?: boolean;
|
116
117
|
}
|
117
118
|
declare const _default: React.NamedExoticComponent<SxpDataSourceProviderProps>;
|
118
119
|
export default _default;
|
@@ -15,8 +15,8 @@ var DataSourceType;
|
|
15
15
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
16
16
|
})(DataSourceType || (DataSourceType = {}));
|
17
17
|
const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
|
18
|
-
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig }) => {
|
19
|
-
var _a, _b, _c
|
18
|
+
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false }) => {
|
19
|
+
var _a, _b, _c;
|
20
20
|
const [rtcList, setRtcList] = useState([]);
|
21
21
|
const [tagList, setTagList] = useState([]);
|
22
22
|
const [loading, setLoading] = useState(false);
|
@@ -33,6 +33,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
33
33
|
const [videoRef, setVideoRef] = useState(null);
|
34
34
|
const themeTag = useRef();
|
35
35
|
const curTime = useRef();
|
36
|
+
const isShowConsent = useMemo(() => {
|
37
|
+
var _a, _b, _c, _d;
|
38
|
+
return (((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent;
|
39
|
+
}, [isAgreePolicy, globalConfig, isOpenConsent, isEditor]);
|
36
40
|
useEffect(() => {
|
37
41
|
const handleChangeThemeTag = (tag) => {
|
38
42
|
themeTag.current = tag;
|
@@ -72,10 +76,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
72
76
|
.catch((err) => Promise.reject(err));
|
73
77
|
}, [bffDataSource]);
|
74
78
|
const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
75
|
-
var
|
79
|
+
var _d, _e, _f, _g, _h;
|
76
80
|
query = {
|
77
|
-
maxSize: (
|
78
|
-
defaultSize: (
|
81
|
+
maxSize: (_d = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _d !== void 0 ? _d : maxSize,
|
82
|
+
defaultSize: (_e = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _e !== void 0 ? _e : defaultSize,
|
79
83
|
'itemFilter.itemId': query === null || query === void 0 ? void 0 : query['itemFilter.itemId'],
|
80
84
|
'itemFilter.itemType': query === null || query === void 0 ? void 0 : query['itemFilter.itemType'],
|
81
85
|
hashTag: query === null || query === void 0 ? void 0 : query.hashTag,
|
@@ -83,10 +87,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
83
87
|
themeTag: query === null || query === void 0 ? void 0 : query.themeTag
|
84
88
|
};
|
85
89
|
if (utmVal) {
|
86
|
-
const val = (
|
90
|
+
const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
|
87
91
|
const key = val.split('=')[0];
|
88
92
|
return UTM_KEYS.includes(key);
|
89
|
-
})) === null ||
|
93
|
+
})) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
|
90
94
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
91
95
|
}
|
92
96
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
|
@@ -98,7 +102,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
98
102
|
return result === null || result === void 0 ? void 0 : result.data;
|
99
103
|
}), [bffFetch, utmVal, maxSize, defaultSize]);
|
100
104
|
const loadVideos = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
101
|
-
var
|
105
|
+
var _j, _k;
|
102
106
|
if (rtcList.length <= 0) {
|
103
107
|
return;
|
104
108
|
}
|
@@ -108,8 +112,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
108
112
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType,
|
109
113
|
themeTag: themeTag.current
|
110
114
|
});
|
111
|
-
setRtcList(rtcList.concat((
|
112
|
-
setCacheRtcList(cacheRtcList.concat((
|
115
|
+
setRtcList(rtcList.concat((_j = data === null || data === void 0 ? void 0 : data.recList) !== null && _j !== void 0 ? _j : []));
|
116
|
+
setCacheRtcList(cacheRtcList.concat((_k = data === null || data === void 0 ? void 0 : data.recList) !== null && _k !== void 0 ? _k : []));
|
113
117
|
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
114
118
|
const bffEventReport = useCallback(({ userInfo, eventInfo }) => {
|
115
119
|
if (!enableReportEvent) {
|
@@ -167,16 +171,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
167
171
|
return res === null || res === void 0 ? void 0 : res.success;
|
168
172
|
}), [bffFetch]);
|
169
173
|
const bffGetTagList = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
170
|
-
var
|
174
|
+
var _l, _m, _o, _p, _q;
|
171
175
|
if (!utmVal || !isShowTag)
|
172
176
|
return;
|
173
177
|
try {
|
174
|
-
const val = (
|
178
|
+
const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
|
175
179
|
const key = val.split('=')[0];
|
176
180
|
return UTM_KEYS.includes(key);
|
177
|
-
})) === null ||
|
181
|
+
})) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
|
178
182
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
179
|
-
setTagList((
|
183
|
+
setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
|
180
184
|
}
|
181
185
|
catch (e) {
|
182
186
|
console.log('e', e);
|
@@ -230,7 +234,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
230
234
|
h5EnterLink();
|
231
235
|
}, []);
|
232
236
|
useEffect(() => {
|
233
|
-
if (
|
237
|
+
if (isShowConsent)
|
234
238
|
return;
|
235
239
|
setLoading(true);
|
236
240
|
bffGetTagList();
|
@@ -250,7 +254,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
250
254
|
setLoading(false);
|
251
255
|
isInit.current = true;
|
252
256
|
});
|
253
|
-
}, [
|
257
|
+
}, [isShowConsent]);
|
254
258
|
useEffect(() => {
|
255
259
|
if (!isInit.current)
|
256
260
|
return;
|
@@ -308,7 +312,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
308
312
|
curTime,
|
309
313
|
h5EnterLink,
|
310
314
|
themeTag
|
311
|
-
} },
|
315
|
+
} }, isShowConsent ? (React.createElement(Consent, Object.assign({}, (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props))) : (render({
|
312
316
|
rtcList,
|
313
317
|
mutateLike: bffMutateLike,
|
314
318
|
mutateUnlike: bffMutateUnlike,
|
@@ -4,7 +4,6 @@ const tslib_1 = require("tslib");
|
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
const qs_1 = tslib_1.__importDefault(require("qs"));
|
6
6
|
const hooks_1 = require("../../../core/hooks");
|
7
|
-
require("./index.less");
|
8
7
|
const localStore_1 = require("../../../core/utils/localStore");
|
9
8
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
10
9
|
const { setIsAgreePolicy, bffEventReport } = (0, hooks_1.useSxpDataSource)();
|
@@ -113,6 +113,7 @@ export interface SxpDataSourceProviderProps {
|
|
113
113
|
consentHeight?: number;
|
114
114
|
isOpenConsent?: boolean;
|
115
115
|
globalConfig?: ISxpPageRenderProps['globalConfig'];
|
116
|
+
isEditor?: boolean;
|
116
117
|
}
|
117
118
|
declare const _default: React.NamedExoticComponent<SxpDataSourceProviderProps>;
|
118
119
|
export default _default;
|
@@ -18,8 +18,8 @@ var DataSourceType;
|
|
18
18
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
19
19
|
})(DataSourceType || (DataSourceType = {}));
|
20
20
|
const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
|
21
|
-
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig }) => {
|
22
|
-
var _a, _b, _c
|
21
|
+
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false }) => {
|
22
|
+
var _a, _b, _c;
|
23
23
|
const [rtcList, setRtcList] = (0, react_1.useState)([]);
|
24
24
|
const [tagList, setTagList] = (0, react_1.useState)([]);
|
25
25
|
const [loading, setLoading] = (0, react_1.useState)(false);
|
@@ -36,6 +36,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
36
36
|
const [videoRef, setVideoRef] = (0, react_1.useState)(null);
|
37
37
|
const themeTag = (0, react_1.useRef)();
|
38
38
|
const curTime = (0, react_1.useRef)();
|
39
|
+
const isShowConsent = (0, react_1.useMemo)(() => {
|
40
|
+
var _a, _b, _c, _d;
|
41
|
+
return (((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent;
|
42
|
+
}, [isAgreePolicy, globalConfig, isOpenConsent, isEditor]);
|
39
43
|
(0, react_1.useEffect)(() => {
|
40
44
|
const handleChangeThemeTag = (tag) => {
|
41
45
|
themeTag.current = tag;
|
@@ -75,10 +79,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
75
79
|
.catch((err) => Promise.reject(err));
|
76
80
|
}, [bffDataSource]);
|
77
81
|
const getRecommendVideos = (0, react_1.useCallback)((query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
78
|
-
var
|
82
|
+
var _d, _e, _f, _g, _h;
|
79
83
|
query = {
|
80
|
-
maxSize: (
|
81
|
-
defaultSize: (
|
84
|
+
maxSize: (_d = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _d !== void 0 ? _d : maxSize,
|
85
|
+
defaultSize: (_e = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _e !== void 0 ? _e : defaultSize,
|
82
86
|
'itemFilter.itemId': query === null || query === void 0 ? void 0 : query['itemFilter.itemId'],
|
83
87
|
'itemFilter.itemType': query === null || query === void 0 ? void 0 : query['itemFilter.itemType'],
|
84
88
|
hashTag: query === null || query === void 0 ? void 0 : query.hashTag,
|
@@ -86,10 +90,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
86
90
|
themeTag: query === null || query === void 0 ? void 0 : query.themeTag
|
87
91
|
};
|
88
92
|
if (utmVal) {
|
89
|
-
const val = (
|
93
|
+
const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
|
90
94
|
const key = val.split('=')[0];
|
91
95
|
return UTM_KEYS.includes(key);
|
92
|
-
})) === null ||
|
96
|
+
})) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
|
93
97
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
94
98
|
}
|
95
99
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
|
@@ -101,7 +105,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
101
105
|
return result === null || result === void 0 ? void 0 : result.data;
|
102
106
|
}), [bffFetch, utmVal, maxSize, defaultSize]);
|
103
107
|
const loadVideos = (0, react_1.useCallback)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
104
|
-
var
|
108
|
+
var _j, _k;
|
105
109
|
if (rtcList.length <= 0) {
|
106
110
|
return;
|
107
111
|
}
|
@@ -111,8 +115,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
111
115
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType,
|
112
116
|
themeTag: themeTag.current
|
113
117
|
});
|
114
|
-
setRtcList(rtcList.concat((
|
115
|
-
setCacheRtcList(cacheRtcList.concat((
|
118
|
+
setRtcList(rtcList.concat((_j = data === null || data === void 0 ? void 0 : data.recList) !== null && _j !== void 0 ? _j : []));
|
119
|
+
setCacheRtcList(cacheRtcList.concat((_k = data === null || data === void 0 ? void 0 : data.recList) !== null && _k !== void 0 ? _k : []));
|
116
120
|
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
117
121
|
const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo }) => {
|
118
122
|
if (!enableReportEvent) {
|
@@ -170,16 +174,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
170
174
|
return res === null || res === void 0 ? void 0 : res.success;
|
171
175
|
}), [bffFetch]);
|
172
176
|
const bffGetTagList = (0, react_1.useCallback)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
173
|
-
var
|
177
|
+
var _l, _m, _o, _p, _q;
|
174
178
|
if (!utmVal || !isShowTag)
|
175
179
|
return;
|
176
180
|
try {
|
177
|
-
const val = (
|
181
|
+
const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
|
178
182
|
const key = val.split('=')[0];
|
179
183
|
return UTM_KEYS.includes(key);
|
180
|
-
})) === null ||
|
184
|
+
})) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
|
181
185
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
182
|
-
setTagList((
|
186
|
+
setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
|
183
187
|
}
|
184
188
|
catch (e) {
|
185
189
|
console.log('e', e);
|
@@ -233,7 +237,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
233
237
|
h5EnterLink();
|
234
238
|
}, []);
|
235
239
|
(0, react_1.useEffect)(() => {
|
236
|
-
if (
|
240
|
+
if (isShowConsent)
|
237
241
|
return;
|
238
242
|
setLoading(true);
|
239
243
|
bffGetTagList();
|
@@ -253,7 +257,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
253
257
|
setLoading(false);
|
254
258
|
isInit.current = true;
|
255
259
|
});
|
256
|
-
}, [
|
260
|
+
}, [isShowConsent]);
|
257
261
|
(0, react_1.useEffect)(() => {
|
258
262
|
if (!isInit.current)
|
259
263
|
return;
|
@@ -311,7 +315,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
311
315
|
curTime,
|
312
316
|
h5EnterLink,
|
313
317
|
themeTag
|
314
|
-
} },
|
318
|
+
} }, isShowConsent ? (react_1.default.createElement(Consent_1.default, Object.assign({}, (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props))) : (render({
|
315
319
|
rtcList,
|
316
320
|
mutateLike: bffMutateLike,
|
317
321
|
mutateUnlike: bffMutateUnlike,
|