@atlaskit/editor-plugin-card/dist/cjs/ui/DatasourceAppearanceButton.js

Card plugin for @atlaskit/editor-core

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DatasourceAppearanceButton = void 0;
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 _state = require("@atlaskit/editor-prosemirror/state");
var _linkDatasource = require("@atlaskit/link-datasource");
var _linkProvider = require("@atlaskit/link-provider");
var _compiled = require("@atlaskit/primitives/compiled");
var _doc = require("../pm-plugins/doc");
var _pluginKey = require("../pm-plugins/plugin-key");
var _DatasourceIcon = require("./DatasourceIcon");
var _useFetchDatasourceInfo = require("./useFetchDatasourceInfo");
/**
 * @jsxRuntime classic
 * @jsx jsx
 */

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports

var buttonStyles = (0, _react2.css)({
  pointerEvents: 'auto'
});
var DatasourceAppearanceButtonWithCardContext = function DatasourceAppearanceButtonWithCardContext(_ref) {
  var cardContext = _ref.cardContext,
    intl = _ref.intl,
    url = _ref.url,
    editorView = _ref.editorView,
    editorState = _ref.editorState,
    selected = _ref.selected,
    inputMethod = _ref.inputMethod,
    areAnyNewToolbarFlagsEnabled = _ref.areAnyNewToolbarFlagsEnabled;
  var _useFetchDatasourceIn = (0, _useFetchDatasourceInfo.useFetchDatasourceInfo)({
      isRegularCardNode: true,
      url: url,
      cardContext: cardContext
    }),
    datasourceId = _useFetchDatasourceIn.datasourceId,
    parameters = _useFetchDatasourceIn.parameters;
  var onChangeAppearance = (0, _react.useCallback)(function () {
    var _state$datasourceStas, _state$datasourceStas2;
    if (!editorView || !datasourceId || !parameters) {
      return;
    }
    var state = _pluginKey.pluginKey.getState(editorState);
    var newAdf = (0, _linkDatasource.buildDatasourceAdf)({
      id: datasourceId,
      parameters: parameters,
      views: (_state$datasourceStas = state === null || state === void 0 || (_state$datasourceStas2 = state.datasourceStash[url]) === null || _state$datasourceStas2 === void 0 ? void 0 : _state$datasourceStas2.views) !== null && _state$datasourceStas !== void 0 ? _state$datasourceStas : [{
        type: 'table'
      }]
    }, url);
    var selection = editorState.selection;
    var existingNode;
    // Check if the selection contains a link mark
    var $pos = editorState.doc.resolve(selection.from);
    var isLinkMark = $pos.marks().some(function (mark) {
      return mark.type === editorState.schema.marks.link;
    });

    // When selection is a TextNode and a link Mark is present return that node
    if (selection instanceof _state.NodeSelection) {
      existingNode = selection.node;
    } else if (isLinkMark) {
      var _editorState$doc$node;
      existingNode = (_editorState$doc$node = editorState.doc.nodeAt(selection.from)) !== null && _editorState$doc$node !== void 0 ? _editorState$doc$node : undefined;
    }
    if (existingNode) {
      (0, _doc.updateCardViaDatasource)({
        state: editorState,
        node: existingNode,
        newAdf: newAdf,
        view: editorView,
        sourceEvent: undefined,
        isDeletingConfig: true,
        inputMethod: inputMethod
      });
    }
  }, [parameters, datasourceId, inputMethod, editorState, editorView, url]);
  if (!parameters || !datasourceId || !(0, _utils.canRenderDatasource)(datasourceId)) {
    return null;
  }
  if (url) {
    var _cardContext$store, _urlState$error;
    var urlState = cardContext === null || cardContext === void 0 || (_cardContext$store = cardContext.store) === null || _cardContext$store === void 0 ? void 0 : _cardContext$store.getState()[url];
    if ((urlState === null || urlState === void 0 || (_urlState$error = urlState.error) === null || _urlState$error === void 0 ? void 0 : _urlState$error.kind) === 'fatal') {
      return null;
    }
  }
  var buttonLabel = intl.formatMessage(_messages.cardMessages.datasourceAppearanceTitle);
  return (0, _react2.jsx)(_compiled.Flex, null, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
    css: buttonStyles,
    title: buttonLabel,
    icon: (0, _react2.jsx)(_DatasourceIcon.DatasourceIcon, {
      label: buttonLabel
    }),
    selected: selected,
    onClick: onChangeAppearance,
    testId: 'card-datasource-appearance-button',
    areAnyNewToolbarFlagsEnabled: areAnyNewToolbarFlagsEnabled
  }));
};
var DatasourceAppearanceButton = exports.DatasourceAppearanceButton = function DatasourceAppearanceButton(_ref2) {
  var intl = _ref2.intl,
    editorAnalyticsApi = _ref2.editorAnalyticsApi,
    url = _ref2.url,
    editorView = _ref2.editorView,
    editorState = _ref2.editorState,
    selected = _ref2.selected,
    inputMethod = _ref2.inputMethod,
    areAnyNewToolbarFlagsEnabled = _ref2.areAnyNewToolbarFlagsEnabled;
  var cardContext = (0, _linkProvider.useSmartLinkContext)();
  return (0, _react2.jsx)(DatasourceAppearanceButtonWithCardContext, {
    url: url,
    intl: intl,
    editorAnalyticsApi: editorAnalyticsApi,
    editorView: editorView,
    editorState: editorState,
    cardContext: cardContext,
    selected: selected,
    inputMethod: inputMethod,
    areAnyNewToolbarFlagsEnabled: areAnyNewToolbarFlagsEnabled
  });
};