pb-sxp-ui 1.20.2 → 1.20.4

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.
Files changed (45) hide show
  1. package/dist/index.cjs +379 -123
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +379 -123
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +7 -7
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +7 -7
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +379 -123
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +7 -7
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/LikeButton/index.js +12 -4
  14. package/es/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  15. package/es/core/components/SxpPageRender/WaterFall/List.js +12 -22
  16. package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +6 -4
  17. package/es/core/components/SxpPageRender/WaterFall/index.js +6 -2
  18. package/es/core/components/SxpPageRender/index.js +62 -16
  19. package/es/core/context/SxpDataSourceProvider.d.ts +8 -3
  20. package/es/core/context/SxpDataSourceProvider.js +63 -43
  21. package/es/core/utils/tool.d.ts +2 -1
  22. package/es/core/utils/tool.js +15 -1
  23. package/es/materials/sxp/cta/AniLink/index.js +18 -7
  24. package/es/materials/sxp/cta/AniLinkPopup/index.js +21 -10
  25. package/es/materials/sxp/popup/CommodityDetail/index.js +59 -2
  26. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +60 -3
  27. package/es/materials/sxp/popup/CommodityList/index.js +21 -5
  28. package/es/materials/sxp/template/components/EventProvider.js +22 -10
  29. package/lib/core/components/SxpPageRender/LikeButton/index.js +12 -4
  30. package/lib/core/components/SxpPageRender/VideoWidget/index.js +6 -2
  31. package/lib/core/components/SxpPageRender/WaterFall/List.js +11 -21
  32. package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +6 -4
  33. package/lib/core/components/SxpPageRender/WaterFall/index.js +6 -2
  34. package/lib/core/components/SxpPageRender/index.js +62 -16
  35. package/lib/core/context/SxpDataSourceProvider.d.ts +8 -3
  36. package/lib/core/context/SxpDataSourceProvider.js +61 -41
  37. package/lib/core/utils/tool.d.ts +2 -1
  38. package/lib/core/utils/tool.js +16 -1
  39. package/lib/materials/sxp/cta/AniLink/index.js +18 -7
  40. package/lib/materials/sxp/cta/AniLinkPopup/index.js +21 -10
  41. package/lib/materials/sxp/popup/CommodityDetail/index.js +59 -2
  42. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +60 -3
  43. package/lib/materials/sxp/popup/CommodityList/index.js +21 -5
  44. package/lib/materials/sxp/template/components/EventProvider.js +22 -10
  45. package/package.json +1 -1
package/dist/pb-ui.js CHANGED
@@ -300,6 +300,20 @@
300
300
  document.cookie = `${name}=; ${expiration}${pathPart}${domainPart}`;
301
301
  console.log(`已尝试删除Cookie: ${name}`);
302
302
  }
303
+ function getUrlParamByKey(key) {
304
+ var _a, _b;
305
+ const queryString = location.search.slice(1);
306
+ const params = {};
307
+ (_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
308
+ const key = val.split('=')[0];
309
+ const value = val.split('=')[1];
310
+ params[key] = value;
311
+ });
312
+ for (const key in params) {
313
+ params[key] = params[key].replace(/%2B/g, '+');
314
+ }
315
+ return (_b = params[key]) !== null && _b !== void 0 ? _b : '';
316
+ }
303
317
 
304
318
  function unzip(b64Data) {
305
319
  const strData = atob(b64Data);
@@ -983,7 +997,7 @@
983
997
  }
984
998
  });
985
999
  };
986
- }, [bffCollectEvent]);
1000
+ }, []);
987
1001
  React.useEffect(() => {
988
1002
  const originalOpen = XMLHttpRequest.prototype.open;
989
1003
  const originalSend = XMLHttpRequest.prototype.send;
@@ -1194,19 +1208,51 @@
1194
1208
  playbookType,
1195
1209
  bffDataSource
1196
1210
  ]);
1197
- const getEventParamsByJson = React.useCallback((json, product) => {
1198
- var _a, _b, _c;
1211
+ const getEventParamsByJson = React.useCallback((_a) => {
1212
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
1213
+ var { json, product = [], rec, contentType = 'post', position, eventName } = _a, props = __rest(_a, ["json", "product", "rec", "contentType", "position", "eventName"]);
1199
1214
  const jsonParams = lodash.cloneDeep(json);
1200
1215
  const urlParams = new URLSearchParams(window.location.search);
1201
1216
  const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
1202
1217
  const fix_par = {
1203
- event_source_url: (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href,
1218
+ event_source_url: (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href,
1204
1219
  external_id: fakeUserId,
1205
- client_user_agent: (_c = (_b = window === null || window === void 0 ? void 0 : window.navigator) === null || _b === void 0 ? void 0 : _b.userAgent) !== null && _c !== void 0 ? _c : '',
1220
+ client_user_agent: (_d = (_c = window === null || window === void 0 ? void 0 : window.navigator) === null || _c === void 0 ? void 0 : _c.userAgent) !== null && _d !== void 0 ? _d : '',
1206
1221
  fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
1207
1222
  fbp: getCookie('_fbp') ? `${getCookie('_fbp')}` : '',
1208
1223
  time: Math.floor(Date.now() / 1000)
1209
1224
  };
1225
+ let customData = Object.assign({
1226
+ // funnel_type
1227
+ content_ids: [(_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.itemId, ...((_f = product === null || product === void 0 ? void 0 : product.map((item) => item === null || item === void 0 ? void 0 : item.itemId)) !== null && _f !== void 0 ? _f : [])], content_type: contentType, content_name: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.title, total_posts: rtcList === null || rtcList === void 0 ? void 0 : rtcList.length, position,
1228
+ // content_category
1229
+ currency: (_h = product === null || product === void 0 ? void 0 : product[0]) === null || _h === void 0 ? void 0 : _h.currency, contents: (_j = product === null || product === void 0 ? void 0 : product.map((item) => ({
1230
+ item_id: item === null || item === void 0 ? void 0 : item.itemId,
1231
+ item_price: item === null || item === void 0 ? void 0 : item.price
1232
+ }))) !== null && _j !== void 0 ? _j : [], image_urls: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) !== null && _l !== void 0 ? _l : [], video_urls: (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.url,
1233
+ // prompt
1234
+ headline: getUrlParamByKey('headline'), scene: getUrlParamByKey('scene'), campaign_id: getUrlParamByKey('campaign_id'), ad_id: getUrlParamByKey('ad_id'), utm_source: getUrlParamByKey('utm_source'), utm_medium: getUrlParamByKey('utm_medium'), utm_campaign: getUrlParamByKey('utm_campaign'), utm_content: getUrlParamByKey('utm_content') }, props);
1235
+ if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) && !((_q = (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.imgUrls) === null || _q === void 0 ? void 0 : _q.length) && (rec === null || rec === void 0 ? void 0 : rec.product) && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _r === void 0 ? void 0 : _r.length) > 0) {
1236
+ const product = rec === null || rec === void 0 ? void 0 : rec.product;
1237
+ const productCustomData = {
1238
+ content_ids: [product === null || product === void 0 ? void 0 : product.itemId],
1239
+ content_type: 'product',
1240
+ content_name: '',
1241
+ contents: [{
1242
+ item_id: product === null || product === void 0 ? void 0 : product.itemId,
1243
+ item_price: product === null || product === void 0 ? void 0 : product.price
1244
+ }],
1245
+ image_urls: (_s = product.homePage) !== null && _s !== void 0 ? _s : []
1246
+ };
1247
+ customData = Object.assign(Object.assign({}, customData), productCustomData);
1248
+ }
1249
+ if (eventName === 'ContentSwipe' || eventName === 'Engagement' || eventName === 'ExitFeed') {
1250
+ const deleteKeys = ['content_ids', 'content_category', 'currency', 'contents', 'image_urls', 'video_urls', 'prompt'];
1251
+ deleteKeys.forEach(key => {
1252
+ if (customData === null || customData === void 0 ? void 0 : customData[key])
1253
+ delete customData[key];
1254
+ });
1255
+ }
1210
1256
  const regex = /\{\{(.*?)\}\}/g;
1211
1257
  const getEventParams = (obj) => {
1212
1258
  if (!obj)
@@ -1219,6 +1265,9 @@
1219
1265
  if (Object.prototype.hasOwnProperty.call(obj, key)) {
1220
1266
  const value = obj === null || obj === void 0 ? void 0 : obj[key];
1221
1267
  if (typeof value === 'object') {
1268
+ if (key === 'custom_data') {
1269
+ obj[key] = customData !== null && customData !== void 0 ? customData : {};
1270
+ }
1222
1271
  getEventParams(value);
1223
1272
  }
1224
1273
  else if (typeof value === 'string') {
@@ -1228,7 +1277,7 @@
1228
1277
  var _a;
1229
1278
  const prop = match.substring(2, match.length - 2);
1230
1279
  try {
1231
- let replaceValue = new Function('fix_par', 'product', `return ${prop}`)(fix_par, product);
1280
+ let replaceValue = new Function('fix_par', 'product', `return ${prop}`)(fix_par, product === null || product === void 0 ? void 0 : product[0]);
1232
1281
  if (replaceValue) {
1233
1282
  if ((prop === null || prop === void 0 ? void 0 : prop.indexOf('currency')) !== -1 &&
1234
1283
  (replaceValue === null || replaceValue === void 0 ? void 0 : replaceValue.indexOf('-')) !== -1 &&
@@ -1253,15 +1302,17 @@
1253
1302
  }
1254
1303
  };
1255
1304
  getEventParams(jsonParams);
1305
+ console.log('capi event params:', jsonParams);
1256
1306
  return jsonParams;
1257
- }, [fakeUserId]);
1258
- const bffFbReport = React.useCallback(({ eventName, product }) => {
1259
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
1307
+ }, [fakeUserId, globalConfig, rtcList]);
1308
+ const bffFbReport = React.useCallback((_a) => {
1309
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
1310
+ var { eventName } = _a, props = __rest(_a, ["eventName"]);
1260
1311
  if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || getTargetingCookie()) {
1261
1312
  return;
1262
1313
  }
1263
1314
  let isPushState = false;
1264
- const pixelEventParamsJson = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _a === void 0 ? void 0 : _a[eventName];
1315
+ const pixelEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.pixel) === null || _b === void 0 ? void 0 : _b[eventName];
1265
1316
  if ((pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
1266
1317
  function updateQueryStringParameter(uri, key, value) {
1267
1318
  const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
@@ -1285,39 +1336,39 @@
1285
1336
  }
1286
1337
  }
1287
1338
  else {
1288
- window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, getEventParamsByJson(pixelEventParamsJson, product));
1339
+ window === null || window === void 0 ? void 0 : window.fbq('track', pixelEventParamsJson === null || pixelEventParamsJson === void 0 ? void 0 : pixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: pixelEventParamsJson, eventName }, props)));
1289
1340
  }
1290
1341
  }
1291
1342
  if (!isPushState) {
1292
1343
  if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
1293
1344
  window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
1294
1345
  }
1295
- const tiktokPixelEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.tiktokPixel) === null || _b === void 0 ? void 0 : _b[eventName];
1346
+ const tiktokPixelEventParamsJson = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.tiktokPixel) === null || _c === void 0 ? void 0 : _c[eventName];
1296
1347
  if ((tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name) &&
1297
1348
  typeof (window === null || window === void 0 ? void 0 : window.ttq) === 'object' &&
1298
- typeof ((_c = window === null || window === void 0 ? void 0 : window.ttq) === null || _c === void 0 ? void 0 : _c.track) === 'function') {
1299
- (_d = window === null || window === void 0 ? void 0 : window.ttq) === null || _d === void 0 ? void 0 : _d.track(tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name, getEventParamsByJson(tiktokPixelEventParamsJson, product));
1349
+ typeof ((_d = window === null || window === void 0 ? void 0 : window.ttq) === null || _d === void 0 ? void 0 : _d.track) === 'function') {
1350
+ (_e = window === null || window === void 0 ? void 0 : window.ttq) === null || _e === void 0 ? void 0 : _e.track(tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: tiktokPixelEventParamsJson, eventName }, props)));
1300
1351
  }
1301
1352
  }
1302
- const snapchatPixelEventParamsJson = (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.snapchatPixel) === null || _e === void 0 ? void 0 : _e[eventName];
1353
+ const snapchatPixelEventParamsJson = (_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.snapchatPixel) === null || _f === void 0 ? void 0 : _f[eventName];
1303
1354
  if ((snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.snaptr) === 'function') {
1304
- window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(snapchatPixelEventParamsJson, product));
1355
+ window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: snapchatPixelEventParamsJson, eventName }, props)));
1305
1356
  }
1306
- if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' && typeof ((_f = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _f === void 0 ? void 0 : _f.trackPageView) === 'function') {
1307
- (_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView();
1357
+ if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' && typeof ((_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView) === 'function') {
1358
+ (_h = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _h === void 0 ? void 0 : _h.trackPageView();
1308
1359
  }
1309
- const converApiEventParamsJson = (_h = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _h === void 0 ? void 0 : _h[eventName];
1360
+ const converApiEventParamsJson = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _j === void 0 ? void 0 : _j[eventName];
1310
1361
  if (enabledMetaConversionApi && converApiEventParamsJson) {
1311
- const body = getEventParamsByJson(converApiEventParamsJson, product);
1362
+ const body = getEventParamsByJson(Object.assign({ json: converApiEventParamsJson, eventName }, props));
1312
1363
  const params = {};
1313
1364
  const queryString = location.search.slice(1);
1314
- (_j = splitUrlParams(queryString)) === null || _j === void 0 ? void 0 : _j.forEach((val) => {
1365
+ (_k = splitUrlParams(queryString)) === null || _k === void 0 ? void 0 : _k.forEach((val) => {
1315
1366
  const key = val.split('=')[0];
1316
1367
  const value = val.split('=')[1];
1317
1368
  params[key] = value;
1318
1369
  });
1319
1370
  const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
1320
- bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_k = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _k === void 0 ? void 0 : _k['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
1371
+ bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/fb/${(_l = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _l === void 0 ? void 0 : _l['x-app-id']}/${eventName}${cl_source ? `/${decodeURIComponent(cl_source)}` : ''}`, {
1321
1372
  method: 'POST',
1322
1373
  body,
1323
1374
  type: 'beacon'
@@ -1355,7 +1406,7 @@
1355
1406
  console.log('e', e);
1356
1407
  }
1357
1408
  }), [bffFetch, utmVal]);
1358
- const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
1409
+ const ctaEvent = React.useCallback((eventInfo, rec, product, position, ctaActionType, targetUrl, contentType) => {
1359
1410
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11;
1360
1411
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
1361
1412
  const isProd = ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) || (((_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProducts) && ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProducts) === null || _d === void 0 ? void 0 : _d.length) > 0);
@@ -1378,32 +1429,21 @@
1378
1429
  });
1379
1430
  }, [bffEventReport, isFromHashtag]);
1380
1431
  const h5EnterLink = React.useCallback(() => {
1381
- var _a, _b, _c;
1382
- const queryString = location.search.slice(1);
1383
- const params = {};
1384
- (_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
1385
- const key = val.split('=')[0];
1386
- const value = val.split('=')[1];
1387
- params[key] = value;
1388
- });
1389
- for (const key in params) {
1390
- params[key] = params[key].replace(/%2B/g, '+');
1391
- }
1392
- const getVal = (key) => { var _a; return (_a = params[key]) !== null && _a !== void 0 ? _a : ''; };
1432
+ var _a, _b;
1393
1433
  const time = new Date();
1394
1434
  curTime.current = time;
1395
1435
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
1396
1436
  eventInfo: {
1397
1437
  eventSubject: 'h5LinkEnterFeed',
1398
1438
  eventDescription: 'User enter h5 link',
1399
- utmSource: getVal('utm_source'),
1400
- utmMedium: getVal('utm_medium'),
1401
- utmCampaign: getVal('utm_campaign'),
1402
- utmId: getVal('utm_id'),
1403
- utmContent: getVal('utm_content'),
1439
+ utmSource: getUrlParamByKey('utm_source'),
1440
+ utmMedium: getUrlParamByKey('utm_medium'),
1441
+ utmCampaign: getUrlParamByKey('utm_campaign'),
1442
+ utmId: getUrlParamByKey('utm_id'),
1443
+ utmContent: getUrlParamByKey('utm_content'),
1404
1444
  enterTime: Math.floor(time / 1000) + '',
1405
1445
  requestId: null,
1406
- enterUrl: (_c = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href) !== null && _c !== void 0 ? _c : ''
1446
+ enterUrl: (_b = (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href) !== null && _b !== void 0 ? _b : ''
1407
1447
  },
1408
1448
  reportLayId: false
1409
1449
  });
@@ -10823,22 +10863,78 @@
10823
10863
  eventSubject: 'clickCta',
10824
10864
  eventDescription: 'User clicked the CTA'
10825
10865
  }, data, product, position);
10866
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
10867
+ eventName: 'ClickCTA',
10868
+ product: product ? [product] : undefined,
10869
+ contentType: 'product',
10870
+ data,
10871
+ position,
10872
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
10873
+ cta_action_type: 'open_external_link',
10874
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
10875
+ target_url: product.link
10876
+ });
10826
10877
  }
10827
10878
  window.location.href = window.getJointUtmLink(product.link);
10828
10879
  }
10829
10880
  };
10830
10881
  React.useEffect(() => {
10882
+ var _a;
10831
10883
  if (!isActive)
10832
10884
  return;
10885
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '', imgUrls: !isPost ? product === null || product === void 0 ? void 0 : product.homePage : (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.imgUrls }) : null });
10833
10886
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
10834
10887
  eventName: 'ProductView',
10835
- product
10888
+ product: product ? [product] : undefined,
10889
+ contentType: 'product',
10890
+ rec: recData,
10891
+ position
10836
10892
  });
10837
10893
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
10838
10894
  eventName: 'PageView',
10839
- product
10895
+ product: product ? [product] : undefined,
10896
+ contentType: 'product',
10897
+ rec: recData,
10898
+ position
10840
10899
  });
10841
10900
  }, [isActive, bffFbReport]);
10901
+ React.useEffect(() => {
10902
+ if (!isActive || isPost)
10903
+ return;
10904
+ const onShow = () => {
10905
+ curTimeRef.current = new Date();
10906
+ };
10907
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '' }) : null });
10908
+ const onHide = () => {
10909
+ var _a;
10910
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
10911
+ eventName: 'ExitFeed',
10912
+ product: product ? [product] : undefined,
10913
+ contentType: 'product',
10914
+ rec: recData,
10915
+ position,
10916
+ view_time: new Date() - curTimeRef.current,
10917
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : ''
10918
+ });
10919
+ };
10920
+ SXP_EVENT_BUS.on(SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
10921
+ SXP_EVENT_BUS.on(SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
10922
+ return () => {
10923
+ var _a;
10924
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
10925
+ eventName: 'Engagement',
10926
+ product: product ? [product] : undefined,
10927
+ rec: recData,
10928
+ position,
10929
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : '',
10930
+ engagement_type: 'close_popup',
10931
+ contentType: 'product',
10932
+ view_time: new Date() - curTimeRef.current
10933
+ });
10934
+ SXP_EVENT_BUS.off(SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
10935
+ SXP_EVENT_BUS.off(SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
10936
+ };
10937
+ }, [isActive, isPost, bffFbReport, data, product, position, curTimeRef]);
10842
10938
  React.useEffect(() => {
10843
10939
  const initTime = () => {
10844
10940
  curTimeRef.current = new Date();
@@ -11730,22 +11826,78 @@
11730
11826
  eventSubject: 'clickCta',
11731
11827
  eventDescription: 'User clicked the CTA'
11732
11828
  }, data, product, position);
11829
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
11830
+ eventName: 'ClickCTA',
11831
+ product: product ? [product] : undefined,
11832
+ contentType: 'product',
11833
+ data,
11834
+ position,
11835
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
11836
+ cta_action_type: 'open_external_link',
11837
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
11838
+ target_url: product.link
11839
+ });
11733
11840
  }
11734
11841
  window.location.href = window.getJointUtmLink(product.link);
11735
11842
  }
11736
11843
  };
11737
11844
  React.useEffect(() => {
11845
+ var _a;
11738
11846
  if (!isActive)
11739
11847
  return;
11848
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '', imgUrls: !isPost ? product === null || product === void 0 ? void 0 : product.homePage : (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.imgUrls }) : null });
11740
11849
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
11741
11850
  eventName: 'ProductView',
11742
- product
11851
+ product: product ? [product] : undefined,
11852
+ contentType: 'product',
11853
+ rec: recData,
11854
+ position
11743
11855
  });
11744
11856
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
11745
11857
  eventName: 'PageView',
11746
- product
11858
+ product: product ? [product] : undefined,
11859
+ contentType: 'product',
11860
+ rec: recData,
11861
+ position
11747
11862
  });
11748
- }, [isActive, bffFbReport]);
11863
+ }, [isActive, bffFbReport, isPost]);
11864
+ React.useEffect(() => {
11865
+ if (!isActive || isPost)
11866
+ return;
11867
+ const onShow = () => {
11868
+ curTimeRef.current = new Date();
11869
+ };
11870
+ const recData = Object.assign(Object.assign({}, data), { video: (data === null || data === void 0 ? void 0 : data.video) ? Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.video), { title: '' }) : null });
11871
+ const onHide = () => {
11872
+ var _a;
11873
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
11874
+ eventName: 'ExitFeed',
11875
+ product: product ? [product] : undefined,
11876
+ contentType: 'product',
11877
+ rec: recData,
11878
+ position,
11879
+ view_time: new Date() - curTimeRef.current,
11880
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : ''
11881
+ });
11882
+ };
11883
+ SXP_EVENT_BUS.on(SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
11884
+ SXP_EVENT_BUS.on(SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
11885
+ return () => {
11886
+ var _a;
11887
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
11888
+ eventName: 'Engagement',
11889
+ product: product ? [product] : undefined,
11890
+ rec: recData,
11891
+ position,
11892
+ content_id: (_a = product === null || product === void 0 ? void 0 : product.itemId) !== null && _a !== void 0 ? _a : '',
11893
+ engagement_type: 'close_popup',
11894
+ contentType: 'product',
11895
+ view_time: new Date() - curTimeRef.current
11896
+ });
11897
+ SXP_EVENT_BUS.off(SXP_EVENT_TYPE.PAGE_DID_SHOW, () => onShow());
11898
+ SXP_EVENT_BUS.off(SXP_EVENT_TYPE.PAGE_DID_HIDE, () => onHide());
11899
+ };
11900
+ }, [isActive, isPost, bffFbReport, data, product, position, curTimeRef]);
11749
11901
  React.useEffect(() => {
11750
11902
  const initTime = () => {
11751
11903
  if (!isActive)
@@ -12410,16 +12562,28 @@ Made in Italy` })));
12410
12562
  });
12411
12563
  }, [(_d = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _d === void 0 ? void 0 : _d.enableFormattedPrice, globalConfig]);
12412
12564
  const handleClick = lodash.throttle((item, multiCheckIndex, e) => {
12565
+ var _a;
12413
12566
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
12414
12567
  eventSubject: 'clickCta',
12415
12568
  eventDescription: 'User clicked the CTA'
12416
12569
  }, recData, item, index);
12570
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
12571
+ eventName: 'ClickCTA',
12572
+ product: item ? [item] : undefined,
12573
+ contentType: 'product',
12574
+ recData,
12575
+ index,
12576
+ cta_text: (_a = item === null || item === void 0 ? void 0 : item.bindCta) === null || _a === void 0 ? void 0 : _a.enTitle,
12577
+ cta_action_type: isExternalLink && !!(item === null || item === void 0 ? void 0 : item.link) ? 'open_external_link' : 'open_internal_popup',
12578
+ target_content_id: item === null || item === void 0 ? void 0 : item.itemId,
12579
+ target_url: item.link
12580
+ });
12417
12581
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { video: Object.assign(Object.assign({}, recData === null || recData === void 0 ? void 0 : recData.video), { bindProduct: item }), index, multiCheckIndex }));
12418
12582
  if (isExternalLink) {
12419
- if (item === null || item === void 0 ? void 0 : item.link) {
12420
- jumpToWeb(e, recData, item, item.bindCta, index);
12421
- window.location.href = window.getJointUtmLink(item.link);
12422
- }
12583
+ if (!(item === null || item === void 0 ? void 0 : item.link))
12584
+ return;
12585
+ jumpToWeb(e, recData, item, item.bindCta, index);
12586
+ window.location.href = window.getJointUtmLink(item.link);
12423
12587
  }
12424
12588
  else {
12425
12589
  onClick === null || onClick === void 0 ? void 0 : onClick();
@@ -12427,7 +12591,11 @@ Made in Italy` })));
12427
12591
  }, popup === null || popup === void 0 ? void 0 : popup.duration);
12428
12592
  React.useEffect(() => {
12429
12593
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
12430
- eventName: 'PageView'
12594
+ eventName: 'PageView',
12595
+ product: (product !== null && product !== void 0 ? product : []),
12596
+ contentType: 'product',
12597
+ rec: recData,
12598
+ position: index
12431
12599
  });
12432
12600
  }, []);
12433
12601
  return (React.createElement("ul", { role: 'list', className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px', boxSizing: 'border-box' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
@@ -12939,28 +13107,40 @@ Made in Italy` })));
12939
13107
  var { rec, children, className, onClick, style, isExternalLink = false, index, jumpLink, multItem, multiCheckIndex } = _a; __rest(_a, ["rec", "children", "className", "onClick", "style", "isExternalLink", "index", "jumpLink", "multItem", "multiCheckIndex"]);
12940
13108
  const ref = React.useRef(null);
12941
13109
  const { popup } = useEditor();
12942
- const { setPopupDetailData, ctaEvent } = useSxpDataSource();
13110
+ const { setPopupDetailData, ctaEvent, bffFbReport } = useSxpDataSource();
12943
13111
  const { jumpToWeb } = useEventReport();
12944
13112
  const [element, setElement] = React.useState(null);
12945
13113
  const handleClick = lodash.throttle((e) => {
12946
- var _a, _b, _c, _d, _e, _f;
13114
+ var _a, _b, _c, _d, _e, _f, _g, _h;
12947
13115
  e.preventDefault();
12948
- const item = multItem ? multItem : (_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) !== null && _b !== void 0 ? _b : rec === null || rec === void 0 ? void 0 : rec.video;
13116
+ const item = multItem || ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) !== null && _b !== void 0 ? _b : rec === null || rec === void 0 ? void 0 : rec.video);
13117
+ const link = jumpLink || ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) === null || _d === void 0 ? void 0 : _d.link) || (multItem === null || multItem === void 0 ? void 0 : multItem.link) || '';
12949
13118
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
12950
13119
  eventSubject: 'clickCta',
12951
13120
  eventDescription: 'User clicked the CTA'
12952
13121
  }, rec, item, index);
13122
+ const product = multItem || ((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindProduct);
13123
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
13124
+ eventName: 'ClickCTA',
13125
+ product: product ? [product] : undefined,
13126
+ contentType: 'post',
13127
+ rec,
13128
+ index,
13129
+ cta_text: (_f = item === null || item === void 0 ? void 0 : item.bindCta) === null || _f === void 0 ? void 0 : _f.enTitle,
13130
+ cta_action_type: isExternalLink && (!!link) ? 'open_external_link' : 'open_internal_popup',
13131
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
13132
+ target_url: link
13133
+ });
12953
13134
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(multItem && multiCheckIndex !== undefined && multiCheckIndex >= 0
12954
13135
  ? Object.assign(Object.assign({}, rec), { video: Object.assign(Object.assign({}, rec === null || rec === void 0 ? void 0 : rec.video), { bindProduct: multItem }), index, multiCheckIndex }) : Object.assign(Object.assign({}, rec), { index }));
12955
13136
  setElement(ref === null || ref === void 0 ? void 0 : ref.current);
12956
13137
  if (isExternalLink) {
12957
- const link = ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) === null || _d === void 0 ? void 0 : _d.link) || (multItem === null || multItem === void 0 ? void 0 : multItem.link);
12958
- if (jumpLink || link) {
12959
- const cta = ((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta) || (multItem === null || multItem === void 0 ? void 0 : multItem.bindCta);
12960
- const product = ((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct) || multItem;
12961
- jumpToWeb(e, rec, product, cta, index);
12962
- window.location.href = window.getJointUtmLink(jumpLink || link || '');
12963
- }
13138
+ if (!link)
13139
+ return;
13140
+ const cta = ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) || (multItem === null || multItem === void 0 ? void 0 : multItem.bindCta);
13141
+ const product = ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.bindProduct) || multItem;
13142
+ jumpToWeb(e, rec, product, cta, index);
13143
+ window.location.href = window.getJointUtmLink(link);
12964
13144
  }
12965
13145
  else {
12966
13146
  onClick === null || onClick === void 0 ? void 0 : onClick();
@@ -15445,7 +15625,7 @@ Made in Italy` })));
15445
15625
 
15446
15626
  const WaterfallFlowItem$1 = (props) => {
15447
15627
  var _a;
15448
- const { rec, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
15628
+ const { listItem, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
15449
15629
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
15450
15630
  const [showVideo, setShowVideo] = React.useState(false);
15451
15631
  React.useState(false);
@@ -15458,6 +15638,7 @@ Made in Italy` })));
15458
15638
  React.useRef(null);
15459
15639
  React.useRef(null);
15460
15640
  const [firstFrameSrc, setFirstFrameSrc] = React.useState('');
15641
+ const rec = listItem;
15461
15642
  const src = React.useMemo(() => {
15462
15643
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
15463
15644
  if ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) {
@@ -15550,7 +15731,7 @@ Made in Italy` })));
15550
15731
  function WaterfallList$1(_a) {
15551
15732
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
15552
15733
  var { reportTagsView, showBanner } = _a, props = __rest(_a, ["reportTagsView", "showBanner"]);
15553
- const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex } = useSxpDataSource();
15734
+ const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex, bffFbReport } = useSxpDataSource();
15554
15735
  const { jumpToWeb } = useEventReport();
15555
15736
  /** 滚动的父元素 */
15556
15737
  const scrollParent = React.useRef(null);
@@ -15677,7 +15858,8 @@ Made in Italy` })));
15677
15858
  }).then((res) => {
15678
15859
  var _a, _b;
15679
15860
  setData(res);
15680
- setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
15861
+ const list = (_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : [];
15862
+ setList(list);
15681
15863
  setIsLoadingData(false);
15682
15864
  }));
15683
15865
  if (isOpenHashTag) {
@@ -15766,7 +15948,7 @@ Made in Italy` })));
15766
15948
  React.createElement("div", { className: 'waterFallList-content' }, list === null || list === void 0 ? void 0 :
15767
15949
  list.map((item, ind) => {
15768
15950
  var _a;
15769
- return (React.createElement(WaterfallFlowItem$1, Object.assign({ key: ind, index: ind, rec: item, list: list, showBorder: scrollTop + ((_a = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.current) === null || _a === void 0 ? void 0 : _a.clientHeight), style: styleList[ind], sizeChange: onSizeChange, unitWidth: unitWidth, reportTagsView: reportTagsView }, props)));
15951
+ return (React.createElement(WaterfallFlowItem$1, Object.assign({ key: ind, index: ind, listItem: item, list: list, showBorder: scrollTop + ((_a = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.current) === null || _a === void 0 ? void 0 : _a.clientHeight), style: styleList[ind], sizeChange: onSizeChange, unitWidth: unitWidth, reportTagsView: reportTagsView }, props)));
15770
15952
  }),
15771
15953
  React.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
15772
15954
  position: 'absolute',
@@ -15788,7 +15970,8 @@ Made in Italy` })));
15788
15970
 
15789
15971
  const WaterfallFlowItem = (props) => {
15790
15972
  var _a;
15791
- const { rec, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
15973
+ const { listItem, index, list, reportTagsView, textStyles, space, openFixedSize, fixedSizeRatio } = props;
15974
+ const rec = listItem;
15792
15975
  const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
15793
15976
  const [showVideo, setShowVideo] = React.useState(false);
15794
15977
  const imgDom = React.useRef(null);
@@ -15913,41 +16096,30 @@ Made in Italy` })));
15913
16096
  function WaterfallList(_a) {
15914
16097
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
15915
16098
  var { reportTagsView, showBanner } = _a, props = __rest(_a, ["reportTagsView", "showBanner"]);
15916
- const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex } = useSxpDataSource();
16099
+ const { waterFallData, getRecommendVideos, hashTagSize, loadingImage, isOpenHashTag, cacheActiveIndex, bffFbReport } = useSxpDataSource();
15917
16100
  const { jumpToWeb } = useEventReport();
15918
16101
  const [list, setList] = React.useState();
15919
16102
  const [data, setData] = React.useState();
15920
16103
  const [isLoadingData, setIsLoadingData] = React.useState(false);
15921
16104
  const containerRef = React.useRef(null);
15922
16105
  const [isLoadMore, setIsLoadMore] = React.useState(false);
15923
- React.useCallback(() => {
15924
- if (isLoadMore)
15925
- return;
15926
- setIsLoadMore(true);
15927
- waterFallData &&
15928
- (getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
15929
- hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag
15930
- }).then((res) => {
15931
- var _a;
15932
- setList(list === null || list === void 0 ? void 0 : list.concat((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []));
15933
- setIsLoadMore(false);
15934
- }));
15935
- }, [waterFallData, getRecommendVideos, list, isLoadMore]);
15936
16106
  React.useEffect(() => {
15937
16107
  var _a, _b;
15938
16108
  setIsLoadingData(true);
15939
- waterFallData &&
15940
- (getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
16109
+ if (waterFallData) {
16110
+ getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
15941
16111
  hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
15942
16112
  defaultSize: hashTagSize,
15943
16113
  maxSize: hashTagSize
15944
16114
  }).then((res) => {
15945
16115
  var _a, _b;
15946
16116
  setData(res);
15947
- setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
16117
+ const list = (_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : [];
16118
+ setList(list);
15948
16119
  setIsLoadingData(false);
15949
- }));
15950
- if (isOpenHashTag) {
16120
+ });
16121
+ }
16122
+ else if (isOpenHashTag) {
15951
16123
  const res = previewData;
15952
16124
  setData(res);
15953
16125
  setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
@@ -15995,7 +16167,7 @@ Made in Italy` })));
15995
16167
  __html: setFontForText(((_j = data === null || data === void 0 ? void 0 : data.tag) === null || _j === void 0 ? void 0 : _j.linkTitle) || 'Shop the collection', (_k = props === null || props === void 0 ? void 0 : props.textStyles) === null || _k === void 0 ? void 0 : _k.hashTagLink)
15996
16168
  } }),
15997
16169
  React.createElement("div", { className: 'list-content' }, list === null || list === void 0 ? void 0 : list.map((item, ind) => {
15998
- return (React.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, rec: item, list: list, reportTagsView: reportTagsView }, props)));
16170
+ return (React.createElement(WaterfallFlowItem, Object.assign({ key: ind, index: ind, listItem: item, list: list, reportTagsView: reportTagsView }, props)));
15999
16171
  })),
16000
16172
  React.createElement("div", { hidden: !isLoadMore, style: { textAlign: 'center' } }, "loading..."),
16001
16173
  React.createElement("div", { hidden: !((_l = data === null || data === void 0 ? void 0 : data.tag) === null || _l === void 0 ? void 0 : _l.link), style: {
@@ -16084,13 +16256,17 @@ Made in Italy` })));
16084
16256
  });
16085
16257
  }, [recData, bffEventReport, viewTime, isFromHashtag, cacheActiveIndex]);
16086
16258
  React.useEffect(() => {
16259
+ var _a, _b;
16087
16260
  if (openHashtag) {
16088
16261
  setViewTime(new Date());
16089
16262
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
16090
- eventName: 'PageView'
16263
+ eventName: 'PageView',
16264
+ product: (_b = (_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProducts,
16265
+ rec: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec,
16266
+ position: cacheActiveIndex
16091
16267
  });
16092
16268
  }
16093
- }, [openHashtag, bffFbReport]);
16269
+ }, [openHashtag, bffFbReport, waterFallData, cacheActiveIndex]);
16094
16270
  React.useEffect(() => {
16095
16271
  const initTime = () => {
16096
16272
  setViewTime(new Date());
@@ -16401,7 +16577,7 @@ Made in Italy` })));
16401
16577
  const AniLink$1 = (_a) => {
16402
16578
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
16403
16579
  var { style, recData, ctaTempStyles, index, event, onClick, isExternalLink = false, isActive } = _a, props = __rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "onClick", "isExternalLink", "isActive"]);
16404
- const { ctaEvent, setPopupDetailData } = useSxpDataSource();
16580
+ const { ctaEvent, setPopupDetailData, bffFbReport } = useSxpDataSource();
16405
16581
  const { jumpToWeb } = useEventReport();
16406
16582
  const [visible, setVisible] = React.useState(false);
16407
16583
  const ref = React.useRef(null);
@@ -16411,17 +16587,28 @@ Made in Italy` })));
16411
16587
  const handleTo = (e) => {
16412
16588
  var _a, _b, _c, _d;
16413
16589
  const item = ((_b = (_a = recData === null || recData === void 0 ? void 0 : recData.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b[0]) || ((_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.bindProduct) || (recData === null || recData === void 0 ? void 0 : recData.video);
16590
+ const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
16414
16591
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
16415
16592
  eventSubject: 'clickCta',
16416
16593
  eventDescription: 'User clicked the CTA'
16417
16594
  }, recData, item, index);
16595
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
16596
+ eventName: 'ClickCTA',
16597
+ product: product ? [product] : undefined,
16598
+ contentType: 'post',
16599
+ recData,
16600
+ index,
16601
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
16602
+ cta_action_type: (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup',
16603
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
16604
+ target_url: link
16605
+ });
16418
16606
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
16419
16607
  if (isExternalLink) {
16420
- const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
16421
- if (link) {
16422
- jumpToWeb(e, recData, product, cta, index);
16423
- window.location.href = window.getJointUtmLink(link);
16424
- }
16608
+ if (!link)
16609
+ return;
16610
+ jumpToWeb(e, recData, product, cta, index);
16611
+ window.location.href = window.getJointUtmLink(link);
16425
16612
  }
16426
16613
  else {
16427
16614
  onClick === null || onClick === void 0 ? void 0 : onClick();
@@ -16904,7 +17091,7 @@ Made in Italy` })));
16904
17091
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
16905
17092
  var { style, recData, ctaTempStyles, index, event, bottom_image, translateY, isTel, onClick, isExternalLink = false, isActive } = _a, props = __rest(_a, ["style", "recData", "ctaTempStyles", "index", "event", "bottom_image", "translateY", "isTel", "onClick", "isExternalLink", "isActive"]);
16906
17093
  style === null || style === void 0 ? true : delete style.transform;
16907
- const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData } = useSxpDataSource();
17094
+ const { sxpParameter, globalConfig, ctaEvent, setPopupDetailData, bffFbReport } = useSxpDataSource();
16908
17095
  const { jumpToWeb } = useEventReport();
16909
17096
  const [visible, setVisible] = React.useState(true);
16910
17097
  const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
@@ -16912,17 +17099,28 @@ Made in Italy` })));
16912
17099
  const handleTo = (e) => {
16913
17100
  var _a, _b, _c, _d;
16914
17101
  const item = ((_b = (_a = recData === null || recData === void 0 ? void 0 : recData.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b[0]) || ((_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.bindProduct) || (recData === null || recData === void 0 ? void 0 : recData.video);
17102
+ const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
16915
17103
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
16916
17104
  eventSubject: 'clickCta',
16917
17105
  eventDescription: 'User clicked the CTA'
16918
17106
  }, recData, item, index);
17107
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
17108
+ eventName: 'ClickCTA',
17109
+ product: product ? [product] : undefined,
17110
+ contentType: 'post',
17111
+ recData,
17112
+ index,
17113
+ cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
17114
+ cta_action_type: (isExternalLink && !!link) ? 'open_external_link' : 'open_internal_popup',
17115
+ target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
17116
+ target_url: link
17117
+ });
16919
17118
  setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { index }));
16920
17119
  if (isExternalLink) {
16921
- const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
16922
- if (link) {
16923
- jumpToWeb(e, recData, product, cta, index);
16924
- window.location.href = window.getJointUtmLink(link);
16925
- }
17120
+ if (!link)
17121
+ return;
17122
+ jumpToWeb(e, recData, product, cta, index);
17123
+ window.location.href = window.getJointUtmLink(link);
16926
17124
  }
16927
17125
  else {
16928
17126
  onClick === null || onClick === void 0 ? void 0 : onClick();
@@ -16956,8 +17154,8 @@ Made in Italy` })));
16956
17154
  height: '40px',
16957
17155
  lineHeight: '40px',
16958
17156
  paddingLeft: '6px'
16959
- } }, "Cta Title")) : (React.createElement("div", Object.assign({}, props, { className: `${css.css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles['aniLinkPopup']} ${aniNamStyle} ${css.css(aniTimStyle)}`, onClick: handleTo }),
16960
- React.createElement("div", { onClick: onClose, className: styles['modal-icon-wrapper'], style: { padding: (_s = style === null || style === void 0 ? void 0 : style['padding']) !== null && _s !== void 0 ? _s : 0 } },
17157
+ } }, "Cta Title")) : (React.createElement("div", Object.assign({}, props, { className: `${css.css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles.aniLinkPopup} ${aniNamStyle} ${css.css(aniTimStyle)}`, onClick: handleTo }),
17158
+ React.createElement("div", { onClick: onClose, className: styles['modal-icon-wrapper'], style: { padding: (_s = style === null || style === void 0 ? void 0 : style.padding) !== null && _s !== void 0 ? _s : 0 } },
16961
17159
  React.createElement("img", { src: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) || closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
16962
17160
  React.createElement(Img$1, { src: src, rec: recData, item: (_x = (_v = (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u[0]) !== null && _v !== void 0 ? _v : (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.bindProduct) !== null && _x !== void 0 ? _x : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img, isActive: isActive }),
16963
17161
  (!recData || (product === null || product === void 0 ? void 0 : product.title)) && (React.createElement("div", { className: styles['one-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
@@ -18148,12 +18346,12 @@ Made in Italy` })));
18148
18346
  const LikeButton = (_a) => {
18149
18347
  var _b;
18150
18348
  var { active, activeIcon, unActicveIcon, recData, position } = _a, props = __rest(_a, ["active", "activeIcon", "unActicveIcon", "recData", "position"]);
18151
- const { mutateLike, mutateUnlike, bffEventReport, setCacheRtcList, cacheRtcList } = useSxpDataSource();
18349
+ const { mutateLike, mutateUnlike, bffEventReport, setCacheRtcList, cacheRtcList, bffFbReport } = useSxpDataSource();
18152
18350
  const [state, setState] = React.useState((_b = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList[position]) === null || _b === void 0 ? void 0 : _b.isCollected);
18153
18351
  const likeIcon = useIconLink(defaultLikeIconPath$2);
18154
18352
  const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
18155
18353
  const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
18156
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
18354
+ var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2;
18157
18355
  if (state) {
18158
18356
  // 先设置状态
18159
18357
  setState(false);
@@ -18199,16 +18397,24 @@ Made in Italy` })));
18199
18397
  traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
18200
18398
  }
18201
18399
  });
18400
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
18401
+ eventName: 'Engagement',
18402
+ product: (_z = recData === null || recData === void 0 ? void 0 : recData.video) === null || _z === void 0 ? void 0 : _z.bindProducts,
18403
+ rec: recData,
18404
+ position,
18405
+ content_id: (_1 = (_0 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '',
18406
+ engagement_type: 'like'
18407
+ });
18202
18408
  if (!result) {
18203
18409
  setState(false);
18204
18410
  }
18205
18411
  else {
18206
- const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
18412
+ const nRtcList = (_2 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
18207
18413
  if (index === position) {
18208
18414
  item.isCollected = true;
18209
18415
  }
18210
18416
  return item;
18211
- })) !== null && _z !== void 0 ? _z : [];
18417
+ })) !== null && _2 !== void 0 ? _2 : [];
18212
18418
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
18213
18419
  }
18214
18420
  }
@@ -18520,11 +18726,15 @@ Made in Italy` })));
18520
18726
  if (isActive) {
18521
18727
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
18522
18728
  eventName: 'ViewContent',
18523
- product: (_b = (_a = data === null || data === void 0 ? void 0 : data[index]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProduct
18729
+ product: (_b = (_a = data === null || data === void 0 ? void 0 : data[index]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.bindProducts,
18730
+ rec: data === null || data === void 0 ? void 0 : data[index],
18731
+ position: index
18524
18732
  });
18525
18733
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
18526
18734
  eventName: 'PageView',
18527
- product: (_d = (_c = data === null || data === void 0 ? void 0 : data[index]) === null || _c === void 0 ? void 0 : _c.video) === null || _d === void 0 ? void 0 : _d.bindProduct
18735
+ product: (_d = (_c = data === null || data === void 0 ? void 0 : data[index]) === null || _c === void 0 ? void 0 : _c.video) === null || _d === void 0 ? void 0 : _d.bindProducts,
18736
+ rec: data === null || data === void 0 ? void 0 : data[index],
18737
+ position: index
18528
18738
  });
18529
18739
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
18530
18740
  }
@@ -19176,7 +19386,7 @@ Made in Italy` })));
19176
19386
  (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
19177
19387
  }, [data, ctaType, swiperRef]);
19178
19388
  const handleSessionCompleted = React.useCallback((fk) => {
19179
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
19389
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
19180
19390
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
19181
19391
  let fromKName = '';
19182
19392
  if (popupDetailData && (((_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
@@ -19211,7 +19421,18 @@ Made in Italy` })));
19211
19421
  traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
19212
19422
  }
19213
19423
  });
19214
- }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
19424
+ const isPostType = ((_w = item === null || item === void 0 ? void 0 : item.video) === null || _w === void 0 ? void 0 : _w.url) || ((_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.imgUrls) === null || _y === void 0 ? void 0 : _y.length);
19425
+ if (!popupDetailData) {
19426
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19427
+ eventName: 'ExitFeed',
19428
+ product: isPostType ? (_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
19429
+ rec: item,
19430
+ position: activeIndex,
19431
+ content_id: isPostType ? (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.itemId) !== null && _1 !== void 0 ? _1 : '' : (_3 = (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
19432
+ view_time: new Date() - viewTime.current
19433
+ });
19434
+ }
19435
+ }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime, bffFbReport]);
19215
19436
  React.useEffect(() => {
19216
19437
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
19217
19438
  const visibleChange = () => {
@@ -19514,50 +19735,81 @@ Made in Italy` })));
19514
19735
  }
19515
19736
  };
19516
19737
  const handleScrollEvent = (swiper) => {
19517
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
19738
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
19518
19739
  const item = data[swiper.previousIndex];
19740
+ const activeItem = data[swiper.activeIndex];
19519
19741
  if (!item)
19520
19742
  return;
19521
19743
  let contentFormat = null;
19522
- if ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) {
19744
+ let previousContentType = 'post';
19745
+ let previousContentId = (_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.itemId) !== null && _b !== void 0 ? _b : '';
19746
+ let previousProduct = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.bindProducts;
19747
+ let previousContentsName = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.title) !== null && _e !== void 0 ? _e : '';
19748
+ let previousDirection = '';
19749
+ let contentId = (_g = (_f = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '';
19750
+ if ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.url) {
19523
19751
  contentFormat = 'video';
19524
19752
  }
19525
- else if ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls) === null || _c === void 0 ? void 0 : _c.length) {
19753
+ else if ((_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.imgUrls) === null || _k === void 0 ? void 0 : _k.length) {
19526
19754
  contentFormat = 'image';
19527
19755
  }
19756
+ else {
19757
+ previousContentType = 'product';
19758
+ previousContentId = (_m = (_l = item === null || item === void 0 ? void 0 : item.product) === null || _l === void 0 ? void 0 : _l.itemId) !== null && _m !== void 0 ? _m : '';
19759
+ previousProduct = (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [];
19760
+ previousContentsName = '';
19761
+ }
19762
+ if (!((_o = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _o === void 0 ? void 0 : _o.url) && !((_q = (_p = activeItem === null || activeItem === void 0 ? void 0 : activeItem.video) === null || _p === void 0 ? void 0 : _p.imgUrls) === null || _q === void 0 ? void 0 : _q.length)) {
19763
+ contentId = (_s = (_r = activeItem === null || activeItem === void 0 ? void 0 : activeItem.product) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '';
19764
+ }
19528
19765
  if (swiper.previousIndex - swiper.activeIndex < 0) {
19529
19766
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
19530
19767
  eventInfo: {
19531
19768
  eventSubject: 'scrollDown',
19532
19769
  eventDescription: 'User scroll down',
19533
- contentId: (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.itemId) !== null && _e !== void 0 ? _e : '',
19534
- productId: (_g = (_f = item === null || item === void 0 ? void 0 : item.product) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
19770
+ contentId: (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
19771
+ productId: (_w = (_v = item === null || item === void 0 ? void 0 : item.product) === null || _v === void 0 ? void 0 : _v.itemId) !== null && _w !== void 0 ? _w : '',
19535
19772
  requestId: null,
19536
- traceInfo: (_l = (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.traceInfo) !== null && _j !== void 0 ? _j : (_k = item === null || item === void 0 ? void 0 : item.product) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : '',
19773
+ traceInfo: (_0 = (_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_z = item === null || item === void 0 ? void 0 : item.product) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : '',
19537
19774
  contentFormat,
19538
- position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
19775
+ position: ((_1 = swiper.previousIndex) !== null && _1 !== void 0 ? _1 : 0) + ''
19539
19776
  }
19540
19777
  });
19541
19778
  // 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
19542
19779
  handleViewImageStartEnd(item);
19543
19780
  handleSlideSkip(item, swiper.previousIndex);
19781
+ previousDirection = 'up';
19544
19782
  }
19545
19783
  else {
19546
19784
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
19547
19785
  eventInfo: {
19548
19786
  eventSubject: 'scrollUp',
19549
19787
  eventDescription: 'User scroll up',
19550
- contentId: (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.itemId) !== null && _p !== void 0 ? _p : '',
19551
- productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
19788
+ contentId: (_3 = (_2 = item === null || item === void 0 ? void 0 : item.video) === null || _2 === void 0 ? void 0 : _2.itemId) !== null && _3 !== void 0 ? _3 : '',
19789
+ productId: (_5 = (_4 = item.product) === null || _4 === void 0 ? void 0 : _4.itemId) !== null && _5 !== void 0 ? _5 : '',
19552
19790
  requestId: null,
19553
- traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : '',
19791
+ traceInfo: (_9 = (_7 = (_6 = item === null || item === void 0 ? void 0 : item.video) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_8 = item === null || item === void 0 ? void 0 : item.product) === null || _8 === void 0 ? void 0 : _8.traceInfo) !== null && _9 !== void 0 ? _9 : '',
19554
19792
  contentFormat,
19555
- position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
19793
+ position: ((_10 = swiper.previousIndex) !== null && _10 !== void 0 ? _10 : 0) + ''
19556
19794
  }
19557
19795
  });
19558
19796
  // 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
19559
19797
  handleViewImageStartEnd(item);
19798
+ previousDirection = 'down';
19560
19799
  }
19800
+ bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19801
+ eventName: 'ContentSwipe',
19802
+ product: previousProduct,
19803
+ rec: activeItem,
19804
+ position: swiper.activeIndex,
19805
+ previous_content_id: previousContentId,
19806
+ previous_content_type: previousContentType,
19807
+ previous_contents_name: previousContentsName,
19808
+ previosu_position: swiper.previousIndex,
19809
+ swipe_direction: previousDirection,
19810
+ view_time: new Date() - viewTime.current,
19811
+ content_id: contentId
19812
+ });
19561
19813
  // 商品浏览事件
19562
19814
  handleReportProductView(item);
19563
19815
  viewTime.current = new Date();
@@ -19661,11 +19913,15 @@ Made in Italy` })));
19661
19913
  if (enableCapi) {
19662
19914
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19663
19915
  eventName: 'ViewContent',
19664
- product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
19916
+ product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProducts,
19917
+ rec: item,
19918
+ position: activeIndex
19665
19919
  });
19666
19920
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19667
19921
  eventName: 'PageView',
19668
- product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
19922
+ product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProducts,
19923
+ rec: item,
19924
+ position: activeIndex
19669
19925
  });
19670
19926
  }
19671
19927
  }