pb-sxp-ui 1.19.0-alpha.1 → 1.19.0-alpha.3

package/dist/index.cjs

@@ -711,7 +711,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
     const [chatlabsId, setChatlabsId] = React.useState();
     const finalPageData = React.useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
     const pixelPvStatusRef = React.useRef(false);
-    const fbcRef = React.useRef('');
     const isShowConsent = React.useMemo(() => {
         var _a, _b, _c, _d;
         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) &&
@@ -772,23 +771,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         var _a;
         return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
     }, [bffDataSource]);
-    React.useEffect(() => {
-        if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting))
-            return;
-        fbcRef.current = getCookie('_fbc');
-        window.OptanonWrapper = function () {
-            const activeGroups = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups;
-            if (!activeGroups)
-                return;
-            if (!(activeGroups === null || activeGroups === void 0 ? void 0 : activeGroups.includes('4'))) {
-                deleteCookie('_fbc');
-            }
-            else if (fbcRef.current) {
-                setCookie('_fbc', fbcRef.current, 90);
-            }
-        };
-    }, [globalConfig]);
-    const isActiveTargetingCookie = React.useMemo(() => {
+    const getTargetingCookie = () => {
         var _a;
         function getCookie(name) {
             var _a;
@@ -799,11 +782,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             return '';
         }
         decodeURIComponent((_a = getCookie('OptanonConsent')) !== null && _a !== void 0 ? _a : '');
-        if (((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting) && (window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && !(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')))) {
+        console.log('OptanonConsent:', window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups);
+        if (((window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && !(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')))) {
             return true;
         }
         return false;
-    }, [globalConfig]);
+    };
     // bff API 请求方法
     const bffFetch = React.useCallback((path, options, isBota = true) => {
         var _a;
@@ -830,7 +814,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
     }, [bffDataSource, fakeUserId]);
     const bffCollectEvent = React.useCallback((params) => {
         var _a;
-        if (isActiveTargetingCookie)
+        if (getTargetingCookie())
             return Promise.resolve();
         const body = {
             eventName: params === null || params === void 0 ? void 0 : params.eventName,
@@ -842,7 +826,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             body,
             type: 'beacon'
         }, false);
-    }, [bffFetch, bffDataSource, isActiveTargetingCookie]);
+    }, [bffFetch, bffDataSource]);
     React.useEffect(() => {
         // if (typeof (window as any)?.fbq === 'function') {
         const OriginalImage = window.Image;
@@ -852,7 +836,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
             Object.defineProperty(img, 'src', {
                 set(value) {
-                    if (isActiveTargetingCookie && (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') || value.includes('https://www.facebook.com/tr'))) {
+                    if (getTargetingCookie() && (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') || value.includes('https://www.facebook.com/tr'))) {
                         return;
                     }
                     // 继续正常设置 src
@@ -877,7 +861,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             return img;
         };
         // }
-    }, [bffCollectEvent, isActiveTargetingCookie]);
+    }, [bffCollectEvent]);
     React.useEffect(() => {
         // 类型安全声明
         const navigatorWithBeacon = navigator;
@@ -890,7 +874,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         // 覆盖方法
         navigatorWithBeacon.sendBeacon = function (url, data) {
             const urlString = url instanceof URL ? url.href : url.toString();
-            if (isActiveTargetingCookie && (urlString.includes('https://tr.snapchat.com/p') || urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
+            if (getTargetingCookie() && (urlString.includes('https://tr.snapchat.com/p') || urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
                 return true;
             }
             const success = originalSendBeacon(url, data);
@@ -942,7 +926,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         return () => {
             navigatorWithBeacon.sendBeacon = originalSendBeacon;
         };
-    }, [bffCollectEvent, isActiveTargetingCookie]);
+    }, [bffCollectEvent]);
     React.useEffect(() => {
         const _originalFetch = window.fetch;
         // 覆盖 fetch 方法
@@ -964,7 +948,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                     return _originalFetch.apply(this, arguments_1);
                 }
                 try {
-                    if (isActiveTargetingCookie && (url.includes('https://www.google-analytics.com/g/collect') || url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
+                    if (getTargetingCookie() && (url.includes('https://www.google-analytics.com/g/collect') || url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
                         return Promise.resolve(new Response(''));
                     }
                     // 1. 先执行原始请求
@@ -1010,7 +994,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                 }
             });
         };
-    }, [bffCollectEvent, isActiveTargetingCookie]);
+    }, [bffCollectEvent]);
     React.useEffect(() => {
         const originalOpen = XMLHttpRequest.prototype.open;
         const originalSend = XMLHttpRequest.prototype.send;
@@ -1020,7 +1004,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         };
         XMLHttpRequest.prototype.send = function (body) {
             var _a;
-            if (isActiveTargetingCookie && this._url && typeof this._url === 'string' && (this._url.includes('https://rumcollector.uptime.com') || this._url.includes('https://arms-retcode.aliyuncs.com/r.png') || this._url.includes('https://i.giesswein.com/nb-collector'))) {
+            if (getTargetingCookie() && this._url && typeof this._url === 'string' && (this._url.includes('https://rumcollector.uptime.com') || this._url.includes('https://arms-retcode.aliyuncs.com/r.png') || this._url.includes('https://i.giesswein.com/nb-collector'))) {
                 return;
             }
             if (this._url && typeof this._url === 'string' && this._url.includes('https://i.giesswein.com/nb-collector')) {
@@ -1048,7 +1032,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             XMLHttpRequest.prototype.open = originalOpen;
             XMLHttpRequest.prototype.send = originalSend;
         };
-    }, [bffCollectEvent, isActiveTargetingCookie]);
+    }, [bffCollectEvent]);
     React.useEffect(() => {
         if (typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
             window === null || window === void 0 ? void 0 : window.fbq('track', 'PageView');
@@ -1175,10 +1159,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         }
         return expire;
     }, [data]);
-    const bffEventReport = React.useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
+    const bffEventReport = React.useCallback(({ userInfo, eventInfo, reportLayId = true, isActiveTargetingCookie = true }) => {
         var _a, _b;
         // 关闭 BFF 事件上报
-        if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || isActiveTargetingCookie) {
+        if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || (isActiveTargetingCookie && getTargetingCookie())) {
             return;
         }
         // 用户信息都是公共的
@@ -1219,8 +1203,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
         layoutVariantId,
         globalConfig,
         playbookType,
-        bffDataSource,
-        isActiveTargetingCookie
+        bffDataSource
     ]);
     const getEventParamsByJson = React.useCallback((json, product) => {
         var _a, _b, _c;
@@ -1285,7 +1268,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
     }, [fakeUserId]);
     const bffFbReport = React.useCallback(({ eventName, product }) => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || isActiveTargetingCookie) {
+        if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || getTargetingCookie()) {
             return;
         }
         let isPushState = false;
@@ -1351,7 +1334,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
                 type: 'beacon'
             });
         }
-    }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson, isActiveTargetingCookie]);
+    }, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
     const bffMutateLike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
         const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
         return res === null || res === void 0 ? void 0 : res.success;
@@ -19042,6 +19025,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
     const skipLinkRef = React.useRef(false);
     const [pageNum, setPageNum] = React.useState(2);
     const videoWidgetRef = React.useRef(null);
+    const fbcRef = React.useRef('');
     const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5 } = useSxpDataSource();
     const { backMainFeed, productView, jumpToWeb } = useEventReport();
     const isShowFingerTip = React.useMemo(() => {
@@ -19485,6 +19469,35 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
             viewTime.current = new Date();
         }
     }, [openHashtag, data, activeIndex]);
+    React.useEffect(() => {
+        if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting))
+            return;
+        window.OptanonWrapper = function () {
+            var _a, _b;
+            const activeGroups = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups;
+            if (!activeGroups)
+                return;
+            if (activeGroups === null || activeGroups === void 0 ? void 0 : activeGroups.includes('4')) {
+                if (fbcRef.current) {
+                    setCookie('_fbc', fbcRef.current, 90);
+                }
+            }
+            else {
+                fbcRef.current = getCookie('_fbc');
+                deleteCookie('_fbc');
+                const item = data[activeIndex];
+                const traceInfo = ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.traceInfo) || ((_b = item === null || item === void 0 ? void 0 : item.product) === null || _b === void 0 ? void 0 : _b.traceInfo) || '';
+                bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
+                    eventInfo: {
+                        eventSubject: 'refuseCookie',
+                        eventDescription: 'refuseCookie',
+                        traceInfo
+                    },
+                    isActiveTargetingCookie: false
+                });
+            }
+        };
+    }, [globalConfig, bffEventReport, data, activeIndex]);
     const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
         var _a, _b, _c, _d, _e, _f, _g, _h;
         const item = data[activeIndex];