@atlaskit/editor-plugin-card 0.5.11 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-plugin-card
 
+## 0.7.0
+
+### Minor Changes
+
+- [`50b3bf73ed3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/50b3bf73ed3) - [ux] Add edit datasource button to toolbar for cards which can resolve into datasources
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.6.0
+
+### Minor Changes
+
+- [`8b8a309cb62`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8b8a309cb62) - Added datasource analytic CRUD events
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 0.5.11
 
 ### Patch Changes

package/dist/cjs/analytics/events-from-tr.js

@@ -140,6 +140,7 @@ var findChanged = function findChanged(tr, state) {
   if (!isUpdate) {
     var _getLinkMetadataFromT = (0, _card.getLinkMetadataFromTransaction)(tr),
       inputMethod = _getLinkMetadataFromT.inputMethod;
+
     /**
      * If there is no identifiable input method, and the links inserted and removed appear to be the same,
      * then this transaction likely is not intended to be consided to be the insertion and removal of links

package/dist/cjs/nodeviews/blockCard.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.BlockCardComponent = exports.BlockCard = void 0;
+var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
@@ -144,6 +145,25 @@ var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
       }
       return domRef;
     }
+
+    // Need this function to check if the datasource attribute was added or not to a blockCard.
+    // If so, we return false so we can get the node to re-render properly as a datasource node instead.
+    // Otherwise, the node view will still consider the node as a blockCard and render a regular blockCard.
+  }, {
+    key: "validUpdate",
+    value: function validUpdate(currentNode, newNode) {
+      var _currentNode$attrs, _newNode$attrs;
+      var isCurrentNodeBlockCard = !((_currentNode$attrs = currentNode.attrs) !== null && _currentNode$attrs !== void 0 && _currentNode$attrs.datasource);
+      var isNewNodeDatasource = (_newNode$attrs = newNode.attrs) === null || _newNode$attrs === void 0 ? void 0 : _newNode$attrs.datasource;
+
+      // need to return falsy to update node
+      return !(isCurrentNodeBlockCard && isNewNodeDatasource);
+    }
+  }, {
+    key: "update",
+    value: function update(node, decorations, _innerDecorations) {
+      return (0, _get2.default)((0, _getPrototypeOf2.default)(BlockCard.prototype), "update", this).call(this, node, decorations, _innerDecorations, this.validUpdate);
+    }
   }, {
     key: "render",
     value: function render() {

package/dist/cjs/pm-plugins/doc.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.updateExistingDatasource = exports.updateCard = exports.setSelectedCardAppearance = exports.replaceQueuedUrlWithCard = exports.queueCardsFromChangedTr = exports.queueCardFromChangedTr = exports.insertDatasource = exports.handleFallbackWithAnalytics = exports.getLinkNodeType = exports.convertHyperlinkToSmartCard = exports.changeSelectedCardToText = exports.changeSelectedCardToLinkFallback = exports.changeSelectedCardToLink = void 0;
+exports.updateCardFromDatasourceModal = exports.updateCard = exports.setSelectedCardAppearance = exports.replaceQueuedUrlWithCard = exports.queueCardsFromChangedTr = exports.queueCardFromChangedTr = exports.insertDatasource = exports.handleFallbackWithAnalytics = exports.getLinkNodeType = exports.convertHyperlinkToSmartCard = exports.changeSelectedCardToText = exports.changeSelectedCardToLinkFallback = exports.changeSelectedCardToLink = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
@@ -428,45 +428,55 @@ var getLinkNodeType = function getLinkNodeType(appearance, linkNodes) {
   }
 };
 
-// Apply an update to a datasource (aka blockCard) node
+// Apply an update made from the datasource edit modal to a card
 exports.getLinkNodeType = getLinkNodeType;
-var updateExistingDatasource = function updateExistingDatasource(state, node, newAdf, view) {
+var updateCardFromDatasourceModal = function updateCardFromDatasourceModal(state, node, newAdf, view, sourceEvent) {
   var tr = state.tr,
     from = state.selection.from,
     schemaNodes = state.schema.nodes;
-
-  // datasource to datasource
-  if (newAdf.type === 'blockCard' && newAdf.attrs.datasource && node.attrs.datasource) {
-    var _ref3, _ref6, _newViews$properties, _oldViews$properties, _newAdf$attrs, _node$attrs;
-    var _ref = (_ref3 = newAdf.attrs.datasource.views) !== null && _ref3 !== void 0 ? _ref3 : [],
-      _ref2 = (0, _slicedToArray2.default)(_ref, 1),
-      newViews = _ref2[0];
-    var _ref4 = (_ref6 = node.attrs.datasource.views) !== null && _ref6 !== void 0 ? _ref6 : [],
-      _ref5 = (0, _slicedToArray2.default)(_ref4, 1),
-      oldViews = _ref5[0];
-    var newColumnKeys = newViews === null || newViews === void 0 ? void 0 : (_newViews$properties = newViews.properties) === null || _newViews$properties === void 0 ? void 0 : _newViews$properties.columns.map(function (column) {
-      return column.key;
-    });
-    var oldColumnKeys = oldViews === null || oldViews === void 0 ? void 0 : (_oldViews$properties = oldViews.properties) === null || _oldViews$properties === void 0 ? void 0 : _oldViews$properties.columns.map(function (column) {
-      return column.key;
-    });
-    var isColumnChange = !(0, _isEqual.default)(oldColumnKeys, newColumnKeys);
-    var isUrlChange = ((_newAdf$attrs = newAdf.attrs) === null || _newAdf$attrs === void 0 ? void 0 : _newAdf$attrs.url) !== ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.url);
-    if (isColumnChange || isUrlChange) {
-      tr.setNodeMarkup(from, schemaNodes.blockCard, _objectSpread(_objectSpread({}, node.attrs), newAdf.attrs));
-      (0, _card.addLinkMetadata)(state.selection, tr, {
-        action: _analytics.ACTION.UPDATED
+  if (newAdf.type === 'blockCard') {
+    var _node$attrs, _newAdf$attrs;
+    if ((_node$attrs = node.attrs) !== null && _node$attrs !== void 0 && _node$attrs.datasource && (_newAdf$attrs = newAdf.attrs) !== null && _newAdf$attrs !== void 0 && _newAdf$attrs.datasource) {
+      var _ref3, _ref6, _newViews$properties, _oldViews$properties, _newAdf$attrs2, _node$attrs2;
+      // datasource to datasource
+      var _ref = (_ref3 = newAdf.attrs.datasource.views) !== null && _ref3 !== void 0 ? _ref3 : [],
+        _ref2 = (0, _slicedToArray2.default)(_ref, 1),
+        newViews = _ref2[0];
+      var _ref4 = (_ref6 = node.attrs.datasource.views) !== null && _ref6 !== void 0 ? _ref6 : [],
+        _ref5 = (0, _slicedToArray2.default)(_ref4, 1),
+        oldViews = _ref5[0];
+      var newColumnKeys = newViews === null || newViews === void 0 ? void 0 : (_newViews$properties = newViews.properties) === null || _newViews$properties === void 0 ? void 0 : _newViews$properties.columns.map(function (column) {
+        return column.key;
       });
+      var oldColumnKeys = oldViews === null || oldViews === void 0 ? void 0 : (_oldViews$properties = oldViews.properties) === null || _oldViews$properties === void 0 ? void 0 : _oldViews$properties.columns.map(function (column) {
+        return column.key;
+      });
+      var isColumnChange = !(0, _isEqual.default)(oldColumnKeys, newColumnKeys);
+      var isUrlChange = ((_newAdf$attrs2 = newAdf.attrs) === null || _newAdf$attrs2 === void 0 ? void 0 : _newAdf$attrs2.url) !== ((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.url);
+      if (isColumnChange || isUrlChange) {
+        tr.setNodeMarkup(from, schemaNodes.blockCard, _objectSpread(_objectSpread({}, node.attrs), newAdf.attrs));
+        (0, _card.addLinkMetadata)(state.selection, tr, {
+          action: _analytics.ACTION.UPDATED,
+          sourceEvent: sourceEvent
+        });
+      }
+    } else {
+      // inline or blockCard to datasource
+      tr.setNodeMarkup(from, schemaNodes.blockCard, newAdf.attrs);
     }
   } else if (newAdf.type === 'inlineCard') {
-    // datasource to inline
+    // card type to inlineCard
     tr.setNodeMarkup(from, schemaNodes.inlineCard, newAdf.attrs);
+    (0, _card.addLinkMetadata)(state.selection, tr, {
+      action: _analytics.ACTION.UPDATED,
+      sourceEvent: sourceEvent
+    });
   }
   (0, _actions.hideDatasourceModal)(tr);
   view.dispatch(tr.scrollIntoView());
 };
-exports.updateExistingDatasource = updateExistingDatasource;
-var insertDatasource = function insertDatasource(state, adf, view) {
+exports.updateCardFromDatasourceModal = updateCardFromDatasourceModal;
+var insertDatasource = function insertDatasource(state, adf, view, sourceEvent) {
   var tr = state.tr,
     from = state.selection.from,
     schemaNodes = state.schema.nodes;
@@ -478,6 +488,10 @@ var insertDatasource = function insertDatasource(state, adf, view) {
   // this will allow us to deal with insertions from multiple paths in a more consistent way
   newNode && tr.insert(from, newNode);
   (0, _actions.hideDatasourceModal)(tr);
+  (0, _card.addLinkMetadata)(state.selection, tr, {
+    action: _analytics.ACTION.INSERTED,
+    sourceEvent: sourceEvent
+  });
   view.dispatch(tr.scrollIntoView());
 };
 exports.insertDatasource = insertDatasource;

package/dist/cjs/toolbar.js

@@ -14,6 +14,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _card = require("@atlaskit/editor-common/card");
 var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
 var _styles = require("@atlaskit/editor-common/styles");
+var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("@atlaskit/editor-common/utils");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
@@ -24,9 +25,9 @@ var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"))
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _doc = require("./pm-plugins/doc");
 var _main = require("./pm-plugins/main");
+var _EditDatasourceButton = require("./ui/EditDatasourceButton");
 var _EditLinkToolbar = require("./ui/EditLinkToolbar");
 var _LinkToolbarAppearance = require("./ui/LinkToolbarAppearance");
-var _SmallerEditIcon = require("./ui/SmallerEditIcon");
 var _ToolbarViewedEvent = require("./ui/ToolbarViewedEvent");
 var _utils3 = require("./utils");
 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); }
@@ -231,7 +232,7 @@ var generateToolbarItems = function generateToolbarItems(state, featureFlags, in
         pluginInjectionApi: pluginInjectionApi
       })];
     } else if (shouldRenderDatasourceToolbar) {
-      return getDatasourceButtonGroup(state, metadata, intl, editorAnalyticsApi, node, hoverDecoration);
+      return getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, node.attrs.datasource.id);
     } else {
       var inlineCard = state.schema.nodes.inlineCard;
       var toolbarItems = [{
@@ -288,7 +289,8 @@ var generateToolbarItems = function generateToolbarItems(state, featureFlags, in
         toolbarItems.unshift.apply(toolbarItems, (0, _toConsumableArray2.default)(alignmentOptions));
       }
       var allowBlockCards = cardOptions.allowBlockCards,
-        allowEmbeds = cardOptions.allowEmbeds;
+        allowEmbeds = cardOptions.allowEmbeds,
+        allowDatasource = cardOptions.allowDatasource;
 
       // This code will be executed only for appearances such as "inline", "block" & "embed"
       // For url appearance, please see HyperlinkToolbarAppearanceProps
@@ -315,6 +317,22 @@ var generateToolbarItems = function generateToolbarItems(state, featureFlags, in
           type: 'separator'
         }]));
       }
+      var shouldShowDatasourceEditButton = platform !== 'mobile' && allowDatasource;
+      if (shouldShowDatasourceEditButton) {
+        toolbarItems.unshift({
+          type: 'custom',
+          fallback: [],
+          render: function render(editorView) {
+            return /*#__PURE__*/_react.default.createElement(_EditDatasourceButton.EditDatasourceButton, {
+              intl: intl,
+              editorAnalyticsApi: editorAnalyticsApi,
+              url: url,
+              editorView: editorView,
+              editorState: state
+            });
+          }
+        });
+      }
       return toolbarItems;
     }
   };
@@ -343,16 +361,16 @@ var getSettingsButtonGroup = function getSettingsButtonGroup(state, featureFlags
     type: 'separator'
   }] : [];
 };
-var getDatasourceButtonGroup = function getDatasourceButtonGroup(state, metadata, intl, editorAnalyticsApi, node, hoverDecoration) {
+var getDatasourceButtonGroup = function getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, datasourceId) {
   var _node$attrs3;
   var toolbarItems = [{
     id: 'editor.edit.datasource',
     type: 'button',
-    icon: _SmallerEditIcon.SmallerEditIcon,
+    icon: _ui.SmallerEditIcon,
     metadata: metadata,
     className: 'datasource-edit',
     title: intl.formatMessage(_messages.linkToolbarMessages.editDatasource),
-    onClick: (0, _EditLinkToolbar.editDatasource)(node, editorAnalyticsApi),
+    onClick: (0, _EditDatasourceButton.editDatasource)(datasourceId, editorAnalyticsApi),
     testId: 'datasource-edit-button'
   }];
   if (node !== null && node !== void 0 && (_node$attrs3 = node.attrs) !== null && _node$attrs3 !== void 0 && _node$attrs3.url) {

package/dist/cjs/ui/DatasourceModal/index.js

@@ -26,7 +26,7 @@ var DatasourceModal = function DatasourceModal(_ref) {
   }, [dispatch, state.tr]);
   var onInsert = (0, _react.useCallback)(function (newAdf) {
     if (existingNode) {
-      (0, _doc.updateExistingDatasource)(state, existingNode, newAdf, view);
+      (0, _doc.updateCardFromDatasourceModal)(state, existingNode, newAdf, view);
     } else {
       (0, _doc.insertDatasource)(state, newAdf, view);
     }

package/dist/cjs/ui/EditDatasourceButton.js

@@ -0,0 +1,144 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.editDatasource = exports.EditDatasourceButton = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+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 _messages = require("@atlaskit/editor-common/messages");
+var _ui = require("@atlaskit/editor-common/ui");
+var _utils = require("@atlaskit/editor-common/utils");
+var _actions = require("../pm-plugins/actions");
+var _CardContextProvider = require("./CardContextProvider");
+/** @jsx jsx */
+
+var buttonStyles = (0, _react2.css)({
+  pointerEvents: 'auto'
+});
+var buttonWrapperStyles = (0, _react2.css)({
+  display: 'flex'
+});
+var EditDatasourceButtonWithCardContext = function EditDatasourceButtonWithCardContext(_ref) {
+  var cardContext = _ref.cardContext,
+    intl = _ref.intl,
+    editorAnalyticsApi = _ref.editorAnalyticsApi,
+    url = _ref.url,
+    editorView = _ref.editorView,
+    editorState = _ref.editorState;
+  var _useState = (0, _react.useState)(null),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    datasourceId = _useState2[0],
+    setDatasourceId = _useState2[1];
+  (0, _react.useEffect)(function () {
+    var fetchDatasource = /*#__PURE__*/function () {
+      var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+        var _cardContext$connecti, _cardContext$connecti2, _datasources$, response, datasources;
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.t0 = url && cardContext;
+              if (!_context.t0) {
+                _context.next = 6;
+                break;
+              }
+              _context.next = 5;
+              return cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$connecti = cardContext.connections) === null || _cardContext$connecti === void 0 ? void 0 : (_cardContext$connecti2 = _cardContext$connecti.client) === null || _cardContext$connecti2 === void 0 ? void 0 : _cardContext$connecti2.fetchData(url);
+            case 5:
+              _context.t0 = _context.sent;
+            case 6:
+              response = _context.t0;
+              datasources = response && response.datasources || [];
+              setDatasourceId(((_datasources$ = datasources[0]) === null || _datasources$ === void 0 ? void 0 : _datasources$.id) || null);
+              _context.next = 14;
+              break;
+            case 11:
+              _context.prev = 11;
+              _context.t1 = _context["catch"](0);
+              setDatasourceId(null);
+            case 14:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[0, 11]]);
+      }));
+      return function fetchDatasource() {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    void fetchDatasource();
+  }, [cardContext, url]);
+  if (!datasourceId || !(0, _utils.canRenderDatasource)(datasourceId, false)) {
+    return null;
+  }
+  if (url) {
+    var _cardContext$store, _urlState$error;
+    var urlState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$store = cardContext.store) === null || _cardContext$store === void 0 ? void 0 : _cardContext$store.getState()[url];
+    if ((urlState === null || urlState === void 0 ? void 0 : (_urlState$error = urlState.error) === null || _urlState$error === void 0 ? void 0 : _urlState$error.kind) === 'fatal') {
+      return null;
+    }
+  }
+  var dispatchCommand = function dispatchCommand(fn) {
+    fn && fn(editorState, editorView && editorView.dispatch);
+    if (editorView && !editorView.hasFocus()) {
+      editorView.focus();
+    }
+  };
+  return (0, _react2.jsx)("div", {
+    css: buttonWrapperStyles
+  }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
+    css: buttonStyles,
+    title: intl.formatMessage(_messages.cardMessages.datasourceTitle),
+    icon: (0, _react2.jsx)(_ui.SmallerEditIcon, null),
+    selected: false,
+    onClick: function onClick() {
+      return dispatchCommand(editDatasource(datasourceId, editorAnalyticsApi));
+    },
+    testId: 'card-edit-datasource-button'
+  }), (0, _react2.jsx)(_ui.FloatingToolbarSeparator, null));
+};
+var EditDatasourceButton = function EditDatasourceButton(_ref3) {
+  var intl = _ref3.intl,
+    editorAnalyticsApi = _ref3.editorAnalyticsApi,
+    url = _ref3.url,
+    editorView = _ref3.editorView,
+    editorState = _ref3.editorState;
+  return (0, _react2.jsx)(_CardContextProvider.CardContextProvider, null, function (_ref4) {
+    var cardContext = _ref4.cardContext;
+    return (0, _react2.jsx)(EditDatasourceButtonWithCardContext, {
+      url: url,
+      intl: intl,
+      editorAnalyticsApi: editorAnalyticsApi,
+      editorView: editorView,
+      editorState: editorState,
+      cardContext: cardContext
+    });
+  });
+};
+exports.EditDatasourceButton = EditDatasourceButton;
+var editDatasource = function editDatasource(datasourceId, editorAnalyticsApi) {
+  return function (state, dispatch) {
+    var datasourceType = (0, _utils.getDatasourceType)(datasourceId);
+    if (dispatch && datasourceType) {
+      var tr = state.tr;
+      (0, _actions.showDatasourceModal)(datasourceType)(tr);
+      // editorAnalyticsApi?.attachAnalyticsEvent(
+      //   buildEditLinkPayload(
+      //     type as
+      //       | ACTION_SUBJECT_ID.CARD_INLINE
+      //       | ACTION_SUBJECT_ID.CARD_BLOCK
+      //       | ACTION_SUBJECT_ID.EMBEDS,
+      //   ),
+      // )(tr);
+      dispatch(tr);
+      return true;
+    }
+    return false;
+  };
+};
+exports.editDatasource = editDatasource;

package/dist/cjs/ui/EditLinkToolbar.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.EditLinkToolbar = void 0;
 exports.HyperlinkAddToolbarWithState = HyperlinkAddToolbarWithState;
-exports.editLinkToolbarConfig = exports.editLink = exports.editDatasource = exports.buildEditLinkToolbar = void 0;
+exports.editLinkToolbarConfig = exports.editLink = exports.buildEditLinkToolbar = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
@@ -19,11 +19,10 @@ var _hooks = require("@atlaskit/editor-common/hooks");
 var _link = require("@atlaskit/editor-common/link");
 var _messages = require("@atlaskit/editor-common/messages");
 var _ui = require("@atlaskit/editor-common/ui");
-var _utils = require("@atlaskit/editor-common/utils");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _actions = require("../pm-plugins/actions");
 var _doc = require("../pm-plugins/doc");
-var _utils2 = require("../utils");
+var _utils = require("../utils");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 function HyperlinkAddToolbarWithState(_ref) {
@@ -176,7 +175,7 @@ var buildEditLinkToolbar = function buildEditLinkToolbar(_ref2) {
       if (!view || !providerFactory) {
         return null;
       }
-      var displayInfo = (0, _utils2.displayInfoForCard)(node, (0, _utils2.findCardInfo)(view.state));
+      var displayInfo = (0, _utils.displayInfoForCard)(node, (0, _utils.findCardInfo)(view.state));
       return /*#__PURE__*/_react.default.createElement(EditLinkToolbar, {
         pluginInjectionApi: pluginInjectionApi,
         key: idx,
@@ -219,26 +218,4 @@ var editLinkToolbarConfig = function editLinkToolbarConfig(showLinkingToolbar, l
     forcePlacement: true
   } : {};
 };
-exports.editLinkToolbarConfig = editLinkToolbarConfig;
-var editDatasource = function editDatasource(node, editorAnalyticsApi) {
-  return function (state, dispatch) {
-    var _node$attrs;
-    var modalType = (0, _utils.getDatasourceType)((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.datasource.id);
-    if (dispatch && modalType) {
-      var tr = state.tr;
-      (0, _actions.showDatasourceModal)(modalType)(tr);
-      // editorAnalyticsApi?.attachAnalyticsEvent(
-      //   buildEditLinkPayload(
-      //     type as
-      //       | ACTION_SUBJECT_ID.CARD_INLINE
-      //       | ACTION_SUBJECT_ID.CARD_BLOCK
-      //       | ACTION_SUBJECT_ID.EMBEDS,
-      //   ),
-      // )(tr);
-      dispatch(tr);
-      return true;
-    }
-    return false;
-  };
-};
-exports.editDatasource = editDatasource;
+exports.editLinkToolbarConfig = editLinkToolbarConfig;

package/dist/cjs/ui/EditorLinkingPlatformAnalytics/DatasourceEvents.js

@@ -6,39 +6,161 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DatasourceEventsBinding = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("react");
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _linkAnalytics = require("@atlaskit/link-analytics");
 var _types = require("../../analytics/types");
+var _common = require("./common");
+var _excluded = ["node", "nodeContext"],
+  _excluded2 = ["node", "nodeContext"],
+  _excluded3 = ["node", "nodeContext"];
+function getDatasourceDisplay(datasourceAttrs) {
+  var _datasourceAttrs$data;
+  return (_datasourceAttrs$data = datasourceAttrs.datasource.views[0]) === null || _datasourceAttrs$data === void 0 ? void 0 : _datasourceAttrs$data.type;
+}
+function getDisplayedColumnCount(datasourceAttrs) {
+  var _datasourceAttrs$data2, _datasourceAttrs$data3, _datasourceAttrs$data4, _datasourceAttrs$data5;
+  return (_datasourceAttrs$data2 = (_datasourceAttrs$data3 = datasourceAttrs.datasource.views[0]) === null || _datasourceAttrs$data3 === void 0 ? void 0 : (_datasourceAttrs$data4 = _datasourceAttrs$data3.properties) === null || _datasourceAttrs$data4 === void 0 ? void 0 : (_datasourceAttrs$data5 = _datasourceAttrs$data4.columns) === null || _datasourceAttrs$data5 === void 0 ? void 0 : _datasourceAttrs$data5.length) !== null && _datasourceAttrs$data2 !== void 0 ? _datasourceAttrs$data2 : 0;
+}
+function getSearchMethod(creationMethod, metadata) {
+  if (creationMethod === 'editor_paste' || creationMethod === 'editor_type') {
+    return '';
+  }
+  var sourceEvent = metadata.sourceEvent;
+  if (sourceEvent instanceof _analyticsNext.UIAnalyticsEvent) {
+    var event = sourceEvent;
+    return event.payload.searchMethod;
+  }
+  return 'unknown';
+}
+function getAnalyticAttributesFromNode(datasourceAttrs, metadata) {
+  var url = datasourceAttrs.url,
+    _datasourceAttrs$data6 = datasourceAttrs.datasource,
+    datasourceId = _datasourceAttrs$data6.id,
+    parameters = _datasourceAttrs$data6.parameters;
+  var display = getDatasourceDisplay(datasourceAttrs);
+  var inputMethod = '';
+  var actions = [];
+  if (metadata.inputMethod) {
+    var _getMethod;
+    inputMethod = (_getMethod = (0, _common.getMethod)({
+      inputMethod: metadata.inputMethod
+    })) !== null && _getMethod !== void 0 ? _getMethod : '';
+  } else if (metadata.sourceEvent instanceof _analyticsNext.UIAnalyticsEvent) {
+    inputMethod = metadata.sourceEvent.payload.inputMethod;
+    actions = metadata.sourceEvent.payload.actions;
+  }
+  var displayedColumnCount = getDisplayedColumnCount(datasourceAttrs);
+  var searchMethod = getSearchMethod(inputMethod, metadata);
+  return {
+    actions: actions,
+    inputMethod: inputMethod,
+    datasourceId: datasourceId,
+    display: display,
+    displayedColumnCount: displayedColumnCount,
+    parameters: parameters,
+    searchMethod: searchMethod,
+    url: url
+  };
+}
+
 /**
  * Subscribes to the events occuring in the card
  * plugin and fires analytics events accordingly
  */
 var DatasourceEventsBinding = function DatasourceEventsBinding(_ref) {
   var cardPluginEvents = _ref.cardPluginEvents;
+  var _useDatasourceLifecyc = (0, _linkAnalytics.useDatasourceLifecycleAnalytics)(),
+    datasourceCreated = _useDatasourceLifecyc.datasourceCreated,
+    datasourceUpdated = _useDatasourceLifecyc.datasourceUpdated,
+    datasourceDeleted = _useDatasourceLifecyc.datasourceDeleted;
   var eventHandlers = (0, _react.useMemo)(function () {
-    var _ref2;
-    return _ref2 = {}, (0, _defineProperty2.default)(_ref2, _types.EVENT.CREATED, function (metadata) {
-      // TODO Impl as part of https://product-fabric.atlassian.net/browse/EDM-7072
-      // eslint-disable-next-line no-console
-      console.log('CREATED', metadata.node, metadata.nodeContext);
-    }), (0, _defineProperty2.default)(_ref2, _types.EVENT.UPDATED, function (metadata) {
-      // TODO Impl as part of https://product-fabric.atlassian.net/browse/EDM-7072
-      // eslint-disable-next-line no-console
-      console.log('UPDATED', metadata.node, metadata.nodeContext);
-    }), (0, _defineProperty2.default)(_ref2, _types.EVENT.DELETED, function (metadata) {
-      // TODO Impl as part of https://product-fabric.atlassian.net/browse/EDM-7072
-      // eslint-disable-next-line no-console
-      console.log('DELETED', metadata.node, metadata.nodeContext);
-    }), _ref2;
-  }, []);
+    var _ref5;
+    return _ref5 = {}, (0, _defineProperty2.default)(_ref5, _types.EVENT.CREATED, function (_ref2) {
+      var node = _ref2.node,
+        nodeContext = _ref2.nodeContext,
+        metadata = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+      var attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
+      var actions = attributes.actions,
+        inputMethod = attributes.inputMethod,
+        datasourceId = attributes.datasourceId,
+        display = attributes.display,
+        displayedColumnCount = attributes.displayedColumnCount,
+        parameters = attributes.parameters,
+        searchMethod = attributes.searchMethod,
+        url = attributes.url;
+      datasourceCreated({
+        datasourceId: datasourceId,
+        parameters: parameters,
+        url: url
+      }, null, {
+        actions: actions,
+        creationMethod: inputMethod,
+        display: display,
+        displayedColumnCount: displayedColumnCount,
+        nodeContext: nodeContext,
+        searchMethod: searchMethod
+      });
+    }), (0, _defineProperty2.default)(_ref5, _types.EVENT.UPDATED, function (_ref3) {
+      var node = _ref3.node,
+        nodeContext = _ref3.nodeContext,
+        metadata = (0, _objectWithoutProperties2.default)(_ref3, _excluded2);
+      var attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
+      var actions = attributes.actions,
+        datasourceId = attributes.datasourceId,
+        display = attributes.display,
+        displayedColumnCount = attributes.displayedColumnCount,
+        inputMethod = attributes.inputMethod,
+        parameters = attributes.parameters,
+        searchMethod = attributes.searchMethod,
+        url = attributes.url;
+      datasourceUpdated({
+        datasourceId: datasourceId,
+        parameters: parameters,
+        url: url
+      }, null, {
+        actions: actions,
+        display: display,
+        displayedColumnCount: displayedColumnCount,
+        nodeContext: nodeContext,
+        searchMethod: searchMethod,
+        updateMethod: inputMethod
+      });
+    }), (0, _defineProperty2.default)(_ref5, _types.EVENT.DELETED, function (_ref4) {
+      var node = _ref4.node,
+        nodeContext = _ref4.nodeContext,
+        metadata = (0, _objectWithoutProperties2.default)(_ref4, _excluded3);
+      var attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
+      var datasourceId = attributes.datasourceId,
+        display = attributes.display,
+        displayedColumnCount = attributes.displayedColumnCount,
+        inputMethod = attributes.inputMethod,
+        parameters = attributes.parameters,
+        searchMethod = attributes.searchMethod,
+        url = attributes.url;
+      datasourceDeleted({
+        datasourceId: datasourceId,
+        parameters: parameters,
+        url: url
+      }, null, {
+        deleteMethod: inputMethod,
+        display: display,
+        displayedColumnCount: displayedColumnCount,
+        nodeContext: nodeContext,
+        searchMethod: searchMethod
+      });
+    }), _ref5;
+  }, [datasourceCreated, datasourceUpdated, datasourceDeleted]);
 
   /**
    * Subscribe to datasource events
    */
   (0, _react.useEffect)(function () {
-    var unsubscribe = cardPluginEvents.subscribe(function (_ref3) {
-      var event = _ref3.event,
-        subject = _ref3.subject,
-        data = _ref3.data;
+    var unsubscribe = cardPluginEvents.subscribe(function (_ref6) {
+      var event = _ref6.event,
+        subject = _ref6.subject,
+        data = _ref6.data;
       if (subject === _types.EVENT_SUBJECT.DATASOURCE) {
         eventHandlers[event](data);
       }

package/dist/es2019/analytics/events-from-tr.js

@@ -123,6 +123,7 @@ export const findChanged = (tr, state) => {
     const {
       inputMethod
     } = getLinkMetadataFromTransaction(tr);
+
     /**
      * If there is no identifiable input method, and the links inserted and removed appear to be the same,
      * then this transaction likely is not intended to be consided to be the insertion and removal of links