@atlaskit/editor-plugin-card/dist/esm/ui/DatasourceModal/index.js

Card plugin for @atlaskit/editor-core

import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import React, { useCallback } from 'react';
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
import { hideDatasourceModal } from '../../pm-plugins/actions';
import { insertDatasource, updateCardViaDatasource } from '../../pm-plugins/doc';
import { useFetchDatasourceInfo } from '../useFetchDatasourceInfo';
export var DatasourceModal = function DatasourceModal(_ref) {
  var _existingNode$attrs, _existingNode$attrs2;
  var view = _ref.view,
    cardContext = _ref.cardContext,
    defaultDatasourceId = _ref.datasourceId,
    Component = _ref.componentType;
  var state = view.state;
  var existingNode = getExistingNode(state);
  var dispatch = view.dispatch,
    transaction = view.state.tr;
  var onClose = useCallback(function () {
    dispatch(hideDatasourceModal(transaction));
  }, [dispatch, transaction]);
  var updateAdf = useUpdateAdf(view, existingNode);
  var isRegularCardNode = !!(existingNode && !(existingNode !== null && existingNode !== void 0 && (_existingNode$attrs = existingNode.attrs) !== null && _existingNode$attrs !== void 0 && _existingNode$attrs.datasource));
  var _ref2 = (existingNode === null || existingNode === void 0 || (_existingNode$attrs2 = existingNode.attrs) === null || _existingNode$attrs2 === void 0 ? void 0 : _existingNode$attrs2.datasource) || {},
    _ref2$id = _ref2.id,
    datasourceId = _ref2$id === void 0 ? defaultDatasourceId : _ref2$id,
    _ref2$views = _ref2.views,
    views = _ref2$views === void 0 ? [] : _ref2$views,
    nodeParameters = _ref2.parameters;
  var _resolveColumnsConfig = resolveColumnsConfig(views),
    visibleColumnKeys = _resolveColumnsConfig.visibleColumnKeys,
    wrappedColumnKeys = _resolveColumnsConfig.wrappedColumnKeys,
    columnCustomSizes = _resolveColumnsConfig.columnCustomSizes;
  var _useFetchDatasourceIn = useFetchDatasourceInfo({
      isRegularCardNode: isRegularCardNode,
      url: existingNode === null || existingNode === void 0 ? void 0 : existingNode.attrs.url,
      cardContext: cardContext,
      nodeParameters: nodeParameters
    }),
    parameters = _useFetchDatasourceIn.parameters,
    ready = _useFetchDatasourceIn.ready;
  if (!ready) {
    return null;
  }
  return /*#__PURE__*/React.createElement(Component, {
    datasourceId: datasourceId,
    viewMode: isRegularCardNode ? 'inline' : 'table' // Want non-datasource cards to open in inline view since they are in table view
    ,
    parameters: parameters,
    url: existingNode === null || existingNode === void 0 ? void 0 : existingNode.attrs.url,
    visibleColumnKeys: visibleColumnKeys,
    columnCustomSizes: columnCustomSizes,
    wrappedColumnKeys: wrappedColumnKeys,
    onCancel: onClose,
    onInsert: updateAdf
  });
};
var useUpdateAdf = function useUpdateAdf(view, existingNode) {
  return useCallback(function (newAdf, analyticEvent) {
    if (analyticEvent) {
      analyticEvent.update(function (payload) {
        return _objectSpread(_objectSpread({}, payload), {}, {
          attributes: _objectSpread(_objectSpread({}, payload.attributes), {}, {
            inputMethod: 'datasource_config'
          })
        });
      });
    }
    if (existingNode) {
      updateCardViaDatasource({
        state: view.state,
        node: existingNode,
        newAdf: newAdf,
        view: view,
        sourceEvent: analyticEvent
      });
    } else {
      insertDatasource(view.state, newAdf, view, analyticEvent);
    }
  }, [existingNode, view]);
};
var getExistingNode = function getExistingNode(state) {
  var selection = state.selection;
  var existingNode;
  // Check if the selection contains a link mark
  var isLinkMark = state.doc.resolve(selection.from).marks().some(function (mark) {
    return mark.type === state.schema.marks.link;
  });

  // When selection is a TextNode and a link Mark is present return that node
  if (selection instanceof NodeSelection) {
    existingNode = selection.node;
  } else if (isLinkMark) {
    var _state$doc$nodeAt;
    existingNode = (_state$doc$nodeAt = state.doc.nodeAt(selection.from)) !== null && _state$doc$nodeAt !== void 0 ? _state$doc$nodeAt : undefined;
  }
  return existingNode;
};
var resolveColumnsConfig = function resolveColumnsConfig(views) {
  var _tableView$properties;
  var _views = _slicedToArray(views, 1),
    tableView = _views[0];
  var visibleColumnKeys = [];
  var wrappedColumnKeys = [];
  var columnCustomSizes = {};
  var columns = tableView === null || tableView === void 0 || (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns;
  if (columns) {
    var _iterator = _createForOfIteratorHelper(columns),
      _step;
    try {
      for (_iterator.s(); !(_step = _iterator.n()).done;) {
        var _step$value = _step.value,
          key = _step$value.key,
          width = _step$value.width,
          isWrapped = _step$value.isWrapped;
        visibleColumnKeys.push(key);
        if (width) {
          columnCustomSizes[key] = width;
        }
        if (isWrapped) {
          wrappedColumnKeys.push(key);
        }
      }
    } catch (err) {
      _iterator.e(err);
    } finally {
      _iterator.f();
    }
  }
  return {
    visibleColumnKeys: visibleColumnKeys,
    wrappedColumnKeys: wrappedColumnKeys,
    columnCustomSizes: columnCustomSizes
  };
};