@commercetools-frontend/fullstory 2.4.4 → 2.5.0

package/README.md

@@ -143,6 +143,8 @@ import { Marking as FullStoryMarking } from '@commercetools-frontend/fullstory';
 </FullStoryMarking.Section>;
 ```
 
+You can also pass additional props to the `FullStoryMarking.Section` component, such as a `className`. These will be forwarded to the underlying `section` HTML element.
+
 Please do not wrap individual elements. If you need to mark individual elements such as a unlabelled input you can use `applyMarker`:
 
 ```jsx

package/dist/commercetools-frontend-fullstory.cjs.dev.js

@@ -15,6 +15,7 @@ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var react = require('react');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -66,27 +67,32 @@ function useTrackingEffect() {
   const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
       user: context.user,
       project: context.project,
-      cloudEnvironment: context.environment.cloudEnvironment
+      cloudEnvironment: context.environment.cloudEnvironment,
+      organizationId: context.project?.ownerId,
+      isProductionProject: context.project?.isProductionProject
     })),
     project = _useApplicationContex.project,
     user = _useApplicationContex.user,
-    cloudEnvironment = _useApplicationContex.cloudEnvironment;
-  const getUserRole = () => {
-    switch (project === null || project === void 0 ? void 0 : project.isUserAdminOfCurrentProject) {
-      case true:
-        return 'admin';
-      case false:
-        return 'regular';
-      default:
-        return 'unknown';
-    }
-  };
+    cloudEnvironment = _useApplicationContex.cloudEnvironment,
+    organizationId = _useApplicationContex.organizationId,
+    isProductionProject = _useApplicationContex.isProductionProject;
   react.useEffect(() => {
+    function getUserRole() {
+      switch (project?.isUserAdminOfCurrentProject) {
+        case true:
+          return 'admin';
+        case false:
+          return 'regular';
+        default:
+          return 'unknown';
+      }
+    }
+
     // It's not safe to invoke any FullStory SDK methods.
     if (!browser.isInitialized() || disable) {
       return;
     }
-    if (!(user !== null && user !== void 0 && user.id)) {
+    if (!user?.id) {
       browser.FullStory('setIdentity', {
         anonymous: true
       });
@@ -95,14 +101,16 @@ function useTrackingEffect() {
         uid: user.id,
         properties: _objectSpread$1({
           environment: cloudEnvironment,
-          projectKey: project === null || project === void 0 ? void 0 : project.key,
+          projectKey: project?.key,
+          isProductionProject,
+          organizationId,
           userBusinessRole: user.businessRole,
           userLocale: user.locale,
           userRole: getUserRole()
         }, additionalUserVars)
       });
     }
-  }, [disable, additionalUserVars, cloudEnvironment, project === null || project === void 0 ? void 0 : project.key, user === null || user === void 0 ? void 0 : user.businessRole, user === null || user === void 0 ? void 0 : user.id, user === null || user === void 0 ? void 0 : user.locale]);
+  }, [disable, additionalUserVars, cloudEnvironment, project?.key, user?.businessRole, user?.id, user?.locale, isProductionProject, organizationId, project?.isUserAdminOfCurrentProject]);
   return null;
 }
 
@@ -153,6 +161,7 @@ const Masking = {
   Exclude
 };
 
+const _excluded = ["children", "name"];
 function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 function applyMarker(name) {
@@ -160,9 +169,12 @@ function applyMarker(name) {
     'data-tracking': name
   };
 }
-function Section(props) {
-  return jsxRuntime.jsx("section", _objectSpread(_objectSpread({}, applyMarker(props.name)), {}, {
-    children: props.children
+function Section(_ref) {
+  let children = _ref.children,
+    name = _ref.name,
+    additionalProps = _objectWithoutProperties(_ref, _excluded);
+  return jsxRuntime.jsx("section", _objectSpread(_objectSpread(_objectSpread({}, additionalProps), applyMarker(name)), {}, {
+    children: children
   }));
 }
 const Marking = {

package/dist/commercetools-frontend-fullstory.cjs.prod.js

@@ -15,6 +15,7 @@ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var react = require('react');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -66,27 +67,32 @@ function useTrackingEffect() {
   const _useApplicationContex = applicationShellConnectors.useApplicationContext(context => ({
       user: context.user,
       project: context.project,
-      cloudEnvironment: context.environment.cloudEnvironment
+      cloudEnvironment: context.environment.cloudEnvironment,
+      organizationId: context.project?.ownerId,
+      isProductionProject: context.project?.isProductionProject
     })),
     project = _useApplicationContex.project,
     user = _useApplicationContex.user,
-    cloudEnvironment = _useApplicationContex.cloudEnvironment;
-  const getUserRole = () => {
-    switch (project === null || project === void 0 ? void 0 : project.isUserAdminOfCurrentProject) {
-      case true:
-        return 'admin';
-      case false:
-        return 'regular';
-      default:
-        return 'unknown';
-    }
-  };
+    cloudEnvironment = _useApplicationContex.cloudEnvironment,
+    organizationId = _useApplicationContex.organizationId,
+    isProductionProject = _useApplicationContex.isProductionProject;
   react.useEffect(() => {
+    function getUserRole() {
+      switch (project?.isUserAdminOfCurrentProject) {
+        case true:
+          return 'admin';
+        case false:
+          return 'regular';
+        default:
+          return 'unknown';
+      }
+    }
+
     // It's not safe to invoke any FullStory SDK methods.
     if (!browser.isInitialized() || disable) {
       return;
     }
-    if (!(user !== null && user !== void 0 && user.id)) {
+    if (!user?.id) {
       browser.FullStory('setIdentity', {
         anonymous: true
       });
@@ -95,14 +101,16 @@ function useTrackingEffect() {
         uid: user.id,
         properties: _objectSpread$1({
           environment: cloudEnvironment,
-          projectKey: project === null || project === void 0 ? void 0 : project.key,
+          projectKey: project?.key,
+          isProductionProject,
+          organizationId,
           userBusinessRole: user.businessRole,
           userLocale: user.locale,
           userRole: getUserRole()
         }, additionalUserVars)
       });
     }
-  }, [disable, additionalUserVars, cloudEnvironment, project === null || project === void 0 ? void 0 : project.key, user === null || user === void 0 ? void 0 : user.businessRole, user === null || user === void 0 ? void 0 : user.id, user === null || user === void 0 ? void 0 : user.locale]);
+  }, [disable, additionalUserVars, cloudEnvironment, project?.key, user?.businessRole, user?.id, user?.locale, isProductionProject, organizationId, project?.isUserAdminOfCurrentProject]);
   return null;
 }
 
@@ -153,6 +161,7 @@ const Masking = {
   Exclude
 };
 
+const _excluded = ["children", "name"];
 function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 function applyMarker(name) {
@@ -160,9 +169,12 @@ function applyMarker(name) {
     'data-tracking': name
   };
 }
-function Section(props) {
-  return jsxRuntime.jsx("section", _objectSpread(_objectSpread({}, applyMarker(props.name)), {}, {
-    children: props.children
+function Section(_ref) {
+  let children = _ref.children,
+    name = _ref.name,
+    additionalProps = _objectWithoutProperties(_ref, _excluded);
+  return jsxRuntime.jsx("section", _objectSpread(_objectSpread(_objectSpread({}, additionalProps), applyMarker(name)), {}, {
+    children: children
   }));
 }
 const Marking = {

package/dist/commercetools-frontend-fullstory.esm.js

@@ -11,6 +11,7 @@ import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
 import { useEffect } from 'react';
 import { useApplicationContext } from '@commercetools-frontend/application-shell-connectors';
 import { jsx } from '@emotion/react/jsx-runtime';
+import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/esm/objectWithoutProperties';
 
 function assertValidFullstoryOrganizationId(fullstoryOrganizationId) {
   if (typeof fullstoryOrganizationId !== 'string') {
@@ -51,27 +52,32 @@ function useTrackingEffect() {
   const _useApplicationContex = useApplicationContext(context => ({
       user: context.user,
       project: context.project,
-      cloudEnvironment: context.environment.cloudEnvironment
+      cloudEnvironment: context.environment.cloudEnvironment,
+      organizationId: context.project?.ownerId,
+      isProductionProject: context.project?.isProductionProject
     })),
     project = _useApplicationContex.project,
     user = _useApplicationContex.user,
-    cloudEnvironment = _useApplicationContex.cloudEnvironment;
-  const getUserRole = () => {
-    switch (project === null || project === void 0 ? void 0 : project.isUserAdminOfCurrentProject) {
-      case true:
-        return 'admin';
-      case false:
-        return 'regular';
-      default:
-        return 'unknown';
-    }
-  };
+    cloudEnvironment = _useApplicationContex.cloudEnvironment,
+    organizationId = _useApplicationContex.organizationId,
+    isProductionProject = _useApplicationContex.isProductionProject;
   useEffect(() => {
+    function getUserRole() {
+      switch (project?.isUserAdminOfCurrentProject) {
+        case true:
+          return 'admin';
+        case false:
+          return 'regular';
+        default:
+          return 'unknown';
+      }
+    }
+
     // It's not safe to invoke any FullStory SDK methods.
     if (!isInitialized() || disable) {
       return;
     }
-    if (!(user !== null && user !== void 0 && user.id)) {
+    if (!user?.id) {
       FullStory('setIdentity', {
         anonymous: true
       });
@@ -80,14 +86,16 @@ function useTrackingEffect() {
         uid: user.id,
         properties: _objectSpread$1({
           environment: cloudEnvironment,
-          projectKey: project === null || project === void 0 ? void 0 : project.key,
+          projectKey: project?.key,
+          isProductionProject,
+          organizationId,
           userBusinessRole: user.businessRole,
           userLocale: user.locale,
           userRole: getUserRole()
         }, additionalUserVars)
       });
     }
-  }, [disable, additionalUserVars, cloudEnvironment, project === null || project === void 0 ? void 0 : project.key, user === null || user === void 0 ? void 0 : user.businessRole, user === null || user === void 0 ? void 0 : user.id, user === null || user === void 0 ? void 0 : user.locale]);
+  }, [disable, additionalUserVars, cloudEnvironment, project?.key, user?.businessRole, user?.id, user?.locale, isProductionProject, organizationId, project?.isUserAdminOfCurrentProject]);
   return null;
 }
 
@@ -138,6 +146,7 @@ const Masking = {
   Exclude
 };
 
+const _excluded = ["children", "name"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, 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 _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 function applyMarker(name) {
@@ -145,9 +154,12 @@ function applyMarker(name) {
     'data-tracking': name
   };
 }
-function Section(props) {
-  return jsx("section", _objectSpread(_objectSpread({}, applyMarker(props.name)), {}, {
-    children: props.children
+function Section(_ref) {
+  let children = _ref.children,
+    name = _ref.name,
+    additionalProps = _objectWithoutProperties(_ref, _excluded);
+  return jsx("section", _objectSpread(_objectSpread(_objectSpread({}, additionalProps), applyMarker(name)), {}, {
+    children: children
   }));
 }
 const Marking = {

package/dist/declarations/src/marking.d.ts

@@ -1,12 +1,12 @@
-import type { ReactNode } from 'react';
-export type TMarkingProps = {
+import type { HTMLAttributes, ReactNode } from 'react';
+export type TMarkingProps = HTMLAttributes<HTMLDivElement> & {
     name: string;
     children: ReactNode;
 };
 declare function applyMarker(name: TMarkingProps['name']): {
     'data-tracking': string;
 };
-declare function Section(props: TMarkingProps): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare function Section({ children, name, ...additionalProps }: TMarkingProps): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
 declare const Marking: {
     Section: typeof Section;
     applyMarker: typeof applyMarker;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/fullstory",
-  "version": "2.4.4",
+  "version": "2.5.0",
   "description": "A package integrating with the FullStory SDK",
   "license": "MIT",
   "main": "dist/commercetools-frontend-fullstory.cjs.js",
@@ -20,14 +20,14 @@
   },
   "devDependencies": {
     "@apollo/client": "3.7.10",
-    "@commercetools-frontend/application-shell": "22.29.0",
-    "@commercetools-frontend/application-shell-connectors": "22.29.0",
-    "@commercetools-frontend/constants": "22.29.0",
-    "@emotion/react": "^11.11.1",
+    "@commercetools-frontend/application-shell": "22.35.0",
+    "@commercetools-frontend/application-shell-connectors": "22.35.0",
+    "@commercetools-frontend/constants": "22.35.0",
+    "@emotion/react": "11.13.3",
     "@testing-library/react": "12.1.5",
     "@testing-library/react-hooks": "8.0.1",
     "@types/jest": "^29.5.2",
-    "@types/node": "20.14.9",
+    "@types/node": "20.16.10",
     "@types/react": "17.0.80",
     "@types/testing-library__jest-dom": "^5.14.6",
     "graphql": "16.9.0",
@@ -40,8 +40,8 @@
     "typescript": "5.2.2"
   },
   "peerDependencies": {
-    "@commercetools-frontend/application-shell-connectors": "22.29.0",
-    "@commercetools-frontend/constants": "22.29.0",
+    "@commercetools-frontend/application-shell-connectors": "^22.35.0",
+    "@commercetools-frontend/constants": "^22.35.0",
     "@emotion/react": "11.x",
     "react": "17.x",
     "react-intl": "6.x"