@atlaskit/editor-plugin-card/dist/es2019/ui/DatasourceDropdownOption.js

Card plugin for @atlaskit/editor-core

import React from 'react';
import { cardMessages as messages } from '@atlaskit/editor-common/messages';
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
import SmartLinkListIcon from '@atlaskit/icon/core/smart-link-list';
import { buildDatasourceAdf } from '@atlaskit/link-datasource';
import { useSmartLinkContext } from '@atlaskit/link-provider';
import { ButtonItem } from '@atlaskit/menu';
import { updateCardViaDatasource } from '../pm-plugins/doc';
import { pluginKey } from '../pm-plugins/plugin-key';
import { useFetchDatasourceInfo } from './useFetchDatasourceInfo';
export const datasourceDisplayInformation = {
  title: messages.datasourceAppearanceTitle,
  icon: SmartLinkListIcon,
  // eslint-disable-next-line @atlaskit/editor/no-re-export
  iconFallback: SmartLinkListIcon
};
export const DatasourceDropdownOption = ({
  allowDatasource,
  intl,
  url,
  selected,
  inputMethod,
  dispatchCommand
}) => {
  const cardContext = useSmartLinkContext();
  const {
    datasourceId,
    parameters
  } = useFetchDatasourceInfo({
    isRegularCardNode: true,
    url,
    cardContext
  });
  if (!allowDatasource || !datasourceId || !parameters) {
    return null;
  }
  const onChangeAppearance = (editorState, _dispatch, view) => {
    var _state$datasourceStas, _state$datasourceStas2;
    if (!view || !datasourceId || !parameters) {
      return false;
    }
    const state = pluginKey.getState(editorState);
    const newAdf = buildDatasourceAdf({
      id: datasourceId,
      parameters,
      views: (_state$datasourceStas = state === null || state === void 0 ? 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);
    const {
      selection
    } = editorState;
    let existingNode;
    // Check if the selection contains a link mark
    const $pos = editorState.doc.resolve(selection.from);
    const isLinkMark = $pos.marks().some(mark => mark.type === editorState.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 _editorState$doc$node;
      existingNode = (_editorState$doc$node = editorState.doc.nodeAt(selection.from)) !== null && _editorState$doc$node !== void 0 ? _editorState$doc$node : undefined;
    }
    if (existingNode) {
      updateCardViaDatasource({
        state: editorState,
        node: existingNode,
        newAdf,
        view,
        sourceEvent: undefined,
        isDeletingConfig: true,
        inputMethod
      });
      return true;
    }
    return false;
  };
  if (url) {
    var _cardContext$store, _urlState$error;
    const 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;
    }
  }
  return /*#__PURE__*/React.createElement(ButtonItem, {
    key: intl.formatMessage(messages.datasourceAppearanceTitle),
    iconBefore: SmartLinkListIcon({
      label: intl.formatMessage(messages.datasourceAppearanceTitle)
    })
    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
    ,
    onClick: () => dispatchCommand(onChangeAppearance),
    isSelected: selected
  }, intl.formatMessage(messages.datasourceAppearanceTitle));
};