@atlaskit/link-datasource 1.23.1 → 1.23.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/link-datasource
 
+## 1.23.2
+
+### Patch Changes
+
+- [#75568](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/75568) [`cf557c64b311`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cf557c64b311) - Updated useErrorLogger to tag Sentry events with datasourceId
+  Updated DatasourceRenderFailedAnalyticsWrapper to also log events with tagging to Sentry
+
 ## 1.23.1
 
 ### Patch Changes

package/dist/cjs/analytics/wrappers/render-failed/datasourceRenderFailedAnalyticsWrapper.js

@@ -1,13 +1,18 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _analyticsNext = require("@atlaskit/analytics-next");
+var _useErrorLogger = require("../../../hooks/useErrorLogger");
 var _constants = require("../../constants");
 var _index = require("../../index");
+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; }
 var DatasourceRenderFailedAnalyticsWrapper = (0, _analyticsNext.withAnalyticsContext)(_constants.componentMetadata.generic)(function (props) {
   var _useDatasourceAnalyti = (0, _index.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
@@ -16,6 +21,13 @@ var DatasourceRenderFailedAnalyticsWrapper = (0, _analyticsNext.withAnalyticsCon
       reason: 'internal'
     });
   }, [fireEvent]);
+  (0, _react.useEffect)(function () {
+    (0, _useErrorLogger.logToSentry)(props.error, 'link-datasource', _objectSpread(_objectSpread({}, props.datasourceId && {
+      datasourceId: props.datasourceId
+    }), props.datasourceModalType && {
+      datasourceModalType: props.datasourceModalType
+    }));
+  }, [props.error, props.datasourceId, props.datasourceModalType]);
   return props.children;
 });
 var _default = exports.default = DatasourceRenderFailedAnalyticsWrapper;

package/dist/cjs/hooks/useDatasourceTableState.js

@@ -21,7 +21,9 @@ var useDatasourceTableState = exports.useDatasourceTableState = function useData
     fieldKeys = _ref$fieldKeys === void 0 ? [] : _ref$fieldKeys;
   var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
-  var _useErrorLogger = (0, _useErrorLogger2.default)(),
+  var _useErrorLogger = (0, _useErrorLogger2.default)({
+      datasourceId: datasourceId
+    }),
     captureError = _useErrorLogger.captureError;
   var idFieldCount = 1;
   var keyFieldCount = 1;

package/dist/cjs/hooks/useErrorLogger.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.logToSentry = exports.default = void 0;
 var _react = require("react");
 var _sentry = require("@atlaskit/linking-common/sentry");
 var _utils = require("@atlaskit/linking-common/utils");
@@ -18,7 +18,21 @@ var getNetworkFields = function getNetworkFields(error) {
     status: null
   };
 };
-var useErrorLogger = function useErrorLogger() {
+/**
+ * This function is just a wrapper around captureException that checks if the enable-sentry-client FF is enabled
+ * and error is instanceof Error. We have to override the type of error from captureException to unknown so we use
+ * a helper Tail type which removes the first element of the tuple
+ */
+var logToSentry = exports.logToSentry = function logToSentry(error) {
+  if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
+    for (var _len = arguments.length, captureExceptionParams = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      captureExceptionParams[_key - 1] = arguments[_key];
+    }
+    _sentry.captureException.apply(void 0, [error].concat(captureExceptionParams));
+  }
+};
+var useErrorLogger = function useErrorLogger(_ref) {
+  var datasourceId = _ref.datasourceId;
   var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
 
@@ -37,10 +51,10 @@ var useErrorLogger = function useErrorLogger() {
       traceId: traceId,
       status: status
     });
-    if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
-      (0, _sentry.captureException)(error, 'link-datasource');
-    }
-  }, [fireEvent]);
+    logToSentry(error, 'link-datasource', {
+      datasourceId: datasourceId
+    });
+  }, [fireEvent, datasourceId]);
   return {
     captureError: captureError
   };

package/dist/cjs/ui/common/error-state/provider-auth-required.js

@@ -33,10 +33,13 @@ var ProviderAuthRequired = exports.ProviderAuthRequired = function ProviderAuthR
     onAuthSuccess = _ref.onAuthSuccess,
     onAuthError = _ref.onAuthError,
     extensionKey = _ref.extensionKey,
-    providerName = _ref.providerName;
+    providerName = _ref.providerName,
+    datasourceId = _ref.datasourceId;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  var _useErrorLogger = (0, _useErrorLogger2.default)(),
+  var _useErrorLogger = (0, _useErrorLogger2.default)({
+      datasourceId: datasourceId
+    }),
     captureError = _useErrorLogger.captureError;
   var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;

package/dist/cjs/ui/datasource-table-view/datasourceTableView.js

@@ -140,7 +140,8 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       extensionKey: extensionKey,
       providerName: providerName,
       onAuthSuccess: forcedReset,
-      onAuthError: forcedReset
+      onAuthError: forcedReset,
+      datasourceId: datasourceId
     }) : (0, _react2.jsx)(_accessRequired.AccessRequired, {
       url: url
     });

package/dist/es2019/analytics/wrappers/render-failed/datasourceRenderFailedAnalyticsWrapper.js

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
+import { logToSentry } from '../../../hooks/useErrorLogger';
 import { componentMetadata } from '../../constants';
 import { useDatasourceAnalyticsEvents } from '../../index';
 const DatasourceRenderFailedAnalyticsWrapper = withAnalyticsContext(componentMetadata.generic)(props => {
@@ -11,6 +12,16 @@ const DatasourceRenderFailedAnalyticsWrapper = withAnalyticsContext(componentMet
       reason: 'internal'
     });
   }, [fireEvent]);
+  useEffect(() => {
+    logToSentry(props.error, 'link-datasource', {
+      ...(props.datasourceId && {
+        datasourceId: props.datasourceId
+      }),
+      ...(props.datasourceModalType && {
+        datasourceModalType: props.datasourceModalType
+      })
+    });
+  }, [props.error, props.datasourceId, props.datasourceModalType]);
   return props.children;
 });
 export default DatasourceRenderFailedAnalyticsWrapper;

package/dist/es2019/hooks/useDatasourceTableState.js

@@ -13,7 +13,9 @@ export const useDatasourceTableState = ({
   } = useDatasourceAnalyticsEvents();
   const {
     captureError
-  } = useErrorLogger();
+  } = useErrorLogger({
+    datasourceId
+  });
   const idFieldCount = 1;
   const keyFieldCount = 1;
   const [initialEmptyArray] = useState([]);

package/dist/es2019/hooks/useErrorLogger.js

@@ -12,7 +12,19 @@ const getNetworkFields = error => {
     status: null
   };
 };
-const useErrorLogger = () => {
+/**
+ * This function is just a wrapper around captureException that checks if the enable-sentry-client FF is enabled
+ * and error is instanceof Error. We have to override the type of error from captureException to unknown so we use
+ * a helper Tail type which removes the first element of the tuple
+ */
+export const logToSentry = (error, ...captureExceptionParams) => {
+  if (getBooleanFF('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
+    captureException(error, ...captureExceptionParams);
+  }
+};
+const useErrorLogger = ({
+  datasourceId
+}) => {
   const {
     fireEvent
   } = useDatasourceAnalyticsEvents();
@@ -33,10 +45,10 @@ const useErrorLogger = () => {
       traceId,
       status
     });
-    if (getBooleanFF('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
-      captureException(error, 'link-datasource');
-    }
-  }, [fireEvent]);
+    logToSentry(error, 'link-datasource', {
+      datasourceId
+    });
+  }, [fireEvent, datasourceId]);
   return {
     captureError
   };

package/dist/es2019/ui/common/error-state/provider-auth-required.js

@@ -18,14 +18,17 @@ export const ProviderAuthRequired = ({
   onAuthSuccess,
   onAuthError,
   extensionKey,
-  providerName
+  providerName,
+  datasourceId
 }) => {
   const {
     formatMessage
   } = useIntl();
   const {
     captureError
-  } = useErrorLogger();
+  } = useErrorLogger({
+    datasourceId
+  });
   const {
     fireEvent
   } = useDatasourceAnalyticsEvents();

package/dist/es2019/ui/datasource-table-view/datasourceTableView.js

@@ -135,7 +135,8 @@ const DatasourceTableViewWithoutAnalytics = ({
       extensionKey: extensionKey,
       providerName: providerName,
       onAuthSuccess: forcedReset,
-      onAuthError: forcedReset
+      onAuthError: forcedReset,
+      datasourceId: datasourceId
     }) : jsx(AccessRequired, {
       url: url
     });

package/dist/esm/analytics/wrappers/render-failed/datasourceRenderFailedAnalyticsWrapper.js

@@ -1,5 +1,9 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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; }
 import { useEffect } from 'react';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
+import { logToSentry } from '../../../hooks/useErrorLogger';
 import { componentMetadata } from '../../constants';
 import { useDatasourceAnalyticsEvents } from '../../index';
 var DatasourceRenderFailedAnalyticsWrapper = withAnalyticsContext(componentMetadata.generic)(function (props) {
@@ -10,6 +14,13 @@ var DatasourceRenderFailedAnalyticsWrapper = withAnalyticsContext(componentMetad
       reason: 'internal'
     });
   }, [fireEvent]);
+  useEffect(function () {
+    logToSentry(props.error, 'link-datasource', _objectSpread(_objectSpread({}, props.datasourceId && {
+      datasourceId: props.datasourceId
+    }), props.datasourceModalType && {
+      datasourceModalType: props.datasourceModalType
+    }));
+  }, [props.error, props.datasourceId, props.datasourceModalType]);
   return props.children;
 });
 export default DatasourceRenderFailedAnalyticsWrapper;

package/dist/esm/hooks/useDatasourceTableState.js

@@ -14,7 +14,9 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
     fieldKeys = _ref$fieldKeys === void 0 ? [] : _ref$fieldKeys;
   var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
-  var _useErrorLogger = useErrorLogger(),
+  var _useErrorLogger = useErrorLogger({
+      datasourceId: datasourceId
+    }),
     captureError = _useErrorLogger.captureError;
   var idFieldCount = 1;
   var keyFieldCount = 1;

package/dist/esm/hooks/useErrorLogger.js

@@ -12,7 +12,21 @@ var getNetworkFields = function getNetworkFields(error) {
     status: null
   };
 };
-var useErrorLogger = function useErrorLogger() {
+/**
+ * This function is just a wrapper around captureException that checks if the enable-sentry-client FF is enabled
+ * and error is instanceof Error. We have to override the type of error from captureException to unknown so we use
+ * a helper Tail type which removes the first element of the tuple
+ */
+export var logToSentry = function logToSentry(error) {
+  if (getBooleanFF('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
+    for (var _len = arguments.length, captureExceptionParams = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      captureExceptionParams[_key - 1] = arguments[_key];
+    }
+    captureException.apply(void 0, [error].concat(captureExceptionParams));
+  }
+};
+var useErrorLogger = function useErrorLogger(_ref) {
+  var datasourceId = _ref.datasourceId;
   var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
 
@@ -31,10 +45,10 @@ var useErrorLogger = function useErrorLogger() {
       traceId: traceId,
       status: status
     });
-    if (getBooleanFF('platform.linking-platform.datasources.enable-sentry-client') && error instanceof Error) {
-      captureException(error, 'link-datasource');
-    }
-  }, [fireEvent]);
+    logToSentry(error, 'link-datasource', {
+      datasourceId: datasourceId
+    });
+  }, [fireEvent, datasourceId]);
   return {
     captureError: captureError
   };

package/dist/esm/ui/common/error-state/provider-auth-required.js

@@ -22,10 +22,13 @@ export var ProviderAuthRequired = function ProviderAuthRequired(_ref) {
     onAuthSuccess = _ref.onAuthSuccess,
     onAuthError = _ref.onAuthError,
     extensionKey = _ref.extensionKey,
-    providerName = _ref.providerName;
+    providerName = _ref.providerName,
+    datasourceId = _ref.datasourceId;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
-  var _useErrorLogger = useErrorLogger(),
+  var _useErrorLogger = useErrorLogger({
+      datasourceId: datasourceId
+    }),
     captureError = _useErrorLogger.captureError;
   var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
     fireEvent = _useDatasourceAnalyti.fireEvent;

package/dist/esm/ui/datasource-table-view/datasourceTableView.js

@@ -132,7 +132,8 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       extensionKey: extensionKey,
       providerName: providerName,
       onAuthSuccess: forcedReset,
-      onAuthError: forcedReset
+      onAuthError: forcedReset,
+      datasourceId: datasourceId
     }) : jsx(AccessRequired, {
       url: url
     });

package/dist/types/hooks/useErrorLogger.d.ts

@@ -1,4 +1,15 @@
-declare const useErrorLogger: () => {
+/**
+ * This function is just a wrapper around captureException that checks if the enable-sentry-client FF is enabled
+ * and error is instanceof Error. We have to override the type of error from captureException to unknown so we use
+ * a helper Tail type which removes the first element of the tuple
+ */
+export declare const logToSentry: (error: unknown, packageName: string, tags?: {
+    [key: string]: import("@sentry/types").Primitive;
+} | undefined) => void;
+interface UseErrorLoggerProps {
+    datasourceId: string;
+}
+declare const useErrorLogger: ({ datasourceId }: UseErrorLoggerProps) => {
     captureError: (errorLocation: string, error: unknown) => void;
 };
 export default useErrorLogger;

package/dist/types/ui/common/error-state/provider-auth-required.d.ts

@@ -6,6 +6,7 @@ interface ProviderAuthRequiredProps {
     onAuthError: () => void;
     extensionKey: string | null;
     providerName: DatasourceMeta['providerName'];
+    datasourceId: string;
 }
-export declare const ProviderAuthRequired: ({ auth, onAuthSuccess, onAuthError, extensionKey, providerName, }: ProviderAuthRequiredProps) => jsx.JSX.Element;
+export declare const ProviderAuthRequired: ({ auth, onAuthSuccess, onAuthError, extensionKey, providerName, datasourceId, }: ProviderAuthRequiredProps) => jsx.JSX.Element;
 export {};

package/dist/types-ts4.5/hooks/useErrorLogger.d.ts

@@ -1,4 +1,15 @@
-declare const useErrorLogger: () => {
+/**
+ * This function is just a wrapper around captureException that checks if the enable-sentry-client FF is enabled
+ * and error is instanceof Error. We have to override the type of error from captureException to unknown so we use
+ * a helper Tail type which removes the first element of the tuple
+ */
+export declare const logToSentry: (error: unknown, packageName: string, tags?: {
+    [key: string]: import("@sentry/types").Primitive;
+} | undefined) => void;
+interface UseErrorLoggerProps {
+    datasourceId: string;
+}
+declare const useErrorLogger: ({ datasourceId }: UseErrorLoggerProps) => {
     captureError: (errorLocation: string, error: unknown) => void;
 };
 export default useErrorLogger;

package/dist/types-ts4.5/ui/common/error-state/provider-auth-required.d.ts

@@ -6,6 +6,7 @@ interface ProviderAuthRequiredProps {
     onAuthError: () => void;
     extensionKey: string | null;
     providerName: DatasourceMeta['providerName'];
+    datasourceId: string;
 }
-export declare const ProviderAuthRequired: ({ auth, onAuthSuccess, onAuthError, extensionKey, providerName, }: ProviderAuthRequiredProps) => jsx.JSX.Element;
+export declare const ProviderAuthRequired: ({ auth, onAuthSuccess, onAuthError, extensionKey, providerName, datasourceId, }: ProviderAuthRequiredProps) => jsx.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "1.23.1",
+  "version": "1.23.2",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -36,7 +36,7 @@
     "@atlaskit/avatar-group": "^9.5.0",
     "@atlaskit/badge": "^15.2.0",
     "@atlaskit/button": "^17.6.0",
-    "@atlaskit/dropdown-menu": "^12.5.0",
+    "@atlaskit/dropdown-menu": "^12.6.0",
     "@atlaskit/editor-prosemirror": "3.0.0",
     "@atlaskit/empty-state": "^7.7.0",
     "@atlaskit/form": "^9.0.3",
@@ -59,7 +59,7 @@
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.0",
     "@atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-autoscroll": "^1.0.0",
     "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.0.0",
-    "@atlaskit/primitives": "^3.0.0",
+    "@atlaskit/primitives": "^3.1.0",
     "@atlaskit/select": "^17.1.0",
     "@atlaskit/smart-card": "^26.48.0",
     "@atlaskit/spinner": "^16.0.0",