@atlaskit/react-ufo 4.2.2 → 4.2.3

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 4.2.3
+
+### Patch Changes
+
+- [#199487](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/199487)
+  [`65e285a7a4cbc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/65e285a7a4cbc) -
+  Added segments threshold when creating React UFO payload
+
 ## 4.2.2
 
 ### Patch Changes

package/dist/cjs/create-payload/common/utils/index.js

@@ -5,15 +5,25 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.buildSegmentTree = buildSegmentTree;
+exports.getOldSegmentsLabelStack = getOldSegmentsLabelStack;
 exports.isSegmentLabel = isSegmentLabel;
 exports.labelStackStartWith = labelStackStartWith;
 exports.optimizeLabelStack = optimizeLabelStack;
 exports.sanitizeUfoName = sanitizeUfoName;
 exports.stringifyLabelStackFully = stringifyLabelStackFully;
+exports.stringifyLabelStackWithoutId = stringifyLabelStackWithoutId;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _config = require("../../../config");
+var _getReactUfoPayloadVersion = require("../../utils/get-react-ufo-payload-version");
+var _excluded = ["labelStack"],
+  _excluded2 = ["labelStack"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function sanitizeUfoName(name) {
   return name.replace(/_/g, '-');
 }
@@ -25,26 +35,72 @@ function buildSegmentTree(labelStacks) {
     n: 'segment-tree-root',
     c: {}
   };
-  labelStacks.forEach(function (labelStack) {
-    var currentNode = r;
-    labelStack.forEach(function (label) {
-      var name = label.name;
-      var id = isSegmentLabel(label) ? label.segmentId : undefined;
-      var key = id !== undefined ? id : name;
-      var type = isSegmentLabel(label) ? label.type : undefined;
-      if (!currentNode.c) {
-        currentNode.c = {};
+  var config = (0, _config.getConfig)();
+  var segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+  var addSegmentsMap = new Map();
+  if ((0, _platformFeatureFlags.fg)('platform_ufo_add_segments_count_threshold')) {
+    labelStacks.forEach(function (labelStack) {
+      var stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      var currentNode = r;
+      var _iterator = _createForOfIteratorHelper(labelStack),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var label = _step.value;
+          var isSegment = isSegmentLabel(label);
+          var name = label.name;
+          if (isSegment && segmentThreshold && segmentThreshold[name]) {
+            var threshold = segmentThreshold[name];
+            var count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+            if (count < threshold) {
+              addSegmentsMap.set(stringifiedLabelStack, count + 1);
+            } else {
+              break;
+            }
+          }
+          var id = isSegment ? label.segmentId : undefined;
+          var key = id !== undefined ? id : name;
+          var type = isSegment ? label.type : undefined;
+          if (!currentNode.c) {
+            currentNode.c = {};
+          }
+          if (!currentNode.c[key]) {
+            currentNode.c[key] = _objectSpread({
+              n: name
+            }, type && (0, _platformFeatureFlags.fg)('platform_ufo_add_type_for_3p_segments') ? {
+              t: type
+            } : {});
+          }
+          currentNode = currentNode.c[key];
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
       }
-      if (!currentNode.c[key]) {
-        currentNode.c[key] = _objectSpread({
-          n: name
-        }, type && (0, _platformFeatureFlags.fg)('platform_ufo_add_type_for_3p_segments') ? {
-          t: type
-        } : {});
-      }
-      currentNode = currentNode.c[key];
     });
-  });
+  } else {
+    labelStacks.forEach(function (labelStack) {
+      var currentNode = r;
+      labelStack.forEach(function (label) {
+        var name = label.name;
+        var id = isSegmentLabel(label) ? label.segmentId : undefined;
+        var key = id !== undefined ? id : name;
+        var type = isSegmentLabel(label) ? label.type : undefined;
+        if (!currentNode.c) {
+          currentNode.c = {};
+        }
+        if (!currentNode.c[key]) {
+          currentNode.c[key] = _objectSpread({
+            n: name
+          }, type && (0, _platformFeatureFlags.fg)('platform_ufo_add_type_for_3p_segments') ? {
+            t: type
+          } : {});
+        }
+        currentNode = currentNode.c[key];
+      });
+    });
+  }
   return {
     r: r
   };
@@ -57,6 +113,14 @@ function stringifyLabelStackFully(labelStack) {
     return l.name;
   }).join('/');
 }
+function stringifyLabelStackWithoutId(labelStack) {
+  return labelStack.map(function (l) {
+    if (isSegmentLabel(l)) {
+      return "".concat(l.name, ":segment");
+    }
+    return l.name;
+  }).join('/');
+}
 function getLabelStackReference(labelStack) {
   return labelStack.map(function (l) {
     return isSegmentLabel(l) ? l.segmentId : l.name;
@@ -75,4 +139,55 @@ function optimizeLabelStack(labelStack, reactUFOVersion) {
       t: ls.type
     } : {});
   });
+}
+function getOldSegmentsLabelStack(segments, interactionType) {
+  if ((0, _platformFeatureFlags.fg)('platform_ufo_add_segments_count_threshold')) {
+    var config = (0, _config.getConfig)();
+    var addSegmentsMap = new Map();
+    var segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+    return segments.map(function (_ref) {
+      var labelStack = _ref.labelStack,
+        others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+      var stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      var segmentsInfo = [];
+      var _iterator2 = _createForOfIteratorHelper(labelStack),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var ls = _step2.value;
+          var isSegment = isSegmentLabel(ls);
+          if (isSegment && segmentThreshold && segmentThreshold[ls.name]) {
+            var threshold = segmentThreshold[ls.name];
+            var count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+            if (count < threshold) {
+              addSegmentsMap.set(stringifiedLabelStack, count + 1);
+            } else {
+              break;
+            }
+          }
+          segmentsInfo.push(_objectSpread(_objectSpread({
+            n: ls.name
+          }, ls.segmentId ? {
+            s: ls.segmentId
+          } : {}), ls.type && (0, _platformFeatureFlags.fg)('platform_ufo_add_type_for_3p_segments') ? {
+            t: ls.type
+          } : {}));
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+      return _objectSpread(_objectSpread({}, others), {}, {
+        labelStack: segmentsInfo
+      });
+    });
+  }
+  return segments.map(function (_ref2) {
+    var labelStack = _ref2.labelStack,
+      others = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+    return _objectSpread(_objectSpread({}, others), {}, {
+      labelStack: optimizeLabelStack(labelStack, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interactionType))
+    });
+  });
 }

package/dist/cjs/create-payload/index.js

@@ -47,8 +47,7 @@ var _getTtai = _interopRequireDefault(require("./utils/get-ttai"));
 var _getVcMetrics = _interopRequireDefault(require("./utils/get-vc-metrics"));
 var _excluded = ["labelStack", "time"],
   _excluded2 = ["stopTime", "labelStack"],
-  _excluded3 = ["labelStack"],
-  _excluded4 = ["labelStack"];
+  _excluded3 = ["labelStack"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // Import common utilities
@@ -756,13 +755,7 @@ function _createInteractionMetricsPayload() {
                   apdex: optimizeApdex(interaction.apdex, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
                   end: Math.round(end),
                   start: Math.round(start),
-                  segments: (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? segmentTree : segments.map(function (_ref7) {
-                    var labelStack = _ref7.labelStack,
-                      others = (0, _objectWithoutProperties2.default)(_ref7, _excluded4);
-                    return _objectSpread(_objectSpread({}, others), {}, {
-                      labelStack: (0, _utils.optimizeLabelStack)(labelStack, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))
-                    });
-                  }),
+                  segments: (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type) === '2.0.0' ? segmentTree : (0, _utils.getOldSegmentsLabelStack)(segments, interaction.type),
                   marks: optimizeMarks(interaction.marks, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type)),
                   customData: optimizeCustomData(interaction),
                   reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start, (0, _getReactUfoPayloadVersion.getReactUFOPayloadVersion)(interaction.type))

package/dist/es2019/create-payload/common/utils/index.js

@@ -1,4 +1,6 @@
 import { fg } from '@atlaskit/platform-feature-flags';
+import { getConfig } from '../../../config';
+import { getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
 export function sanitizeUfoName(name) {
   return name.replace(/_/g, '-');
 }
@@ -10,27 +12,65 @@ export function buildSegmentTree(labelStacks) {
     n: 'segment-tree-root',
     c: {}
   };
-  labelStacks.forEach(labelStack => {
-    let currentNode = r;
-    labelStack.forEach(label => {
-      const name = label.name;
-      const id = isSegmentLabel(label) ? label.segmentId : undefined;
-      const key = id !== undefined ? id : name;
-      const type = isSegmentLabel(label) ? label.type : undefined;
-      if (!currentNode.c) {
-        currentNode.c = {};
+  const config = getConfig();
+  const segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+  const addSegmentsMap = new Map();
+  if (fg('platform_ufo_add_segments_count_threshold')) {
+    labelStacks.forEach(labelStack => {
+      const stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      let currentNode = r;
+      for (const label of labelStack) {
+        const isSegment = isSegmentLabel(label);
+        const name = label.name;
+        if (isSegment && segmentThreshold && segmentThreshold[name]) {
+          const threshold = segmentThreshold[name];
+          const count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+          if (count < threshold) {
+            addSegmentsMap.set(stringifiedLabelStack, count + 1);
+          } else {
+            break;
+          }
+        }
+        const id = isSegment ? label.segmentId : undefined;
+        const key = id !== undefined ? id : name;
+        const type = isSegment ? label.type : undefined;
+        if (!currentNode.c) {
+          currentNode.c = {};
+        }
+        if (!currentNode.c[key]) {
+          currentNode.c[key] = {
+            n: name,
+            ...(type && fg('platform_ufo_add_type_for_3p_segments') ? {
+              t: type
+            } : {})
+          };
+        }
+        currentNode = currentNode.c[key];
       }
-      if (!currentNode.c[key]) {
-        currentNode.c[key] = {
-          n: name,
-          ...(type && fg('platform_ufo_add_type_for_3p_segments') ? {
-            t: type
-          } : {})
-        };
-      }
-      currentNode = currentNode.c[key];
     });
-  });
+  } else {
+    labelStacks.forEach(labelStack => {
+      let currentNode = r;
+      labelStack.forEach(label => {
+        const name = label.name;
+        const id = isSegmentLabel(label) ? label.segmentId : undefined;
+        const key = id !== undefined ? id : name;
+        const type = isSegmentLabel(label) ? label.type : undefined;
+        if (!currentNode.c) {
+          currentNode.c = {};
+        }
+        if (!currentNode.c[key]) {
+          currentNode.c[key] = {
+            n: name,
+            ...(type && fg('platform_ufo_add_type_for_3p_segments') ? {
+              t: type
+            } : {})
+          };
+        }
+        currentNode = currentNode.c[key];
+      });
+    });
+  }
   return {
     r
   };
@@ -43,6 +83,14 @@ export function stringifyLabelStackFully(labelStack) {
     return l.name;
   }).join('/');
 }
+export function stringifyLabelStackWithoutId(labelStack) {
+  return labelStack.map(l => {
+    if (isSegmentLabel(l)) {
+      return `${l.name}:segment`;
+    }
+    return l.name;
+  }).join('/');
+}
 function getLabelStackReference(labelStack) {
   return labelStack.map(l => isSegmentLabel(l) ? l.segmentId : l.name).join('/');
 }
@@ -59,4 +107,50 @@ export function optimizeLabelStack(labelStack, reactUFOVersion) {
       t: ls.type
     } : {})
   }));
+}
+export function getOldSegmentsLabelStack(segments, interactionType) {
+  if (fg('platform_ufo_add_segments_count_threshold')) {
+    const config = getConfig();
+    const addSegmentsMap = new Map();
+    const segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+    return segments.map(({
+      labelStack,
+      ...others
+    }) => {
+      const stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      const segmentsInfo = [];
+      for (const ls of labelStack) {
+        const isSegment = isSegmentLabel(ls);
+        if (isSegment && segmentThreshold && segmentThreshold[ls.name]) {
+          const threshold = segmentThreshold[ls.name];
+          const count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+          if (count < threshold) {
+            addSegmentsMap.set(stringifiedLabelStack, count + 1);
+          } else {
+            break;
+          }
+        }
+        segmentsInfo.push({
+          n: ls.name,
+          ...(ls.segmentId ? {
+            s: ls.segmentId
+          } : {}),
+          ...(ls.type && fg('platform_ufo_add_type_for_3p_segments') ? {
+            t: ls.type
+          } : {})
+        });
+      }
+      return {
+        ...others,
+        labelStack: segmentsInfo
+      };
+    });
+  }
+  return segments.map(({
+    labelStack,
+    ...others
+  }) => ({
+    ...others,
+    labelStack: optimizeLabelStack(labelStack, getReactUFOPayloadVersion(interactionType))
+  }));
 }

package/dist/es2019/create-payload/index.js

@@ -19,7 +19,7 @@ import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
 import { roundEpsilon } from '../round-number';
 import * as ssr from '../ssr';
-import { buildSegmentTree, labelStackStartWith, optimizeLabelStack, sanitizeUfoName, stringifyLabelStackFully } from './common/utils';
+import { buildSegmentTree, getOldSegmentsLabelStack, labelStackStartWith, optimizeLabelStack, sanitizeUfoName, stringifyLabelStackFully } from './common/utils';
 import { createCriticalMetricsPayloads } from './critical-metrics-payload';
 import { addPerformanceMeasures } from './utils/add-performance-measures';
 import { getBrowserMetadataToLegacyFormat } from './utils/get-browser-metadata';
@@ -754,13 +754,7 @@ async function createInteractionMetricsPayload(interaction, interactionId, exper
           apdex: optimizeApdex(interaction.apdex, getReactUFOPayloadVersion(interaction.type)),
           end: Math.round(end),
           start: Math.round(start),
-          segments: getReactUFOPayloadVersion(interaction.type) === '2.0.0' ? segmentTree : segments.map(({
-            labelStack,
-            ...others
-          }) => ({
-            ...others,
-            labelStack: optimizeLabelStack(labelStack, getReactUFOPayloadVersion(interaction.type))
-          })),
+          segments: getReactUFOPayloadVersion(interaction.type) === '2.0.0' ? segmentTree : getOldSegmentsLabelStack(segments, interaction.type),
           marks: optimizeMarks(interaction.marks, getReactUFOPayloadVersion(interaction.type)),
           customData: optimizeCustomData(interaction),
           reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start, getReactUFOPayloadVersion(interaction.type)),

package/dist/esm/create-payload/common/utils/index.js

@@ -1,7 +1,15 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["labelStack"],
+  _excluded2 = ["labelStack"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import { fg } from '@atlaskit/platform-feature-flags';
+import { getConfig } from '../../../config';
+import { getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
 export function sanitizeUfoName(name) {
   return name.replace(/_/g, '-');
 }
@@ -13,26 +21,72 @@ export function buildSegmentTree(labelStacks) {
     n: 'segment-tree-root',
     c: {}
   };
-  labelStacks.forEach(function (labelStack) {
-    var currentNode = r;
-    labelStack.forEach(function (label) {
-      var name = label.name;
-      var id = isSegmentLabel(label) ? label.segmentId : undefined;
-      var key = id !== undefined ? id : name;
-      var type = isSegmentLabel(label) ? label.type : undefined;
-      if (!currentNode.c) {
-        currentNode.c = {};
+  var config = getConfig();
+  var segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+  var addSegmentsMap = new Map();
+  if (fg('platform_ufo_add_segments_count_threshold')) {
+    labelStacks.forEach(function (labelStack) {
+      var stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      var currentNode = r;
+      var _iterator = _createForOfIteratorHelper(labelStack),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var label = _step.value;
+          var isSegment = isSegmentLabel(label);
+          var name = label.name;
+          if (isSegment && segmentThreshold && segmentThreshold[name]) {
+            var threshold = segmentThreshold[name];
+            var count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+            if (count < threshold) {
+              addSegmentsMap.set(stringifiedLabelStack, count + 1);
+            } else {
+              break;
+            }
+          }
+          var id = isSegment ? label.segmentId : undefined;
+          var key = id !== undefined ? id : name;
+          var type = isSegment ? label.type : undefined;
+          if (!currentNode.c) {
+            currentNode.c = {};
+          }
+          if (!currentNode.c[key]) {
+            currentNode.c[key] = _objectSpread({
+              n: name
+            }, type && fg('platform_ufo_add_type_for_3p_segments') ? {
+              t: type
+            } : {});
+          }
+          currentNode = currentNode.c[key];
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
       }
-      if (!currentNode.c[key]) {
-        currentNode.c[key] = _objectSpread({
-          n: name
-        }, type && fg('platform_ufo_add_type_for_3p_segments') ? {
-          t: type
-        } : {});
-      }
-      currentNode = currentNode.c[key];
     });
-  });
+  } else {
+    labelStacks.forEach(function (labelStack) {
+      var currentNode = r;
+      labelStack.forEach(function (label) {
+        var name = label.name;
+        var id = isSegmentLabel(label) ? label.segmentId : undefined;
+        var key = id !== undefined ? id : name;
+        var type = isSegmentLabel(label) ? label.type : undefined;
+        if (!currentNode.c) {
+          currentNode.c = {};
+        }
+        if (!currentNode.c[key]) {
+          currentNode.c[key] = _objectSpread({
+            n: name
+          }, type && fg('platform_ufo_add_type_for_3p_segments') ? {
+            t: type
+          } : {});
+        }
+        currentNode = currentNode.c[key];
+      });
+    });
+  }
   return {
     r: r
   };
@@ -45,6 +99,14 @@ export function stringifyLabelStackFully(labelStack) {
     return l.name;
   }).join('/');
 }
+export function stringifyLabelStackWithoutId(labelStack) {
+  return labelStack.map(function (l) {
+    if (isSegmentLabel(l)) {
+      return "".concat(l.name, ":segment");
+    }
+    return l.name;
+  }).join('/');
+}
 function getLabelStackReference(labelStack) {
   return labelStack.map(function (l) {
     return isSegmentLabel(l) ? l.segmentId : l.name;
@@ -63,4 +125,55 @@ export function optimizeLabelStack(labelStack, reactUFOVersion) {
       t: ls.type
     } : {});
   });
+}
+export function getOldSegmentsLabelStack(segments, interactionType) {
+  if (fg('platform_ufo_add_segments_count_threshold')) {
+    var config = getConfig();
+    var addSegmentsMap = new Map();
+    var segmentThreshold = config === null || config === void 0 ? void 0 : config.segmentsThreshold;
+    return segments.map(function (_ref) {
+      var labelStack = _ref.labelStack,
+        others = _objectWithoutProperties(_ref, _excluded);
+      var stringifiedLabelStack = stringifyLabelStackWithoutId(labelStack);
+      var segmentsInfo = [];
+      var _iterator2 = _createForOfIteratorHelper(labelStack),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var ls = _step2.value;
+          var isSegment = isSegmentLabel(ls);
+          if (isSegment && segmentThreshold && segmentThreshold[ls.name]) {
+            var threshold = segmentThreshold[ls.name];
+            var count = addSegmentsMap.get(stringifiedLabelStack) || 0;
+            if (count < threshold) {
+              addSegmentsMap.set(stringifiedLabelStack, count + 1);
+            } else {
+              break;
+            }
+          }
+          segmentsInfo.push(_objectSpread(_objectSpread({
+            n: ls.name
+          }, ls.segmentId ? {
+            s: ls.segmentId
+          } : {}), ls.type && fg('platform_ufo_add_type_for_3p_segments') ? {
+            t: ls.type
+          } : {}));
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+      return _objectSpread(_objectSpread({}, others), {}, {
+        labelStack: segmentsInfo
+      });
+    });
+  }
+  return segments.map(function (_ref2) {
+    var labelStack = _ref2.labelStack,
+      others = _objectWithoutProperties(_ref2, _excluded2);
+    return _objectSpread(_objectSpread({}, others), {}, {
+      labelStack: optimizeLabelStack(labelStack, getReactUFOPayloadVersion(interactionType))
+    });
+  });
 }

package/dist/esm/create-payload/index.js

@@ -5,8 +5,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["labelStack", "time"],
   _excluded2 = ["stopTime", "labelStack"],
-  _excluded3 = ["labelStack"],
-  _excluded4 = ["labelStack"];
+  _excluded3 = ["labelStack"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -31,7 +30,7 @@ import * as resourceTiming from '../resource-timing';
 import { filterResourceTimings } from '../resource-timing/common/utils/resource-timing-buffer';
 import { roundEpsilon } from '../round-number';
 import * as ssr from '../ssr';
-import { buildSegmentTree, labelStackStartWith, optimizeLabelStack, sanitizeUfoName, stringifyLabelStackFully } from './common/utils';
+import { buildSegmentTree, getOldSegmentsLabelStack, labelStackStartWith, optimizeLabelStack, sanitizeUfoName, stringifyLabelStackFully } from './common/utils';
 import { createCriticalMetricsPayloads } from './critical-metrics-payload';
 import { addPerformanceMeasures } from './utils/add-performance-measures';
 import { getBrowserMetadataToLegacyFormat } from './utils/get-browser-metadata';
@@ -749,13 +748,7 @@ function _createInteractionMetricsPayload() {
                   apdex: optimizeApdex(interaction.apdex, getReactUFOPayloadVersion(interaction.type)),
                   end: Math.round(end),
                   start: Math.round(start),
-                  segments: getReactUFOPayloadVersion(interaction.type) === '2.0.0' ? segmentTree : segments.map(function (_ref7) {
-                    var labelStack = _ref7.labelStack,
-                      others = _objectWithoutProperties(_ref7, _excluded4);
-                    return _objectSpread(_objectSpread({}, others), {}, {
-                      labelStack: optimizeLabelStack(labelStack, getReactUFOPayloadVersion(interaction.type))
-                    });
-                  }),
+                  segments: getReactUFOPayloadVersion(interaction.type) === '2.0.0' ? segmentTree : getOldSegmentsLabelStack(segments, interaction.type),
                   marks: optimizeMarks(interaction.marks, getReactUFOPayloadVersion(interaction.type)),
                   customData: optimizeCustomData(interaction),
                   reactProfilerTimings: optimizeReactProfilerTimings(interaction.reactProfilerTimings, start, getReactUFOPayloadVersion(interaction.type))

package/dist/types/config/index.d.ts

@@ -24,6 +24,9 @@ type SelectorConfig = {
     className: boolean;
     dataVC?: boolean;
 };
+type SegmentThreshold = {
+    readonly [key: string]: number;
+};
 type Rates = {
     readonly [key: string]: number;
 };
@@ -68,6 +71,7 @@ export type Config = {
     };
     readonly assetsConfig?: AssetsConfig;
     readonly enableBetterPageVisibilityApi?: boolean;
+    readonly segmentsThreshold?: SegmentThreshold;
     readonly vc?: {
         readonly enabled?: boolean;
         readonly heatmapSize?: number;

package/dist/types/create-payload/common/utils/index.d.ts

@@ -1,6 +1,7 @@
+import type { InteractionType, SegmentInfo } from '../../../common';
 import type { LabelStack, SegmentLabel } from '../../../interaction-context';
 import { type UFOSegmentType } from '../../../segment/segment';
-import { type getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
+import { getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
 export type SegmentItem = {
     n: string;
     c?: Record<string, SegmentItem>;
@@ -13,9 +14,19 @@ export declare function sanitizeUfoName(name: string): string;
 export declare function isSegmentLabel(obj: any): obj is SegmentLabel;
 export declare function buildSegmentTree(labelStacks: LabelStack[]): SegmentTree;
 export declare function stringifyLabelStackFully(labelStack: LabelStack): string;
+export declare function stringifyLabelStackWithoutId(labelStack: LabelStack): string;
 export declare function labelStackStartWith(labelStack: LabelStack, startWith: LabelStack): boolean;
 export declare function optimizeLabelStack(labelStack: LabelStack, reactUFOVersion: ReturnType<typeof getReactUFOPayloadVersion>): string | {
     t?: UFOSegmentType | undefined;
     s?: string | undefined;
     n: string;
 }[];
+export declare function getOldSegmentsLabelStack(segments: SegmentInfo[], interactionType: InteractionType): {
+    labelStack: any[];
+}[] | {
+    labelStack: string | {
+        t?: UFOSegmentType | undefined;
+        s?: string | undefined;
+        n: string;
+    }[];
+}[];

package/dist/types-ts4.5/config/index.d.ts

@@ -24,6 +24,9 @@ type SelectorConfig = {
     className: boolean;
     dataVC?: boolean;
 };
+type SegmentThreshold = {
+    readonly [key: string]: number;
+};
 type Rates = {
     readonly [key: string]: number;
 };
@@ -68,6 +71,7 @@ export type Config = {
     };
     readonly assetsConfig?: AssetsConfig;
     readonly enableBetterPageVisibilityApi?: boolean;
+    readonly segmentsThreshold?: SegmentThreshold;
     readonly vc?: {
         readonly enabled?: boolean;
         readonly heatmapSize?: number;

package/dist/types-ts4.5/create-payload/common/utils/index.d.ts

@@ -1,6 +1,7 @@
+import type { InteractionType, SegmentInfo } from '../../../common';
 import type { LabelStack, SegmentLabel } from '../../../interaction-context';
 import { type UFOSegmentType } from '../../../segment/segment';
-import { type getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
+import { getReactUFOPayloadVersion } from '../../utils/get-react-ufo-payload-version';
 export type SegmentItem = {
     n: string;
     c?: Record<string, SegmentItem>;
@@ -13,9 +14,19 @@ export declare function sanitizeUfoName(name: string): string;
 export declare function isSegmentLabel(obj: any): obj is SegmentLabel;
 export declare function buildSegmentTree(labelStacks: LabelStack[]): SegmentTree;
 export declare function stringifyLabelStackFully(labelStack: LabelStack): string;
+export declare function stringifyLabelStackWithoutId(labelStack: LabelStack): string;
 export declare function labelStackStartWith(labelStack: LabelStack, startWith: LabelStack): boolean;
 export declare function optimizeLabelStack(labelStack: LabelStack, reactUFOVersion: ReturnType<typeof getReactUFOPayloadVersion>): string | {
     t?: UFOSegmentType | undefined;
     s?: string | undefined;
     n: string;
 }[];
+export declare function getOldSegmentsLabelStack(segments: SegmentInfo[], interactionType: InteractionType): {
+    labelStack: any[];
+}[] | {
+    labelStack: string | {
+        t?: UFOSegmentType | undefined;
+        s?: string | undefined;
+        n: string;
+    }[];
+}[];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "4.2.2",
+	"version": "4.2.3",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -197,6 +197,9 @@
 		},
 		"platform_ufo_report_non_htmlelement_selectors": {
 			"type": "boolean"
+		},
+		"platform_ufo_add_segments_count_threshold": {
+			"type": "boolean"
 		}
 	}
 }