"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = EditorHelp;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
var _eventTypes = require("../../../constants/event-types");
var _hotkeysHelper = _interopRequireDefault(require("../../../containers/hotkeys-helper"));
var _articleInfo = _interopRequireDefault(require("../../../containers/side-panel/article-info"));
var _comment = _interopRequireDefault(require("../../../containers/side-panel/comment"));
require("./style.css");
function EditorHelp(_ref) {
  let {
    children
  } = _ref;
  const [isShowHelpInfo, setIsShowHelpInfo] = (0, _react.useState)(false);
  const [isShowArticleInfo, setIsShowArticleInfo] = (0, _react.useState)(false);
  const [isShowCommentPanel, setIsShowCommentPanel] = (0, _react.useState)(false);
  const closeAllPanels = (0, _react.useCallback)(() => {
    setIsShowHelpInfo(false);
    setIsShowArticleInfo(false);
    setIsShowCommentPanel(false);
    const eventBus = _eventBus.default.getInstance();
    eventBus.dispatch(_eventTypes.INTERNAL_EVENTS.RESIZE_ARTICLE);
  }, []);
  const updateArticleInfoState = (0, _react.useCallback)(details => {
    if (details === null) {
      setIsShowArticleInfo(false);
    } else {
      closeAllPanels();
      setIsShowArticleInfo(true);
    }
  }, [closeAllPanels]);
  const updateHelpInfoState = (0, _react.useCallback)(state => {
    if (isShowHelpInfo && state === false) {
      setIsShowHelpInfo(false);
    } else if (!isShowHelpInfo && state !== false) {
      closeAllPanels();
      setIsShowHelpInfo(true);
    }
  }, [isShowHelpInfo, closeAllPanels]);
  const updateCommentPanelState = (0, _react.useCallback)(config => {
    if (config === null) {
      setIsShowCommentPanel(false);
    } else {
      closeAllPanels();
      setIsShowCommentPanel(true);
    }
  }, [closeAllPanels]);
  (0, _react.useEffect)(() => {
    const eventBus = _eventBus.default.getInstance();
    const unsubscribeArticleInfo = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.ON_ARTICLE_INFO_TOGGLE, updateArticleInfoState);
    const unsubscribeHelpInfo = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.ON_HELP_INFO_TOGGLE, updateHelpInfoState);
    const unsubscribeCommentPanel = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.ON_COMMENT_PANEL_TOGGLE, updateCommentPanelState);
    return () => {
      unsubscribeHelpInfo();
      unsubscribeArticleInfo();
      unsubscribeCommentPanel();
    };
  }, [updateArticleInfoState, updateHelpInfoState, updateCommentPanelState]);
  const containerClass = (0, _classnames.default)('sf-markdown-help-wrapper', {
    'active': isShowArticleInfo || isShowHelpInfo || isShowCommentPanel
  });
  return /*#__PURE__*/_react.default.createElement("div", {
    className: containerClass
  }, /*#__PURE__*/_react.default.createElement(_articleInfo.default, {
    isVisible: isShowArticleInfo
  }), isShowHelpInfo && /*#__PURE__*/_react.default.createElement(_hotkeysHelper.default, null), /*#__PURE__*/_react.default.createElement(_comment.default, {
    isVisible: isShowCommentPanel
  }));
}