@atlaskit/editor-plugin-loom/dist/es2019/ui/quick-insert/LoomQuickInsertMenuItem.js

Loom plugin for @atlaskit/editor-core

import React, { useCallback, useMemo } from 'react';
import { useIntl } from 'react-intl';
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics/types/enums';
import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages/insert-block';
import { logException } from '@atlaskit/editor-common/monitoring/error';
import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
import { messages as quickInsertMessages } from '@atlaskit/editor-common/quick-insert/messages';
import { useQuickInsertContext } from '@atlaskit/editor-common/quick-insert/use-quick-insert-context';
import VideoIcon from '@atlaskit/icon/core/video';
import { recordVideo, recordVideoFailed } from '../../pm-plugins/commands';
import { loomPluginKey } from '../../pm-plugins/main';
const previewImageUrls = {
  light: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVM4.png',
  dark: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVIR.png'
};
export const LoomQuickInsertMenuItem = ({
  api
}) => {
  const {
    formatMessage
  } = useIntl();
  const {
    isOffline
  } = useQuickInsertContext();
  const preview = useMemo(() => ({
    image: previewImageUrls,
    attribution: {
      name: formatMessage(quickInsertMessages.previewAttributionAtlassian)
    }
  }), [formatMessage]);
  const onSelect = useCallback(({
    editorView,
    insert
  }) => {
    var _recordVideo, _api$analytics2;
    const tr = insert(undefined);
    const loomState = loomPluginKey.getState(editorView.state);
    if (!(loomState !== null && loomState !== void 0 && loomState.isEnabled)) {
      var _recordVideoFailed, _api$analytics;
      logException(new Error(loomState === null || loomState === void 0 ? void 0 : loomState.error), {
        location: 'editor-plugin-loom/quick-insert-record-video'
      });
      return (_recordVideoFailed = recordVideoFailed({
        inputMethod: INPUT_METHOD.QUICK_INSERT,
        error: loomState === null || loomState === void 0 ? void 0 : loomState.error,
        editorAnalyticsAPI: api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
      })({
        tr
      })) !== null && _recordVideoFailed !== void 0 ? _recordVideoFailed : false;
    }
    return (_recordVideo = recordVideo({
      inputMethod: INPUT_METHOD.QUICK_INSERT,
      editorAnalyticsAPI: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions
    })({
      tr
    })) !== null && _recordVideo !== void 0 ? _recordVideo : false;
  }, [api]);
  return /*#__PURE__*/React.createElement(QuickInsertMenuItem, {
    description: formatMessage(messages.recordVideoDescription),
    iconBefore: /*#__PURE__*/React.createElement(VideoIcon, {
      label: ""
    }),
    isDisabled: isOffline,
    onSelect: onSelect,
    preview: preview,
    title: formatMessage(messages.loomTitle)
  });
};