@atlaskit/link-datasource 1.2.1 → 1.2.3

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/link-datasource
 
+## 1.2.3
+
+### Patch Changes
+
+- [`de4dddb97d4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/de4dddb97d4) - Added 'ui.datasource.renderSuccess' event with display = 'table'
+
+## 1.2.2
+
+### Patch Changes
+
+- [`ce3de76af77`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ce3de76af77) - Added ui.table.viewed event
+- Updated dependencies
+
 ## 1.2.1
 
 ### Patch Changes

package/dist/cjs/analytics/constants.js

@@ -8,6 +8,6 @@ var EVENT_CHANNEL = 'media';
 exports.EVENT_CHANNEL = EVENT_CHANNEL;
 var packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1"
+  packageVersion: "1.2.3"
 };
 exports.packageMetaData = packageMetaData;

package/dist/cjs/hooks/useDatasourceTableState.js

@@ -67,7 +67,7 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
     getDatasourceData = _useDatasourceClientE.getDatasourceData,
     getDatasourceDetails = _useDatasourceClientE.getDatasourceDetails;
   var loadDatasourceDetails = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-    var _yield$getDatasourceD, _yield$getDatasourceD2, access, _destinationObjectTypes, _extensionKey, schema, isColumnNotPresentInCurrentColumnsList, allColumns, newColumns;
+    var _yield$getDatasourceD, access, schema, isColumnNotPresentInCurrentColumnsList, allColumns, newColumns;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
@@ -84,20 +84,15 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
           });
         case 5:
           _yield$getDatasourceD = _context.sent;
-          _yield$getDatasourceD2 = _yield$getDatasourceD.meta;
-          access = _yield$getDatasourceD2.access;
-          _destinationObjectTypes = _yield$getDatasourceD2.destinationObjectTypes;
-          _extensionKey = _yield$getDatasourceD2.extensionKey;
+          access = _yield$getDatasourceD.meta.access;
           schema = _yield$getDatasourceD.data.schema;
           if (!(access === 'forbidden' || access === 'unauthorized')) {
-            _context.next = 14;
+            _context.next = 11;
             break;
           }
           setStatus('unauthorized');
           return _context.abrupt("return");
-        case 14:
-          setExtensionKey(_extensionKey);
-          setDestinationObjectTypes(_destinationObjectTypes);
+        case 11:
           isColumnNotPresentInCurrentColumnsList = function isColumnNotPresentInCurrentColumnsList(col) {
             return !columns.find(function (column) {
               return column.key === col.key;
@@ -106,17 +101,17 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
           allColumns = schema.properties;
           newColumns = allColumns.filter(isColumnNotPresentInCurrentColumnsList);
           newColumns.length > 0 && setColumns([].concat((0, _toConsumableArray2.default)(columns), (0, _toConsumableArray2.default)(newColumns)));
-          _context.next = 25;
+          _context.next = 20;
           break;
-        case 22:
-          _context.prev = 22;
+        case 17:
+          _context.prev = 17;
           _context.t0 = _context["catch"](2);
           setStatus('rejected');
-        case 25:
+        case 20:
         case "end":
           return _context.stop();
       }
-    }, _callee, null, [[2, 22]]);
+    }, _callee, null, [[2, 17]]);
   })), [columns, datasourceId, getDatasourceDetails, parameters]);
   var applySchemaProperties = (0, _react.useCallback)(function (properties) {
     if (columns.length === 0) {
@@ -144,12 +139,12 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
       shouldForceRequest,
       sortedFieldKeys,
       datasourceDataRequest,
+      _yield$getDatasourceD2,
       _yield$getDatasourceD3,
-      _yield$getDatasourceD4,
       access,
-      _destinationObjectTypes2,
-      _extensionKey2,
-      _yield$getDatasourceD5,
+      _destinationObjectTypes,
+      _extensionKey,
+      _yield$getDatasourceD4,
       items,
       nextPageCursor,
       _totalCount,
@@ -183,16 +178,16 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
           _context2.next = 11;
           return getDatasourceData(datasourceId, datasourceDataRequest, shouldForceRequest);
         case 11:
-          _yield$getDatasourceD3 = _context2.sent;
-          _yield$getDatasourceD4 = _yield$getDatasourceD3.meta;
-          access = _yield$getDatasourceD4.access;
-          _destinationObjectTypes2 = _yield$getDatasourceD4.destinationObjectTypes;
-          _extensionKey2 = _yield$getDatasourceD4.extensionKey;
-          _yield$getDatasourceD5 = _yield$getDatasourceD3.data;
-          items = _yield$getDatasourceD5.items;
-          nextPageCursor = _yield$getDatasourceD5.nextPageCursor;
-          _totalCount = _yield$getDatasourceD5.totalCount;
-          schema = _yield$getDatasourceD5.schema;
+          _yield$getDatasourceD2 = _context2.sent;
+          _yield$getDatasourceD3 = _yield$getDatasourceD2.meta;
+          access = _yield$getDatasourceD3.access;
+          _destinationObjectTypes = _yield$getDatasourceD3.destinationObjectTypes;
+          _extensionKey = _yield$getDatasourceD3.extensionKey;
+          _yield$getDatasourceD4 = _yield$getDatasourceD2.data;
+          items = _yield$getDatasourceD4.items;
+          nextPageCursor = _yield$getDatasourceD4.nextPageCursor;
+          _totalCount = _yield$getDatasourceD4.totalCount;
+          schema = _yield$getDatasourceD4.schema;
           if (!(access === 'forbidden' || access === 'unauthorized')) {
             _context2.next = 24;
             break;
@@ -200,8 +195,8 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
           setStatus('unauthorized');
           return _context2.abrupt("return");
         case 24:
-          setExtensionKey(_extensionKey2);
-          setDestinationObjectTypes(_destinationObjectTypes2);
+          setExtensionKey(_extensionKey);
+          setDestinationObjectTypes(_destinationObjectTypes);
           setTotalCount(_totalCount);
           setNextCursor(nextPageCursor);
           setResponseItems(function (currentResponseItems) {
@@ -210,7 +205,6 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
             }
             return [].concat((0, _toConsumableArray2.default)(currentResponseItems), (0, _toConsumableArray2.default)(items));
           });
-          setStatus('resolved');
           setHasNextPage(Boolean(nextPageCursor));
           if (fieldKeys.length > 0) {
             setLastRequestedFieldKeys(fieldKeys);
@@ -223,11 +217,12 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
             currentLoadedItemCount = (responseItems === null || responseItems === void 0 ? void 0 : responseItems.length) || 0;
             newlyLoadedItemCount = (items === null || items === void 0 ? void 0 : items.length) || 0;
             fireEvent('track.nextItem.loaded', {
-              extensionKey: _extensionKey2,
-              destinationObjectTypes: _destinationObjectTypes2,
+              extensionKey: _extensionKey,
+              destinationObjectTypes: _destinationObjectTypes,
               loadedItemCount: currentLoadedItemCount + newlyLoadedItemCount
             });
           }
+          setStatus('resolved');
           _context2.next = 40;
           break;
         case 37:

package/dist/cjs/ui/assets-modal/modal/index.js

@@ -231,7 +231,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1",
+  packageVersion: "1.2.3",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

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

@@ -48,12 +48,15 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
     fireEvent = _useDatasourceAnalyti.fireEvent;
   var _useRef = (0, _react.useRef)((0, _uuid.v4)()),
     tableRenderInstanceId = _useRef.current;
+  var visibleColumnCount = (0, _react.useRef)((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
 
   /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
       But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
       mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
    */
   var isInitialRender = (0, _react.useRef)(true);
+  var isDataReady = columns.length > 0 && responseItems.length > 0 && totalCount && totalCount > 0;
+  visibleColumnCount.current = (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0;
   (0, _react.useEffect)(function () {
     if (!isInitialRender.current) {
       reset();
@@ -65,6 +68,18 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
+  (0, _react.useEffect)(function () {
+    var isTableViewRenderedWithData = status === 'resolved' && isDataReady;
+    if (isTableViewRenderedWithData) {
+      fireEvent('ui.datasource.renderSuccess', {
+        extensionKey: extensionKey,
+        destinationObjectTypes: destinationObjectTypes,
+        totalItemCount: totalCount,
+        displayedColumnCount: visibleColumnCount.current,
+        display: 'table'
+      });
+    }
+  }, [totalCount, fireEvent, status, extensionKey, destinationObjectTypes, isDataReady]);
   (0, _react.useEffect)(function () {
     var shouldStartUfoExperience = datasourceId && parameters && visibleColumnKeys && status === 'loading';
     if (shouldStartUfoExperience) {
@@ -101,7 +116,6 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       onRefresh: reset
     });
   }
-  var isDataReady = columns.length > 0;
   return (
     // datasource-table classname is to exclude all children from being commentable - exclude list is in CFE
     (0, _react2.jsx)("div", {

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

@@ -120,6 +120,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
   var searchCount = (0, _react.useRef)(0);
   var userInteractionActions = (0, _react.useRef)(new Set());
   var lastSearchMethodRef = (0, _react.useRef)(null);
+  var visibleColumnCount = (0, _react.useRef)((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   var parameters = (0, _react.useMemo)(function () {
     return !!cloudId ? {
       cloudId: cloudId,
@@ -164,7 +165,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
       }) || availableSites[0];
     }
   }, [availableSites, cloudId]);
-  var buttonClickedAnalyticsPayload = (0, _react.useMemo)(function () {
+  var analyticsPayload = (0, _react.useMemo)(function () {
     return {
       extensionKey: extensionKey,
       destinationObjectTypes: destinationObjectTypes
@@ -174,6 +175,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(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';
+  var isDataReady = (visibleColumnKeys || []).length > 0;
   (0, _react.useEffect)(function () {
     var shouldStartUfoExperience = status === 'loading';
     if (shouldStartUfoExperience) {
@@ -194,6 +196,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
   }, [fireEvent]);
   (0, _react.useEffect)(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
   (0, _react.useEffect)(function () {
@@ -229,32 +232,48 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     }
   }, [cloudId, selectedJiraSite]);
   var fireSingleItemViewedEvent = (0, _react.useCallback)(function () {
-    fireEvent('ui.link.viewed.singleItem', {
-      destinationObjectTypes: destinationObjectTypes,
-      searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
-      extensionKey: extensionKey
-    });
-  }, [extensionKey, fireEvent, destinationObjectTypes]);
+    fireEvent('ui.link.viewed.singleItem', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current)
+    }));
+  }, [analyticsPayload, fireEvent]);
   var fireCountViewedEvent = (0, _react.useCallback)(function () {
-    fireEvent('ui.link.viewed.count', {
-      destinationObjectTypes: destinationObjectTypes,
+    fireEvent('ui.link.viewed.count', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
       searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
-      extensionKey: extensionKey,
       totalItemCount: totalCount || 0
-    });
-  }, [extensionKey, fireEvent, totalCount, destinationObjectTypes]);
+    }));
+  }, [analyticsPayload, fireEvent, totalCount]);
+  var fireTableViewedEvent = (0, _react.useCallback)(function () {
+    if (isDataReady) {
+      fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
+        displayedColumnCount: visibleColumnCount.current
+      }));
+    }
+  }, [analyticsPayload, fireEvent, totalCount, isDataReady]);
+  var fireIssueViewAnalytics = (0, _react.useCallback)(function () {
+    if (!totalCount) {
+      return;
+    }
+    if (totalCount > 1) {
+      fireTableViewedEvent();
+    } else if (totalCount === 1) {
+      fireSingleItemViewedEvent();
+    }
+  }, [fireSingleItemViewedEvent, fireTableViewedEvent, totalCount]);
   (0, _react.useEffect)(function () {
     var isResolved = status === 'resolved';
-    var isSingleItemViewed = currentViewMode === 'issue' && totalCount === 1;
-    var isCountViewed = currentViewMode === 'count';
-    if (isResolved) {
-      if (isSingleItemViewed) {
-        fireSingleItemViewedEvent();
-      } else if (isCountViewed && totalCount) {
-        fireCountViewedEvent();
-      }
+    var isIssueViewMode = currentViewMode === 'issue';
+    var isCountViewMode = currentViewMode === 'count';
+    if (!isResolved) {
+      return;
+    }
+    if (isIssueViewMode) {
+      fireIssueViewAnalytics();
+    } else if (isCountViewMode) {
+      fireCountViewedEvent();
     }
-  }, [currentViewMode, totalCount, status, fireSingleItemViewedEvent, fireCountViewedEvent]);
+  }, [currentViewMode, status, fireIssueViewAnalytics, fireCountViewedEvent]);
   var onSearch = (0, _react.useCallback)(function (newParameters, searchMethod) {
     searchCount.current++;
     lastSearchMethodRef.current = searchMethod;
@@ -270,13 +289,13 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     analyticEvent.update({
       eventType: 'ui',
       actionSubjectId: 'cancel',
-      attributes: _objectSpread(_objectSpread({}, buttonClickedAnalyticsPayload), {}, {
-        actions: Array.from(userInteractionActions.current),
-        searchCount: searchCount.current
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        searchCount: searchCount.current,
+        actions: Array.from(userInteractionActions.current)
       })
     }).fire(_analytics.EVENT_CHANNEL);
     onCancel();
-  }, [buttonClickedAnalyticsPayload, onCancel]);
+  }, [analyticsPayload, onCancel]);
   var onSiteSelection = (0, _react.useCallback)(function (site) {
     userInteractionActions.current.add(_types.DatasourceAction.INSTANCE_UPDATED);
     setCloudId(site.cloudId);
@@ -298,13 +317,13 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     }
     var insertButtonClickedEvent = analyticsEvent.update({
       actionSubjectId: 'insert',
-      attributes: _objectSpread(_objectSpread({}, buttonClickedAnalyticsPayload), {}, {
-        actions: Array.from(userInteractionActions.current),
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
         totalItemCount: totalCount || 0,
-        displayedColumnCount: (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0,
+        displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current)
+        searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
+        actions: Array.from(userInteractionActions.current)
       }),
       eventType: 'ui'
     });
@@ -351,7 +370,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
         }
       }, consumerEvent);
     }
-  }, [isParametersSet, jql, selectedJiraSite, buttonClickedAnalyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
+  }, [isParametersSet, jql, selectedJiraSite, analyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
   var handleViewModeChange = function handleViewModeChange(selectedMode) {
     userInteractionActions.current.add(_types.DatasourceAction.DISPLAY_VIEW_CHANGED);
     setCurrentViewMode(selectedMode);
@@ -364,6 +383,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     var newVisibleColumnKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     var columnAction = getColumnAction(visibleColumnKeys || [], newVisibleColumnKeys);
     userInteractionActions.current.add(columnAction);
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [visibleColumnKeys]);
   var issueLikeDataTableView = (0, _react.useMemo)(function () {

package/dist/es2019/analytics/constants.js

@@ -1,5 +1,5 @@
 export const EVENT_CHANNEL = 'media';
 export const packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1"
+  packageVersion: "1.2.3"
 };

package/dist/es2019/hooks/useDatasourceTableState.js

@@ -31,9 +31,7 @@ export const useDatasourceTableState = ({
     try {
       const {
         meta: {
-          access,
-          destinationObjectTypes,
-          extensionKey
+          access
         },
         data: {
           schema
@@ -45,8 +43,6 @@ export const useDatasourceTableState = ({
         setStatus('unauthorized');
         return;
       }
-      setExtensionKey(extensionKey);
-      setDestinationObjectTypes(destinationObjectTypes);
       const isColumnNotPresentInCurrentColumnsList = col => !columns.find(column => column.key === col.key);
       const allColumns = schema.properties;
       const newColumns = allColumns.filter(isColumnNotPresentInCurrentColumnsList);
@@ -118,7 +114,6 @@ export const useDatasourceTableState = ({
         }
         return [...currentResponseItems, ...items];
       });
-      setStatus('resolved');
       setHasNextPage(Boolean(nextPageCursor));
       if (fieldKeys.length > 0) {
         setLastRequestedFieldKeys(fieldKeys);
@@ -136,6 +131,7 @@ export const useDatasourceTableState = ({
           loadedItemCount: currentLoadedItemCount + newlyLoadedItemCount
         });
       }
+      setStatus('resolved');
     } catch (e) {
       setStatus('rejected');
     }

package/dist/es2019/ui/assets-modal/modal/index.js

@@ -205,7 +205,7 @@ const analyticsContextAttributes = {
 };
 const analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1",
+  packageVersion: "1.2.3",
   source: 'datasourceConfigModal'
 };
 const contextData = {

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

@@ -43,12 +43,15 @@ const DatasourceTableViewWithoutAnalytics = ({
   const {
     current: tableRenderInstanceId
   } = useRef(uuidv4());
+  const visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
 
   /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
       But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
       mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
    */
   const isInitialRender = useRef(true);
+  const isDataReady = columns.length > 0 && responseItems.length > 0 && totalCount && totalCount > 0;
+  visibleColumnCount.current = (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0;
   useEffect(() => {
     if (!isInitialRender.current) {
       reset();
@@ -60,6 +63,18 @@ const DatasourceTableViewWithoutAnalytics = ({
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
+  useEffect(() => {
+    const isTableViewRenderedWithData = status === 'resolved' && isDataReady;
+    if (isTableViewRenderedWithData) {
+      fireEvent('ui.datasource.renderSuccess', {
+        extensionKey,
+        destinationObjectTypes,
+        totalItemCount: totalCount,
+        displayedColumnCount: visibleColumnCount.current,
+        display: 'table'
+      });
+    }
+  }, [totalCount, fireEvent, status, extensionKey, destinationObjectTypes, isDataReady]);
   useEffect(() => {
     const shouldStartUfoExperience = datasourceId && parameters && visibleColumnKeys && status === 'loading';
     if (shouldStartUfoExperience) {
@@ -96,7 +111,6 @@ const DatasourceTableViewWithoutAnalytics = ({
       onRefresh: reset
     });
   }
-  const isDataReady = columns.length > 0;
   return (
     // datasource-table classname is to exclude all children from being commentable - exclude list is in CFE
     jsx("div", {

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

@@ -91,6 +91,7 @@ export const PlainJiraIssuesConfigModal = props => {
   const searchCount = useRef(0);
   const userInteractionActions = useRef(new Set());
   const lastSearchMethodRef = useRef(null);
+  const visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   const parameters = useMemo(() => !!cloudId ? {
     cloudId,
     jql: jql || ''
@@ -132,7 +133,7 @@ export const PlainJiraIssuesConfigModal = props => {
       return availableSites.find(jiraSite => jiraSite.url === currentlyLoggedInSiteUrl) || availableSites[0];
     }
   }, [availableSites, cloudId]);
-  const buttonClickedAnalyticsPayload = useMemo(() => {
+  const analyticsPayload = useMemo(() => {
     return {
       extensionKey: extensionKey,
       destinationObjectTypes: destinationObjectTypes
@@ -142,6 +143,7 @@ export const PlainJiraIssuesConfigModal = props => {
   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';
+  const isDataReady = (visibleColumnKeys || []).length > 0;
   useEffect(() => {
     const shouldStartUfoExperience = status === 'loading';
     if (shouldStartUfoExperience) {
@@ -162,6 +164,7 @@ export const PlainJiraIssuesConfigModal = props => {
   }, [fireEvent]);
   useEffect(() => {
     const newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
   useEffect(() => {
@@ -181,31 +184,50 @@ export const PlainJiraIssuesConfigModal = props => {
   }, [cloudId, selectedJiraSite]);
   const fireSingleItemViewedEvent = useCallback(() => {
     fireEvent('ui.link.viewed.singleItem', {
-      destinationObjectTypes: destinationObjectTypes,
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current),
-      extensionKey: extensionKey
+      ...analyticsPayload,
+      searchMethod: mapSearchMethod(lastSearchMethodRef.current)
     });
-  }, [extensionKey, fireEvent, destinationObjectTypes]);
+  }, [analyticsPayload, fireEvent]);
   const fireCountViewedEvent = useCallback(() => {
     fireEvent('ui.link.viewed.count', {
-      destinationObjectTypes: destinationObjectTypes,
+      ...analyticsPayload,
       searchMethod: mapSearchMethod(lastSearchMethodRef.current),
-      extensionKey: extensionKey,
       totalItemCount: totalCount || 0
     });
-  }, [extensionKey, fireEvent, totalCount, destinationObjectTypes]);
+  }, [analyticsPayload, fireEvent, totalCount]);
+  const fireTableViewedEvent = useCallback(() => {
+    if (isDataReady) {
+      fireEvent('ui.table.viewed.datasourceConfigModal', {
+        ...analyticsPayload,
+        totalItemCount: totalCount || 0,
+        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        displayedColumnCount: visibleColumnCount.current
+      });
+    }
+  }, [analyticsPayload, fireEvent, totalCount, isDataReady]);
+  const fireIssueViewAnalytics = useCallback(() => {
+    if (!totalCount) {
+      return;
+    }
+    if (totalCount > 1) {
+      fireTableViewedEvent();
+    } else if (totalCount === 1) {
+      fireSingleItemViewedEvent();
+    }
+  }, [fireSingleItemViewedEvent, fireTableViewedEvent, totalCount]);
   useEffect(() => {
     const isResolved = status === 'resolved';
-    const isSingleItemViewed = currentViewMode === 'issue' && totalCount === 1;
-    const isCountViewed = currentViewMode === 'count';
-    if (isResolved) {
-      if (isSingleItemViewed) {
-        fireSingleItemViewedEvent();
-      } else if (isCountViewed && totalCount) {
-        fireCountViewedEvent();
-      }
+    const isIssueViewMode = currentViewMode === 'issue';
+    const isCountViewMode = currentViewMode === 'count';
+    if (!isResolved) {
+      return;
+    }
+    if (isIssueViewMode) {
+      fireIssueViewAnalytics();
+    } else if (isCountViewMode) {
+      fireCountViewedEvent();
     }
-  }, [currentViewMode, totalCount, status, fireSingleItemViewedEvent, fireCountViewedEvent]);
+  }, [currentViewMode, status, fireIssueViewAnalytics, fireCountViewedEvent]);
   const onSearch = useCallback((newParameters, searchMethod) => {
     searchCount.current++;
     lastSearchMethodRef.current = searchMethod;
@@ -222,13 +244,13 @@ export const PlainJiraIssuesConfigModal = props => {
       eventType: 'ui',
       actionSubjectId: 'cancel',
       attributes: {
-        ...buttonClickedAnalyticsPayload,
-        actions: Array.from(userInteractionActions.current),
-        searchCount: searchCount.current
+        ...analyticsPayload,
+        searchCount: searchCount.current,
+        actions: Array.from(userInteractionActions.current)
       }
     }).fire(EVENT_CHANNEL);
     onCancel();
-  }, [buttonClickedAnalyticsPayload, onCancel]);
+  }, [analyticsPayload, onCancel]);
   const onSiteSelection = useCallback(site => {
     userInteractionActions.current.add(DatasourceAction.INSTANCE_UPDATED);
     setCloudId(site.cloudId);
@@ -250,13 +272,13 @@ export const PlainJiraIssuesConfigModal = props => {
     const insertButtonClickedEvent = analyticsEvent.update({
       actionSubjectId: 'insert',
       attributes: {
-        ...buttonClickedAnalyticsPayload,
-        actions: Array.from(userInteractionActions.current),
+        ...analyticsPayload,
         totalItemCount: totalCount || 0,
-        displayedColumnCount: (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0,
+        displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current)
+        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        actions: Array.from(userInteractionActions.current)
       },
       eventType: 'ui'
     });
@@ -301,7 +323,7 @@ export const PlainJiraIssuesConfigModal = props => {
         }
       }, consumerEvent);
     }
-  }, [isParametersSet, jql, selectedJiraSite, buttonClickedAnalyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
+  }, [isParametersSet, jql, selectedJiraSite, analyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
   const handleViewModeChange = selectedMode => {
     userInteractionActions.current.add(DatasourceAction.DISPLAY_VIEW_CHANGED);
     setCurrentViewMode(selectedMode);
@@ -313,6 +335,7 @@ export const PlainJiraIssuesConfigModal = props => {
   const handleVisibleColumnKeysChange = useCallback((newVisibleColumnKeys = []) => {
     const columnAction = getColumnAction(visibleColumnKeys || [], newVisibleColumnKeys);
     userInteractionActions.current.add(columnAction);
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [visibleColumnKeys]);
   const issueLikeDataTableView = useMemo(() => jsx("div", {

package/dist/esm/analytics/constants.js

@@ -1,5 +1,5 @@
 export var EVENT_CHANNEL = 'media';
 export var packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1"
+  packageVersion: "1.2.3"
 };

package/dist/esm/hooks/useDatasourceTableState.js

@@ -60,7 +60,7 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
     getDatasourceData = _useDatasourceClientE.getDatasourceData,
     getDatasourceDetails = _useDatasourceClientE.getDatasourceDetails;
   var loadDatasourceDetails = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-    var _yield$getDatasourceD, _yield$getDatasourceD2, access, _destinationObjectTypes, _extensionKey, schema, isColumnNotPresentInCurrentColumnsList, allColumns, newColumns;
+    var _yield$getDatasourceD, access, schema, isColumnNotPresentInCurrentColumnsList, allColumns, newColumns;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
@@ -77,20 +77,15 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
           });
         case 5:
           _yield$getDatasourceD = _context.sent;
-          _yield$getDatasourceD2 = _yield$getDatasourceD.meta;
-          access = _yield$getDatasourceD2.access;
-          _destinationObjectTypes = _yield$getDatasourceD2.destinationObjectTypes;
-          _extensionKey = _yield$getDatasourceD2.extensionKey;
+          access = _yield$getDatasourceD.meta.access;
           schema = _yield$getDatasourceD.data.schema;
           if (!(access === 'forbidden' || access === 'unauthorized')) {
-            _context.next = 14;
+            _context.next = 11;
             break;
           }
           setStatus('unauthorized');
           return _context.abrupt("return");
-        case 14:
-          setExtensionKey(_extensionKey);
-          setDestinationObjectTypes(_destinationObjectTypes);
+        case 11:
           isColumnNotPresentInCurrentColumnsList = function isColumnNotPresentInCurrentColumnsList(col) {
             return !columns.find(function (column) {
               return column.key === col.key;
@@ -99,17 +94,17 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
           allColumns = schema.properties;
           newColumns = allColumns.filter(isColumnNotPresentInCurrentColumnsList);
           newColumns.length > 0 && setColumns([].concat(_toConsumableArray(columns), _toConsumableArray(newColumns)));
-          _context.next = 25;
+          _context.next = 20;
           break;
-        case 22:
-          _context.prev = 22;
+        case 17:
+          _context.prev = 17;
           _context.t0 = _context["catch"](2);
           setStatus('rejected');
-        case 25:
+        case 20:
         case "end":
           return _context.stop();
       }
-    }, _callee, null, [[2, 22]]);
+    }, _callee, null, [[2, 17]]);
   })), [columns, datasourceId, getDatasourceDetails, parameters]);
   var applySchemaProperties = useCallback(function (properties) {
     if (columns.length === 0) {
@@ -137,12 +132,12 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
       shouldForceRequest,
       sortedFieldKeys,
       datasourceDataRequest,
+      _yield$getDatasourceD2,
       _yield$getDatasourceD3,
-      _yield$getDatasourceD4,
       access,
-      _destinationObjectTypes2,
-      _extensionKey2,
-      _yield$getDatasourceD5,
+      _destinationObjectTypes,
+      _extensionKey,
+      _yield$getDatasourceD4,
       items,
       nextPageCursor,
       _totalCount,
@@ -176,16 +171,16 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
           _context2.next = 11;
           return getDatasourceData(datasourceId, datasourceDataRequest, shouldForceRequest);
         case 11:
-          _yield$getDatasourceD3 = _context2.sent;
-          _yield$getDatasourceD4 = _yield$getDatasourceD3.meta;
-          access = _yield$getDatasourceD4.access;
-          _destinationObjectTypes2 = _yield$getDatasourceD4.destinationObjectTypes;
-          _extensionKey2 = _yield$getDatasourceD4.extensionKey;
-          _yield$getDatasourceD5 = _yield$getDatasourceD3.data;
-          items = _yield$getDatasourceD5.items;
-          nextPageCursor = _yield$getDatasourceD5.nextPageCursor;
-          _totalCount = _yield$getDatasourceD5.totalCount;
-          schema = _yield$getDatasourceD5.schema;
+          _yield$getDatasourceD2 = _context2.sent;
+          _yield$getDatasourceD3 = _yield$getDatasourceD2.meta;
+          access = _yield$getDatasourceD3.access;
+          _destinationObjectTypes = _yield$getDatasourceD3.destinationObjectTypes;
+          _extensionKey = _yield$getDatasourceD3.extensionKey;
+          _yield$getDatasourceD4 = _yield$getDatasourceD2.data;
+          items = _yield$getDatasourceD4.items;
+          nextPageCursor = _yield$getDatasourceD4.nextPageCursor;
+          _totalCount = _yield$getDatasourceD4.totalCount;
+          schema = _yield$getDatasourceD4.schema;
           if (!(access === 'forbidden' || access === 'unauthorized')) {
             _context2.next = 24;
             break;
@@ -193,8 +188,8 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
           setStatus('unauthorized');
           return _context2.abrupt("return");
         case 24:
-          setExtensionKey(_extensionKey2);
-          setDestinationObjectTypes(_destinationObjectTypes2);
+          setExtensionKey(_extensionKey);
+          setDestinationObjectTypes(_destinationObjectTypes);
           setTotalCount(_totalCount);
           setNextCursor(nextPageCursor);
           setResponseItems(function (currentResponseItems) {
@@ -203,7 +198,6 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
             }
             return [].concat(_toConsumableArray(currentResponseItems), _toConsumableArray(items));
           });
-          setStatus('resolved');
           setHasNextPage(Boolean(nextPageCursor));
           if (fieldKeys.length > 0) {
             setLastRequestedFieldKeys(fieldKeys);
@@ -216,11 +210,12 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
             currentLoadedItemCount = (responseItems === null || responseItems === void 0 ? void 0 : responseItems.length) || 0;
             newlyLoadedItemCount = (items === null || items === void 0 ? void 0 : items.length) || 0;
             fireEvent('track.nextItem.loaded', {
-              extensionKey: _extensionKey2,
-              destinationObjectTypes: _destinationObjectTypes2,
+              extensionKey: _extensionKey,
+              destinationObjectTypes: _destinationObjectTypes,
               loadedItemCount: currentLoadedItemCount + newlyLoadedItemCount
             });
           }
+          setStatus('resolved');
           _context2.next = 40;
           break;
         case 37:

package/dist/esm/ui/assets-modal/modal/index.js

@@ -222,7 +222,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.2.1",
+  packageVersion: "1.2.3",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

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

@@ -40,12 +40,15 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
     fireEvent = _useDatasourceAnalyti.fireEvent;
   var _useRef = useRef(uuidv4()),
     tableRenderInstanceId = _useRef.current;
+  var visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
 
   /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
       But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
       mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
    */
   var isInitialRender = useRef(true);
+  var isDataReady = columns.length > 0 && responseItems.length > 0 && totalCount && totalCount > 0;
+  visibleColumnCount.current = (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0;
   useEffect(function () {
     if (!isInitialRender.current) {
       reset();
@@ -57,6 +60,18 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
+  useEffect(function () {
+    var isTableViewRenderedWithData = status === 'resolved' && isDataReady;
+    if (isTableViewRenderedWithData) {
+      fireEvent('ui.datasource.renderSuccess', {
+        extensionKey: extensionKey,
+        destinationObjectTypes: destinationObjectTypes,
+        totalItemCount: totalCount,
+        displayedColumnCount: visibleColumnCount.current,
+        display: 'table'
+      });
+    }
+  }, [totalCount, fireEvent, status, extensionKey, destinationObjectTypes, isDataReady]);
   useEffect(function () {
     var shouldStartUfoExperience = datasourceId && parameters && visibleColumnKeys && status === 'loading';
     if (shouldStartUfoExperience) {
@@ -93,7 +108,6 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
       onRefresh: reset
     });
   }
-  var isDataReady = columns.length > 0;
   return (
     // datasource-table classname is to exclude all children from being commentable - exclude list is in CFE
     jsx("div", {

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

@@ -110,6 +110,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   var searchCount = useRef(0);
   var userInteractionActions = useRef(new Set());
   var lastSearchMethodRef = useRef(null);
+  var visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   var parameters = useMemo(function () {
     return !!cloudId ? {
       cloudId: cloudId,
@@ -154,7 +155,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
       }) || availableSites[0];
     }
   }, [availableSites, cloudId]);
-  var buttonClickedAnalyticsPayload = useMemo(function () {
+  var analyticsPayload = useMemo(function () {
     return {
       extensionKey: extensionKey,
       destinationObjectTypes: destinationObjectTypes
@@ -164,6 +165,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   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';
+  var isDataReady = (visibleColumnKeys || []).length > 0;
   useEffect(function () {
     var shouldStartUfoExperience = status === 'loading';
     if (shouldStartUfoExperience) {
@@ -184,6 +186,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   }, [fireEvent]);
   useEffect(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
   useEffect(function () {
@@ -219,32 +222,48 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
     }
   }, [cloudId, selectedJiraSite]);
   var fireSingleItemViewedEvent = useCallback(function () {
-    fireEvent('ui.link.viewed.singleItem', {
-      destinationObjectTypes: destinationObjectTypes,
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current),
-      extensionKey: extensionKey
-    });
-  }, [extensionKey, fireEvent, destinationObjectTypes]);
+    fireEvent('ui.link.viewed.singleItem', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchMethod: mapSearchMethod(lastSearchMethodRef.current)
+    }));
+  }, [analyticsPayload, fireEvent]);
   var fireCountViewedEvent = useCallback(function () {
-    fireEvent('ui.link.viewed.count', {
-      destinationObjectTypes: destinationObjectTypes,
+    fireEvent('ui.link.viewed.count', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
       searchMethod: mapSearchMethod(lastSearchMethodRef.current),
-      extensionKey: extensionKey,
       totalItemCount: totalCount || 0
-    });
-  }, [extensionKey, fireEvent, totalCount, destinationObjectTypes]);
+    }));
+  }, [analyticsPayload, fireEvent, totalCount]);
+  var fireTableViewedEvent = useCallback(function () {
+    if (isDataReady) {
+      fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        displayedColumnCount: visibleColumnCount.current
+      }));
+    }
+  }, [analyticsPayload, fireEvent, totalCount, isDataReady]);
+  var fireIssueViewAnalytics = useCallback(function () {
+    if (!totalCount) {
+      return;
+    }
+    if (totalCount > 1) {
+      fireTableViewedEvent();
+    } else if (totalCount === 1) {
+      fireSingleItemViewedEvent();
+    }
+  }, [fireSingleItemViewedEvent, fireTableViewedEvent, totalCount]);
   useEffect(function () {
     var isResolved = status === 'resolved';
-    var isSingleItemViewed = currentViewMode === 'issue' && totalCount === 1;
-    var isCountViewed = currentViewMode === 'count';
-    if (isResolved) {
-      if (isSingleItemViewed) {
-        fireSingleItemViewedEvent();
-      } else if (isCountViewed && totalCount) {
-        fireCountViewedEvent();
-      }
+    var isIssueViewMode = currentViewMode === 'issue';
+    var isCountViewMode = currentViewMode === 'count';
+    if (!isResolved) {
+      return;
+    }
+    if (isIssueViewMode) {
+      fireIssueViewAnalytics();
+    } else if (isCountViewMode) {
+      fireCountViewedEvent();
     }
-  }, [currentViewMode, totalCount, status, fireSingleItemViewedEvent, fireCountViewedEvent]);
+  }, [currentViewMode, status, fireIssueViewAnalytics, fireCountViewedEvent]);
   var onSearch = useCallback(function (newParameters, searchMethod) {
     searchCount.current++;
     lastSearchMethodRef.current = searchMethod;
@@ -260,13 +279,13 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
     analyticEvent.update({
       eventType: 'ui',
       actionSubjectId: 'cancel',
-      attributes: _objectSpread(_objectSpread({}, buttonClickedAnalyticsPayload), {}, {
-        actions: Array.from(userInteractionActions.current),
-        searchCount: searchCount.current
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        searchCount: searchCount.current,
+        actions: Array.from(userInteractionActions.current)
       })
     }).fire(EVENT_CHANNEL);
     onCancel();
-  }, [buttonClickedAnalyticsPayload, onCancel]);
+  }, [analyticsPayload, onCancel]);
   var onSiteSelection = useCallback(function (site) {
     userInteractionActions.current.add(DatasourceAction.INSTANCE_UPDATED);
     setCloudId(site.cloudId);
@@ -288,13 +307,13 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
     }
     var insertButtonClickedEvent = analyticsEvent.update({
       actionSubjectId: 'insert',
-      attributes: _objectSpread(_objectSpread({}, buttonClickedAnalyticsPayload), {}, {
-        actions: Array.from(userInteractionActions.current),
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
         totalItemCount: totalCount || 0,
-        displayedColumnCount: (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0,
+        displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current)
+        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        actions: Array.from(userInteractionActions.current)
       }),
       eventType: 'ui'
     });
@@ -341,7 +360,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
         }
       }, consumerEvent);
     }
-  }, [isParametersSet, jql, selectedJiraSite, buttonClickedAnalyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
+  }, [isParametersSet, jql, selectedJiraSite, analyticsPayload, totalCount, visibleColumnKeys, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, jqlUrl, datasourceId, cloudId]);
   var handleViewModeChange = function handleViewModeChange(selectedMode) {
     userInteractionActions.current.add(DatasourceAction.DISPLAY_VIEW_CHANGED);
     setCurrentViewMode(selectedMode);
@@ -354,6 +373,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
     var newVisibleColumnKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     var columnAction = getColumnAction(visibleColumnKeys || [], newVisibleColumnKeys);
     userInteractionActions.current.add(columnAction);
+    visibleColumnCount.current = newVisibleColumnKeys.length;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [visibleColumnKeys]);
   var issueLikeDataTableView = useMemo(function () {

package/dist/types/analytics/generated/analytics.types.d.ts

@@ -3,7 +3,7 @@
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::bbcd049ca0675b0360080a987c26f6e9>>
+ * @codegen <<SignedSource::0262ba66242472aeffce99eacc538f23>>
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
  */
 export type PackageMetaDataType = {
@@ -50,24 +50,24 @@ export type LinkClickedSingleItemAttributesType = {
     extensionKey: string | null;
     destinationObjectTypes: unknown[];
 };
-export type DatasourceRenderedAttributesType = {
+export type DatasourceRenderSuccessAttributesType = {
     totalItemCount: number;
     destinationObjectTypes: unknown[];
     displayedColumnCount: number | null;
     extensionKey: string | null;
-    display: 'datasource_inline' | 'datasource_table' | 'inline';
-    status: 'resolved' | 'unauthorized' | 'forbidden' | 'not_found' | 'errored';
+    display: 'table';
 };
 export type NextItemLoadedAttributesType = {
     destinationObjectTypes: unknown[];
     extensionKey: string | null;
     loadedItemCount: number;
 };
-export type TableViewedDatasourceAttributesType = {
+export type TableViewedDatasourceConfigModalAttributesType = {
     destinationObjectTypes: unknown[];
     totalItemCount: number;
     displayedColumnCount: number | null;
     searchMethod: 'datasource_search_query' | 'datasource_basic_filter' | 'datasource_saved_filter' | null;
+    extensionKey: string | null;
 };
 export type LinkViewedSingleItemAttributesType = {
     destinationObjectTypes: unknown[];
@@ -113,13 +113,13 @@ export type AnalyticsEventAttributes = {
     'ui.link.clicked.singleItem': LinkClickedSingleItemAttributesType;
     /**
      * Fired when an inserted datasource resolves / renders. */
-    'ui.datasource.rendered': DatasourceRenderedAttributesType;
+    'ui.datasource.renderSuccess': DatasourceRenderSuccessAttributesType;
     /**
      * Fired when user scrolls to the next page/list of the objects */
     'track.nextItem.loaded': NextItemLoadedAttributesType;
     /**
-     * Fired when the datasource results are displayed as table */
-    'ui.table.viewed.datasource': TableViewedDatasourceAttributesType;
+     * Fired when the datasource results are displayed as table inside of datasource configuration modal */
+    'ui.table.viewed.datasourceConfigModal': TableViewedDatasourceConfigModalAttributesType;
     /**
      * Fired when the datasource results are displayed as link(may be smart-link) for a single item */
     'ui.link.viewed.singleItem': LinkViewedSingleItemAttributesType;

package/dist/types-ts4.5/analytics/generated/analytics.types.d.ts

@@ -3,7 +3,7 @@
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::bbcd049ca0675b0360080a987c26f6e9>>
+ * @codegen <<SignedSource::0262ba66242472aeffce99eacc538f23>>
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
  */
 export type PackageMetaDataType = {
@@ -50,24 +50,24 @@ export type LinkClickedSingleItemAttributesType = {
     extensionKey: string | null;
     destinationObjectTypes: unknown[];
 };
-export type DatasourceRenderedAttributesType = {
+export type DatasourceRenderSuccessAttributesType = {
     totalItemCount: number;
     destinationObjectTypes: unknown[];
     displayedColumnCount: number | null;
     extensionKey: string | null;
-    display: 'datasource_inline' | 'datasource_table' | 'inline';
-    status: 'resolved' | 'unauthorized' | 'forbidden' | 'not_found' | 'errored';
+    display: 'table';
 };
 export type NextItemLoadedAttributesType = {
     destinationObjectTypes: unknown[];
     extensionKey: string | null;
     loadedItemCount: number;
 };
-export type TableViewedDatasourceAttributesType = {
+export type TableViewedDatasourceConfigModalAttributesType = {
     destinationObjectTypes: unknown[];
     totalItemCount: number;
     displayedColumnCount: number | null;
     searchMethod: 'datasource_search_query' | 'datasource_basic_filter' | 'datasource_saved_filter' | null;
+    extensionKey: string | null;
 };
 export type LinkViewedSingleItemAttributesType = {
     destinationObjectTypes: unknown[];
@@ -113,13 +113,13 @@ export type AnalyticsEventAttributes = {
     'ui.link.clicked.singleItem': LinkClickedSingleItemAttributesType;
     /**
      * Fired when an inserted datasource resolves / renders. */
-    'ui.datasource.rendered': DatasourceRenderedAttributesType;
+    'ui.datasource.renderSuccess': DatasourceRenderSuccessAttributesType;
     /**
      * Fired when user scrolls to the next page/list of the objects */
     'track.nextItem.loaded': NextItemLoadedAttributesType;
     /**
-     * Fired when the datasource results are displayed as table */
-    'ui.table.viewed.datasource': TableViewedDatasourceAttributesType;
+     * Fired when the datasource results are displayed as table inside of datasource configuration modal */
+    'ui.table.viewed.datasourceConfigModal': TableViewedDatasourceConfigModalAttributesType;
     /**
      * Fired when the datasource results are displayed as link(may be smart-link) for a single item */
     'ui.link.viewed.singleItem': LinkViewedSingleItemAttributesType;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -44,7 +44,7 @@
     "@atlaskit/image": "^1.1.0",
     "@atlaskit/jql-editor-autocomplete-rest": "^2.0.0",
     "@atlaskit/link-client-extension": "^1.7.0",
-    "@atlaskit/linking-common": "^4.9.0",
+    "@atlaskit/linking-common": "^4.10.0",
     "@atlaskit/linking-types": "^8.3.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/modal-dialog": "^12.6.0",
@@ -53,12 +53,12 @@
     "@atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-autoscroll": "^0.6.0",
     "@atlaskit/pragmatic-drag-and-drop-react-indicator": "^0.16.0",
     "@atlaskit/select": "^16.7.0",
-    "@atlaskit/smart-card": "^26.26.0",
+    "@atlaskit/smart-card": "^26.27.0",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/tag": "^11.6.0",
     "@atlaskit/textfield": "5.6.7",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.22.0",
+    "@atlaskit/tokens": "^1.24.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@atlaskit/ufo": "^0.2.4",
     "@atlassianlabs/jql-editor": "^2.0.1",