@atlaskit/link-datasource 0.31.3 → 0.33.0

package/dist/cjs/ui/jira-issues-modal/jira-search-container/index.js

@@ -10,6 +10,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
+var _analytics = require("../../../analytics");
 var _basicSearchInput = require("../basic-search-input");
 var _jqlEditor = require("../jql-editor");
 var _modeSwitcher = require("../mode-switcher");
@@ -57,6 +58,8 @@ var JiraSearchContainer = function JiraSearchContainer(props) {
     _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
     orderDirection = _useState10[0],
     setOrderDirection = _useState10[1];
+  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
   var onSearchModeChange = function onSearchModeChange(searchMode) {
     setCurrentSearchMode(searchMode);
   };
@@ -90,6 +93,11 @@ var JiraSearchContainer = function JiraSearchContainer(props) {
     onSearch({
       jql: jql
     });
+    if (currentSearchMode === basicModeValue) {
+      fireEvent('ui.form.submitted.basicSearch', {});
+    } else if (currentSearchMode === jqlModeValue) {
+      fireEvent('ui.jqlEditor.searched', {});
+    }
   };
   return (0, _react2.jsx)("div", {
     css: inputContainerStyles

package/dist/cjs/ui/jira-issues-modal/modal/index.js

@@ -5,19 +5,23 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.JiraIssuesConfigModal = void 0;
+exports.PlainJiraIssuesConfigModal = exports.JiraIssuesConfigModal = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
 var _colors = require("@atlaskit/theme/colors");
+var _analytics = require("../../../analytics");
 var _useDatasourceTableState = require("../../../hooks/useDatasourceTableState");
 var _getAvailableJiraSites = require("../../../services/getAvailableJiraSites");
+var _version = require("../../../version.json");
 var _accessRequired = require("../../common/error-state/access-required");
 var _modalLoadingError = require("../../common/error-state/modal-loading-error");
 var _noResults = require("../../common/error-state/no-results");
@@ -29,8 +33,8 @@ var _siteSelector = require("../site-selector");
 var _messages = require("./messages");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-/** @jsx jsx */
-
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /** @jsx jsx */
 var dropdownContainerStyles = (0, _react2.css)({
   display: 'flex',
   gap: "var(--ds-space-100, 0.5rem)"
@@ -56,7 +60,7 @@ var issueCountStyles = (0, _react2.css)({
 var smartLinkContainerStyles = (0, _react2.css)({
   paddingLeft: '1px'
 });
-var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
+var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
   var datasourceId = props.datasourceId,
     initialParameters = props.parameters,
     initialVisibleColumnKeys = props.visibleColumnKeys,
@@ -105,6 +109,8 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     totalCount = _useDatasourceTableSt.totalCount;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
+  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
   var selectedJiraSite = (0, _react.useMemo)(function () {
     return availableSites.find(function (jiraSite) {
       return jiraSite.cloudId === cloudId;
@@ -114,6 +120,9 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   var jqlUrl = selectedJiraSite && jql && "".concat(selectedJiraSite.url, "/issues/?jql=").concat(encodeURI(jql));
   var isInsertDisabled = !isParametersSet || status === 'rejected' || status === 'unauthorized' || status === 'loading' || resolvedWithNoResults;
   var shouldShowIssueCount = !!totalCount && totalCount !== 1 && currentViewMode === 'issue';
+  (0, _react.useEffect)(function () {
+    fireEvent('screen.datasourceModalDialog.viewed', {});
+  }, [fireEvent]);
   (0, _react.useEffect)(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
@@ -130,7 +139,10 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
             case 2:
               jiraSites = _context.sent;
               setAvailableSites(jiraSites);
-            case 4:
+              fireEvent('ui.modal.ready.datasource', {
+                instancesCount: jiraSites.length
+              });
+            case 5:
             case "end":
               return _context.stop();
           }
@@ -141,7 +153,7 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
       };
     }();
     void fetchSiteDisplayNames();
-  }, []);
+  }, [fireEvent]);
   (0, _react.useEffect)(function () {
     if (!cloudId && selectedJiraSite) {
       setCloudId(selectedJiraSite.cloudId);
@@ -327,4 +339,17 @@ var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     testId: 'jira-jql-datasource-modal--insert-button'
   }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.modalMessages.insertIssuesButtonText)))));
 };
+exports.PlainJiraIssuesConfigModal = PlainJiraIssuesConfigModal;
+var analyticsContextAttributes = {
+  dataProvider: 'jira-issues'
+};
+var analyticsContextData = {
+  packageName: _version.name,
+  packageVersion: _version.version,
+  source: 'datasourceConfigModal'
+};
+var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {
+  attributes: _objectSpread({}, analyticsContextAttributes)
+});
+var JiraIssuesConfigModal = (0, _analyticsNext.withAnalyticsContext)(contextData)(PlainJiraIssuesConfigModal);
 exports.JiraIssuesConfigModal = JiraIssuesConfigModal;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.31.3",
+	"version": "0.33.0",
 	"sideEffects": false
 }

package/dist/es2019/analytics/constants.js

@@ -0,0 +1 @@
+export const EVENT_CHANNEL = 'media';

package/dist/es2019/analytics/generated/analytics.types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/analytics/generated/create-event-payload.js

@@ -0,0 +1,28 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Generates Typescript types for analytics events from analytics.spec.yaml
+ *
+ * @codegen <<SignedSource::819168596ba17484cadda969f8ecf82d>>
+ * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
+ */
+
+const createEventPayload = (eventKey, ...[attributes]) => {
+  const [eventType, actionSubject, action, actionSubjectId] = eventKey.split('.');
+  if (eventType === 'screen') {
+    return {
+      eventType,
+      name: actionSubject,
+      action: 'viewed',
+      attributes: attributes
+    };
+  }
+  return {
+    eventType,
+    actionSubject,
+    action,
+    actionSubjectId,
+    attributes: attributes
+  };
+};
+export default createEventPayload;

package/dist/es2019/analytics/generated/use-analytics-events.js

@@ -0,0 +1,24 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Generates Typescript types for analytics events from analytics.spec.yaml
+ *
+ * @codegen <<SignedSource::415836762b378b7d79f3aff4ba051c14>>
+ * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
+ */
+import { useCallback } from 'react';
+import { useAnalyticsEvents as useAnalyticsNextEvents } from '@atlaskit/analytics-next';
+import { EVENT_CHANNEL } from '../constants';
+import createEventPayload from './create-event-payload';
+export const useAnalyticsEvents = () => {
+  const {
+    createAnalyticsEvent
+  } = useAnalyticsNextEvents();
+  const fireEvent = useCallback((...params) => {
+    const event = createAnalyticsEvent(createEventPayload(...params));
+    event.fire(EVENT_CHANNEL);
+  }, [createAnalyticsEvent]);
+  return {
+    fireEvent
+  };
+};

package/dist/es2019/analytics/index.js

@@ -0,0 +1,3 @@
+export { EVENT_CHANNEL } from './constants';
+import { useAnalyticsEvents } from './generated/use-analytics-events';
+export const useDatasourceAnalyticsEvents = () => useAnalyticsEvents();

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

@@ -1,7 +1,9 @@
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import EmptyState from '@atlaskit/empty-state';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { AccessRequiredSVG } from './access-required-svg';
 import { loadingErrorMessages } from './messages';
 export const AccessRequired = ({
@@ -10,6 +12,14 @@ export const AccessRequired = ({
   const {
     formatMessage
   } = useIntl();
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
+  useEffect(() => {
+    fireEvent('ui.error.shown', {
+      reason: 'access'
+    });
+  }, [fireEvent]);
   return jsx(EmptyState, {
     header: siteName ? formatMessage(loadingErrorMessages.accessRequiredWithSite, {
       siteName

package/dist/es2019/ui/common/error-state/loading-error.js

@@ -1,7 +1,9 @@
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import Button from '@atlaskit/button/standard-button';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { LoadingErrorSVG } from './loading-error-svg';
 import { loadingErrorMessages } from './messages';
 const errorContainerStyles = css({
@@ -25,6 +27,14 @@ const errorDescriptionStyles = css({
 export const LoadingError = ({
   onRefresh
 }) => {
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
+  useEffect(() => {
+    fireEvent('ui.error.shown', {
+      reason: 'network'
+    });
+  }, [fireEvent]);
   return jsx("div", {
     css: errorContainerStyles,
     "data-testid": "jira-jql-datasource--loading-error"

package/dist/es2019/ui/common/error-state/modal-loading-error.js

@@ -1,7 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { LoadingErrorSVG } from './loading-error-svg';
 import { loadingErrorMessages } from './messages';
 const errorContainerStyles = css({
@@ -25,6 +27,14 @@ const errorDescriptionStyles = css({
 export const ModalLoadingError = ({
   url
 }) => {
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
+  useEffect(() => {
+    fireEvent('ui.error.shown', {
+      reason: 'network'
+    });
+  }, [fireEvent]);
   return jsx("div", {
     css: errorContainerStyles,
     "data-testid": "jira-jql-datasource-modal--loading-error"

package/dist/es2019/ui/common/error-state/no-results.js

@@ -1,7 +1,9 @@
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import Button from '@atlaskit/button/standard-button';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { loadingErrorMessages } from './messages';
 const noResultsContainerStyles = css({
   display: 'grid',
@@ -21,6 +23,12 @@ const noResultsMessageStyles = css({
 export const NoResults = ({
   onRefresh
 }) => {
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
+  useEffect(() => {
+    fireEvent('ui.emptyResult.shown.datasource', {});
+  }, [fireEvent]);
   return jsx("div", {
     css: noResultsContainerStyles,
     "data-testid": "jira-jql-datasource-modal--no-results"

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

@@ -66,7 +66,8 @@ export const DatasourceTableView = ({
     scrollableContainerHeight: 590
   }) : jsx(EmptyState, {
     testId: "datasource-table-view-skeleton",
-    isCompact: true
+    isCompact: true,
+    isLoading: !isDataReady || status === 'loading'
   }), jsx(TableFooter, {
     issueCount: isDataReady ? totalCount : undefined,
     onRefresh: reset,

package/dist/es2019/ui/issue-like-table/empty-state/index.js

@@ -63,13 +63,15 @@ const renderItem = ({
   type,
   summaryWidth,
   statusWidth
-}) => {
+}, isShimmering) => {
   switch (key) {
     case 'assignee':
       return jsx(UserType, null, jsx(Skeleton, {
-        width: width,
+        borderRadius: 8,
+        testId: "empty-state-skeleton",
         height: 13,
-        borderRadius: 8
+        isShimmering: isShimmering,
+        width: width
       }));
     case 'priority':
       return jsx(Priority, {
@@ -82,27 +84,34 @@ const renderItem = ({
     case 'summary':
       return jsx(Skeleton, {
         appearance: "blue",
-        width: summaryWidth,
         borderRadius: 10,
-        height: 13
+        testId: "empty-state-skeleton",
+        height: 13,
+        isShimmering: isShimmering,
+        width: summaryWidth
       });
     case 'status':
       return jsx(Skeleton, {
         appearance: "blue",
-        width: statusWidth,
+        borderRadius: 3,
+        testId: "empty-state-skeleton",
         height: 16,
-        borderRadius: 3
+        isShimmering: isShimmering,
+        width: statusWidth
       });
     default:
       return jsx(Skeleton, {
-        width: width,
+        borderRadius: 8,
+        testId: "empty-state-skeleton",
         height: 13,
-        borderRadius: 8
+        isShimmering: isShimmering,
+        width: width
       });
   }
 };
 export default (({
   isCompact,
+  isLoading = false,
   testId
 }) => {
   const columnsToRender = isCompact ? baseColumns.slice(0, 6) : baseColumns;
@@ -118,9 +127,11 @@ export default (({
     }
   }, jsx(Skeleton, {
     appearance: "darkGray",
-    width: width,
+    borderRadius: 8,
+    testId: "empty-state-skeleton",
+    isShimmering: isLoading,
     height: 13,
-    borderRadius: 8
+    width: width
   }))))), jsx("tbody", {
     css: tableBodyStyles
   }, rows.map(row => jsx("tr", {
@@ -128,5 +139,5 @@ export default (({
   }, columnsToRender.map(column => jsx("td", {
     css: cellStyles,
     key: column.key
-  }, renderItem(column, row)))))));
+  }, renderItem(column, row, isLoading)))))));
 });

package/dist/es2019/ui/jira-issues-modal/jira-search-container/index.js

@@ -2,6 +2,7 @@
 import React, { useState } from 'react';
 import { css, jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { BasicSearchInput } from '../basic-search-input';
 import { JiraJQLEditor } from '../jql-editor';
 import { ModeSwitcher } from '../mode-switcher';
@@ -34,6 +35,9 @@ export const JiraSearchContainer = props => {
   const [jql, setJql] = useState(initialJql || DEFAULT_JQL_QUERY);
   const [orderKey, setOrderKey] = useState();
   const [orderDirection, setOrderDirection] = useState();
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
   const onSearchModeChange = searchMode => {
     setCurrentSearchMode(searchMode);
   };
@@ -65,6 +69,11 @@ export const JiraSearchContainer = props => {
     onSearch({
       jql
     });
+    if (currentSearchMode === basicModeValue) {
+      fireEvent('ui.form.submitted.basicSearch', {});
+    } else if (currentSearchMode === jqlModeValue) {
+      fireEvent('ui.jqlEditor.searched', {});
+    }
   };
   return jsx("div", {
     css: inputContainerStyles

package/dist/es2019/ui/jira-issues-modal/modal/index.js

@@ -3,11 +3,14 @@ import _extends from "@babel/runtime/helpers/extends";
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage, FormattedNumber, useIntl } from 'react-intl-next';
+import { withAnalyticsContext } from '@atlaskit/analytics-next';
 import Button from '@atlaskit/button/standard-button';
 import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
 import { B400, N0, N40, N800 } from '@atlaskit/theme/colors';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { useDatasourceTableState } from '../../../hooks/useDatasourceTableState';
 import { getAvailableJiraSites } from '../../../services/getAvailableJiraSites';
+import { name as packageName, version as packageVersion } from '../../../version.json';
 import { AccessRequired } from '../../common/error-state/access-required';
 import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
 import { NoResults } from '../../common/error-state/no-results';
@@ -42,7 +45,7 @@ const issueCountStyles = css({
 const smartLinkContainerStyles = css({
   paddingLeft: '1px'
 });
-export const JiraIssuesConfigModal = props => {
+export const PlainJiraIssuesConfigModal = props => {
   const {
     datasourceId,
     parameters: initialParameters,
@@ -78,11 +81,17 @@ export const JiraIssuesConfigModal = props => {
   const {
     formatMessage
   } = useIntl();
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
   const selectedJiraSite = useMemo(() => availableSites.find(jiraSite => jiraSite.cloudId === cloudId) || availableSites[0], [availableSites, cloudId]);
   const resolvedWithNoResults = status === 'resolved' && !responseItems.length;
   const jqlUrl = selectedJiraSite && jql && `${selectedJiraSite.url}/issues/?jql=${encodeURI(jql)}`;
   const isInsertDisabled = !isParametersSet || status === 'rejected' || status === 'unauthorized' || status === 'loading' || resolvedWithNoResults;
   const shouldShowIssueCount = !!totalCount && totalCount !== 1 && currentViewMode === 'issue';
+  useEffect(() => {
+    fireEvent('screen.datasourceModalDialog.viewed', {});
+  }, [fireEvent]);
   useEffect(() => {
     const newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
@@ -91,9 +100,12 @@ export const JiraIssuesConfigModal = props => {
     const fetchSiteDisplayNames = async () => {
       const jiraSites = await getAvailableJiraSites();
       setAvailableSites(jiraSites);
+      fireEvent('ui.modal.ready.datasource', {
+        instancesCount: jiraSites.length
+      });
     };
     void fetchSiteDisplayNames();
-  }, []);
+  }, [fireEvent]);
   useEffect(() => {
     if (!cloudId && selectedJiraSite) {
       setCloudId(selectedJiraSite.cloudId);
@@ -273,4 +285,19 @@ export const JiraIssuesConfigModal = props => {
     isDisabled: isInsertDisabled,
     testId: 'jira-jql-datasource-modal--insert-button'
   }, jsx(FormattedMessage, modalMessages.insertIssuesButtonText)))));
-};
+};
+const analyticsContextAttributes = {
+  dataProvider: 'jira-issues'
+};
+const analyticsContextData = {
+  packageName,
+  packageVersion,
+  source: 'datasourceConfigModal'
+};
+const contextData = {
+  ...analyticsContextData,
+  attributes: {
+    ...analyticsContextAttributes
+  }
+};
+export const JiraIssuesConfigModal = withAnalyticsContext(contextData)(PlainJiraIssuesConfigModal);

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.31.3",
+	"version": "0.33.0",
 	"sideEffects": false
 }

package/dist/esm/analytics/constants.js

@@ -0,0 +1 @@
+export var EVENT_CHANNEL = 'media';

package/dist/esm/analytics/generated/analytics.types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/analytics/generated/create-event-payload.js

@@ -0,0 +1,38 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Generates Typescript types for analytics events from analytics.spec.yaml
+ *
+ * @codegen <<SignedSource::819168596ba17484cadda969f8ecf82d>>
+ * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
+ */
+
+var createEventPayload = function createEventPayload(eventKey) {
+  for (var _len = arguments.length, _ref = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    _ref[_key - 1] = arguments[_key];
+  }
+  var attributes = _ref[0];
+  var _eventKey$split = eventKey.split('.'),
+    _eventKey$split2 = _slicedToArray(_eventKey$split, 4),
+    eventType = _eventKey$split2[0],
+    actionSubject = _eventKey$split2[1],
+    action = _eventKey$split2[2],
+    actionSubjectId = _eventKey$split2[3];
+  if (eventType === 'screen') {
+    return {
+      eventType: eventType,
+      name: actionSubject,
+      action: 'viewed',
+      attributes: attributes
+    };
+  }
+  return {
+    eventType: eventType,
+    actionSubject: actionSubject,
+    action: action,
+    actionSubjectId: actionSubjectId,
+    attributes: attributes
+  };
+};
+export default createEventPayload;

package/dist/esm/analytics/generated/use-analytics-events.js

@@ -0,0 +1,23 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Generates Typescript types for analytics events from analytics.spec.yaml
+ *
+ * @codegen <<SignedSource::415836762b378b7d79f3aff4ba051c14>>
+ * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
+ */
+import { useCallback } from 'react';
+import { useAnalyticsEvents as useAnalyticsNextEvents } from '@atlaskit/analytics-next';
+import { EVENT_CHANNEL } from '../constants';
+import createEventPayload from './create-event-payload';
+export var useAnalyticsEvents = function useAnalyticsEvents() {
+  var _useAnalyticsNextEven = useAnalyticsNextEvents(),
+    createAnalyticsEvent = _useAnalyticsNextEven.createAnalyticsEvent;
+  var fireEvent = useCallback(function () {
+    var event = createAnalyticsEvent(createEventPayload.apply(void 0, arguments));
+    event.fire(EVENT_CHANNEL);
+  }, [createAnalyticsEvent]);
+  return {
+    fireEvent: fireEvent
+  };
+};

package/dist/esm/analytics/index.js

@@ -0,0 +1,5 @@
+export { EVENT_CHANNEL } from './constants';
+import { useAnalyticsEvents } from './generated/use-analytics-events';
+export var useDatasourceAnalyticsEvents = function useDatasourceAnalyticsEvents() {
+  return useAnalyticsEvents();
+};

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

@@ -1,13 +1,22 @@
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import EmptyState from '@atlaskit/empty-state';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { AccessRequiredSVG } from './access-required-svg';
 import { loadingErrorMessages } from './messages';
 export var AccessRequired = function AccessRequired(_ref) {
   var siteName = _ref.siteName;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
+  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  useEffect(function () {
+    fireEvent('ui.error.shown', {
+      reason: 'access'
+    });
+  }, [fireEvent]);
   return jsx(EmptyState, {
     header: siteName ? formatMessage(loadingErrorMessages.accessRequiredWithSite, {
       siteName: siteName

package/dist/esm/ui/common/error-state/loading-error.js

@@ -1,7 +1,9 @@
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import Button from '@atlaskit/button/standard-button';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { LoadingErrorSVG } from './loading-error-svg';
 import { loadingErrorMessages } from './messages';
 var errorContainerStyles = css({
@@ -24,6 +26,13 @@ var errorDescriptionStyles = css({
 });
 export var LoadingError = function LoadingError(_ref) {
   var onRefresh = _ref.onRefresh;
+  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  useEffect(function () {
+    fireEvent('ui.error.shown', {
+      reason: 'network'
+    });
+  }, [fireEvent]);
   return jsx("div", {
     css: errorContainerStyles,
     "data-testid": "jira-jql-datasource--loading-error"

package/dist/esm/ui/common/error-state/modal-loading-error.js

@@ -1,7 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
+import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { LoadingErrorSVG } from './loading-error-svg';
 import { loadingErrorMessages } from './messages';
 var errorContainerStyles = css({
@@ -24,6 +26,13 @@ var errorDescriptionStyles = css({
 });
 export var ModalLoadingError = function ModalLoadingError(_ref) {
   var url = _ref.url;
+  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  useEffect(function () {
+    fireEvent('ui.error.shown', {
+      reason: 'network'
+    });
+  }, [fireEvent]);
   return jsx("div", {
     css: errorContainerStyles,
     "data-testid": "jira-jql-datasource-modal--loading-error"