@seafile/sdoc-editor 2.0.182 → 2.0.183

package/dist/api/seafile-api.js

@@ -305,6 +305,12 @@ var SeafileAPI = /*#__PURE__*/function () {
       var url = "/api/v2.1/seadoc/access-token-by-uuid/".concat(docUuid, "/");
       return this.req.get(url);
     }
+  }, {
+    key: "getFileMetadataInfo",
+    value: function getFileMetadataInfo(docUuid, fileType) {
+      var url = '/api/v2.1/seadoc/search-metadata-records/' + docUuid + '/?search_type=' + fileType;
+      return this.req.get(url);
+    }
   }]);
 }();
 var _default = exports["default"] = SeafileAPI;

package/dist/comment/components/global-comment/global-comment-header.js

@@ -11,22 +11,54 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
+var _reactstrap = require("reactstrap");
 var _tooltip = _interopRequireDefault(require("../../../components/tooltip"));
 var _constants = require("../../../constants");
 var _context2 = _interopRequireDefault(require("../../../context"));
 var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
 var _mouseEvent = require("../../../utils/mouse-event");
-var GlobalCommentHeader = function GlobalCommentHeader(_ref) {
-  var toggle = _ref.toggle,
-    activeCommentGroup = _ref.activeCommentGroup,
-    setCurrentCommentGroup = _ref.setCurrentCommentGroup;
+var _constants2 = require("../../constants");
+var CommentTypeDropdownItem = function CommentTypeDropdownItem(_ref) {
+  var type = _ref.type,
+    setCommentType = _ref.setCommentType,
+    commentType = _ref.commentType;
   var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
     t = _useTranslation.t;
+  var handleCommentTypeChanged = (0, _react.useCallback)(function (event, type) {
+    (0, _mouseEvent.eventStopPropagation)(event);
+    setCommentType(type);
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var isSelected = commentType === type;
+  return /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
+    className: "sdoc-dropdown-menu-item",
+    tag: 'div',
+    onClick: function onClick(event) {
+      return handleCommentTypeChanged(event, type);
+    }
+  }, isSelected && /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdoc-file-checked sdocfont sdoc-check-mark"
+  }), t(type));
+};
+var GlobalCommentHeader = function GlobalCommentHeader(_ref2) {
+  var toggle = _ref2.toggle,
+    activeCommentGroup = _ref2.activeCommentGroup,
+    setCurrentCommentGroup = _ref2.setCurrentCommentGroup,
+    commentType = _ref2.commentType,
+    setCommentType = _ref2.setCommentType,
+    commentList = _ref2.commentList;
+  var _useTranslation2 = (0, _reactI18next.useTranslation)('sdoc-editor'),
+    t = _useTranslation2.t;
   var panelHeaderRef = (0, _react.useRef)(null);
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     isMounted = _useState2[0],
     setIsMounted = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    isDropdownOpen = _useState4[0],
+    setDropdownOpen = _useState4[1];
   (0, _react.useEffect)(function () {
     if (panelHeaderRef.current) {
       setIsMounted(true);
@@ -37,7 +69,7 @@ var GlobalCommentHeader = function GlobalCommentHeader(_ref) {
     setCurrentCommentGroup(null);
   }, [setCurrentCommentGroup]);
   var toggleReadAll = (0, _react.useCallback)(/*#__PURE__*/function () {
-    var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regenerator2["default"])().m(function _callee(event) {
+    var _ref3 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regenerator2["default"])().m(function _callee(event) {
       var res, notifications, eventBus, _t;
       return (0, _regenerator2["default"])().w(function (_context) {
         while (1) switch (_context.p = _context.n) {
@@ -67,7 +99,7 @@ var GlobalCommentHeader = function GlobalCommentHeader(_ref) {
       }, _callee, null, [[1, 4]]);
     }));
     return function (_x) {
-      return _ref2.apply(this, arguments);
+      return _ref3.apply(this, arguments);
     };
   }(), []);
   return /*#__PURE__*/_react["default"].createElement("div", {
@@ -84,10 +116,40 @@ var GlobalCommentHeader = function GlobalCommentHeader(_ref) {
     }
   })), /*#__PURE__*/_react["default"].createElement("span", {
     className: "title"
-  }, activeCommentGroup ? t('Comment_details') : t('Comments'))), /*#__PURE__*/_react["default"].createElement("div", {
+  }, activeCommentGroup ? t('Comment_details') : "".concat(t(commentType)).concat(commentList.length > 0 ? " (".concat(commentList.length, ")") : ''))), /*#__PURE__*/_react["default"].createElement("div", {
     ref: panelHeaderRef,
     className: "comments-panel-header-right"
   }, !activeCommentGroup && /*#__PURE__*/_react["default"].createElement("div", {
+    id: "comment-types",
+    className: "sdoc-icon-btn",
+    onClick: function onClick() {
+      return setDropdownOpen(!isDropdownOpen);
+    }
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdocfont sdoc-filter1"
+  }), isMounted && /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+    target: "comment-types"
+  }, t('Comment_filter')), /*#__PURE__*/_react["default"].createElement(_reactstrap.Dropdown, {
+    isOpen: isDropdownOpen,
+    toggle: function toggle() {
+      return setDropdownOpen(!isDropdownOpen);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownMenu, {
+    className: "sdoc-dropdown-menu sdoc-comment-filter-dropdown",
+    container: "comment-types"
+  }, /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
+    type: _constants2.COMMENT_TYPES.ALL,
+    setCommentType: setCommentType,
+    commentType: commentType
+  }), /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
+    type: _constants2.COMMENT_TYPES.RESOLVED,
+    setCommentType: setCommentType,
+    commentType: commentType
+  }), /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
+    type: _constants2.COMMENT_TYPES.UNRESOLVED,
+    setCommentType: setCommentType,
+    commentType: commentType
+  })))), !activeCommentGroup && /*#__PURE__*/_react["default"].createElement("div", {
     id: "sdoc-read-all-btn",
     className: "sdoc-icon-btn",
     onClick: toggleReadAll

package/dist/comment/components/global-comment/index.css

@@ -64,6 +64,26 @@
   display: flex;
 }
 
+.comments-panel-header-right .sdoc-comment-filter-dropdown {
+  position: absolute;
+  right: 72px;
+  top: 36px !important;
+  left: unset !important;
+  box-shadow: 0 4px 10px #eee;
+}
+
+.comments-panel-header-right .sdoc-dropdown-menu-item {
+  position: relative;
+}
+
+.comments-panel-header-right .sdoc-file-checked {
+  position: absolute;
+  left: 7px;
+  color: #798d99;
+  font-size: 12px;
+  font-weight: 400;
+}
+
 .sdoc-comment-drawer .comments-panel-header-right .sdoc-icon-btn:not(:last-child) {
   margin-right: 4px;
 }

package/dist/comment/components/global-comment/index.js

@@ -22,7 +22,6 @@ var _constants = require("../../constants");
 var _useCommentList2 = _interopRequireDefault(require("../../hooks/comment-hooks/use-comment-list"));
 var _commentItemCollapseWrapper = _interopRequireDefault(require("../comment-item-collapse-wrapper"));
 var _commentItemWrapper = _interopRequireDefault(require("../comment-item-wrapper"));
-var _globalCommentBodyHeader = _interopRequireDefault(require("./global-comment-body-header"));
 var _globalCommentEditor = _interopRequireDefault(require("./global-comment-editor"));
 var _globalCommentHeader = _interopRequireDefault(require("./global-comment-header"));
 require("./index.css");
@@ -190,14 +189,13 @@ var GlobalComment = function GlobalComment(_ref) {
   }, /*#__PURE__*/_react["default"].createElement(_globalCommentHeader["default"], {
     toggle: closePlugin,
     activeCommentGroup: activeCommentGroup,
-    setCurrentCommentGroup: setCurrentCommentGroup
-  }), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comments-panel-body"
-  }, !activeCommentGroup && /*#__PURE__*/_react["default"].createElement(_globalCommentBodyHeader["default"], {
-    commentList: commentList,
+    setCurrentCommentGroup: setCurrentCommentGroup,
     commentType: commentType,
-    setCommentType: setCommentType
+    setCommentType: setCommentType,
+    commentList: commentList
   }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "comments-panel-body"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
     ref: contentRef,
     className: "comments-panel-body__content"
   }, /*#__PURE__*/_react["default"].createElement("div", {

package/dist/comment/constants/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.UP = exports.POPOVER_ADDING_HEIGHT = exports.LINE_HEIGHT = exports.FONT_SIZE_WIDTH = exports.DOWN = exports.DOC_NOTIFICATION_REDUCER_TYPE = exports.DOC_COMMENT_ELEMENT_ID = exports.COMMENT_URL_CLASSNAME = exports.COMMENT_TYPES = void 0;
 var COMMENT_TYPES = exports.COMMENT_TYPES = {
-  DOC: 'Doc_comments',
   ALL: 'All_comments',
   RESOLVED: 'Resolved_comments',
   UNRESOLVED: 'Unresolved_comments'

package/dist/comment/hooks/comment-hooks/use-comment-list.js

@@ -42,11 +42,6 @@ var useCommentList = function useCommentList() {
         return !item.resolved;
       });
       setCommentList(_commentList3);
-    } else if (commentType === _constants.COMMENT_TYPES.DOC) {
-      var _commentList4 = comment_list.filter(function (comment) {
-        return comment.detail.element_id === _constants.DOC_COMMENT_ELEMENT_ID;
-      });
-      setCommentList(_commentList4);
     }
   }, [commentType, comment_list]);
   return {

package/dist/constants/index.js

@@ -77,7 +77,8 @@ var INTERNAL_EVENT = exports.INTERNAL_EVENT = {
   IMAGE_COLUMN_TOGGLE: 'Image_column_toggle',
   CREATE_WHITEBOARD_FILE: 'create_whiteboard_file',
   GENERATE_EXDRAW_READ_ONLY_LINK: 'generate_exdraw_read_only_link',
-  TRANSFER_PREVIEW_FILE_ID: 'transfer_preview_file_id'
+  TRANSFER_PREVIEW_FILE_ID: 'transfer_preview_file_id',
+  FILE_METADATA_COMPONENT: 'file_metadata_component'
 };
 var PAGE_EDIT_AREA_WIDTH = exports.PAGE_EDIT_AREA_WIDTH = 672; // 672 = 794 - 2[borderLeft + borderRight] - 120[paddingLeft + paddingRight]
 var COMMENT_EDITOR_EDIT_AREA_WIDTH = exports.COMMENT_EDITOR_EDIT_AREA_WIDTH = 364;

package/dist/context.js

@@ -384,6 +384,12 @@ var Context = /*#__PURE__*/function () {
     value: function getTokenByDocUuid(docUuid) {
       return this.api.getTokenByDocUuid(docUuid);
     }
+  }, {
+    key: "getFileMetadataInfo",
+    value: function getFileMetadataInfo(fileType) {
+      var docUuid = this.getDocUuid();
+      return this.api.getFileMetadataInfo(docUuid, fileType);
+    }
   }]);
 }();
 var context = new Context();

package/dist/extension/commons/select-file-dialog/index.css

@@ -1,9 +1,9 @@
 .sdoc-file-select-dialog {
-  max-width: 520px;
+  max-width: 700px;
 }
 
 .sdoc-file-select-dialog .sdoc-file-select-modal {
-  width: 520px;
+  width: 700px;
 }
 
 .sdoc-file-select-dialog .sdoc-file-select-footer {
@@ -37,7 +37,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: auto;
+  margin: auto 0;
 }
 
 .search-container {
@@ -78,13 +78,6 @@
   cursor: pointer;
 }
 
-.sdoc-files-search-popover-container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 200px;
-}
-
 .sdoc-search-wrapper {
   position: relative;
   display: flex;
@@ -94,10 +87,9 @@
 
 .sdoc-search-input {
   flex: 1;
-  height: 28px;
-  padding: 0 25px;
+  height: 38px;
+  padding: 0 35px;
   line-height: 28px;
-
 }
 
 .sdoc-search-input::placeholder {
@@ -128,10 +120,68 @@
 
 .sdoc-files-search-popover-container .sdoc-search-wrapper .sdoc-search {
   position: absolute;
-  left: 4px;
+  left: 10px;
 }
 
 .sdoc-files-search-popover-container .sdoc-search-wrapper .sdoc-close {
   position: absolute;
-  right: 4px;
+  right: 9px;
+}
+
+.sdoc-file-select-container .sdoc-file-select-wrapper {
+  display: flex;
+}
+
+.sdoc-file-select-wrapper .sdoc-file-metadata-wrapper {
+  display: flex;
+}
+
+.sdoc-file-left-panel {
+  width: 100%;
+}
+
+.sdoc-file-left-panel .sdoc-files-search-popover-container {
+  padding: 8px 16px 0 16px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+}
+
+.modal-header-container .modal-operation-container {
+  display: flex;
+  align-items: center;
+}
+
+.toggle-view {
+  display: flex;
+  margin-right: 0.5rem;
+  border: 1px solid #eee;
+  border-radius: 3px;
+  height: 36px;
+  padding: 3px;
+}
+
+.toggle-view-container {
+  display: flex;
+}
+
+.toggle-view .sdoc-tree-view,
+.toggle-view .sdoc-list-view {
+  min-width: 66px;
+  width: fit-content;
+  border-radius: 2px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.toggle-view .sdoc-tree-view.active,
+.toggle-view .sdoc-list-view.active {
+  background-color: #f5f5f5;
+}
+
+.toggle-view .sdoc-tree-view:hover,
+.toggle-view .sdoc-list-view:hover {
+  background-color: #f0f0f0;
 }

package/dist/extension/commons/select-file-dialog/index.js

@@ -11,12 +11,17 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
 var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
 var _toast = _interopRequireDefault(require("../../../components/toast"));
+var _constants = require("../../../constants");
 var _context = _interopRequireDefault(require("../../../context"));
+var _useCollaborators = require("../../../hooks/use-collaborators");
 var _commonUtils = require("../../../utils/common-utils");
-var _constants = require("../../constants");
-var _localFiles = _interopRequireDefault(require("./local-files"));
+var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
+var _constants2 = require("../../constants");
+var _listView = _interopRequireDefault(require("./list-view"));
+var _treeView = _interopRequireDefault(require("./tree-view"));
 require("./index.css");
 var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
   var editor = _ref.editor,
@@ -43,18 +48,29 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
     _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
     isOpenSearch = _useState8[0],
     setIsOpenSearch = _useState8[1];
+  var _useState9 = (0, _react.useState)(null),
+    _useState0 = (0, _slicedToArray2["default"])(_useState9, 2),
+    FileMetadataComponent = _useState0[0],
+    setFileMetadataComponent = _useState0[1];
+  var _useState1 = (0, _react.useState)(true),
+    _useState10 = (0, _slicedToArray2["default"])(_useState1, 2),
+    isTreeView = _useState10[0],
+    setIsTreeView = _useState10[1];
+  var searchRef = (0, _react.useRef)(null);
+  var repoID = _context["default"].getSetting('repoID');
+  var enableMetadata = _context["default"].getSetting('enableMetadata');
   var modalTitle;
   switch (dialogType) {
-    case _constants.ELEMENT_TYPE.FILE_LINK:
+    case _constants2.ELEMENT_TYPE.FILE_LINK:
       modalTitle = 'Select_file';
       break;
-    case _constants.ELEMENT_TYPE.SDOC_LINK:
+    case _constants2.ELEMENT_TYPE.SDOC_LINK:
       modalTitle = 'Select_sdoc_document';
       break;
-    case _constants.ELEMENT_TYPE.VIDEO:
+    case _constants2.ELEMENT_TYPE.VIDEO:
       modalTitle = 'Select_video_file';
       break;
-    case _constants.ELEMENT_TYPE.WHITEBOARD:
+    case _constants2.ELEMENT_TYPE.WHITEBOARD:
       modalTitle = 'Link_Excalidraw_file';
       break;
     default:
@@ -72,23 +88,23 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
     var _ref4 = insertWhiteboardFile || {},
       insertWhiteboard = _ref4.insertWhiteboard;
     switch (dialogType) {
-      case _constants.ELEMENT_TYPE.FILE_LINK:
+      case _constants2.ELEMENT_TYPE.FILE_LINK:
         insertFileLinkCallback && insertFileLinkCallback(editor, fileInfo.name, fileInfo.file_uuid);
         break;
-      case _constants.ELEMENT_TYPE.SDOC_LINK:
+      case _constants2.ELEMENT_TYPE.SDOC_LINK:
         insertSdocFileLinkCallback && insertSdocFileLinkCallback(editor, fileInfo.name, fileInfo.file_uuid);
         break;
-      case _constants.ELEMENT_TYPE.VIDEO:
-        var repoID = _context["default"].getSetting('repoID');
+      case _constants2.ELEMENT_TYPE.VIDEO:
+        var _repoID = _context["default"].getSetting('repoID');
         var fileServerRoot = _context["default"].getSetting('fileServerRoot');
         // Get seafile's video download url as src
-        var url = "".concat(fileServerRoot, "repos/").concat(repoID, "/files").concat(fileInfo.path, "/?op=download");
+        var url = "".concat(fileServerRoot, "repos/").concat(_repoID, "/files").concat(fileInfo.path, "/?op=download");
         var encodedUrl = encodeURI(url);
         insertVideo && insertVideo(editor, [{
           name: fileInfo.name
         }], [encodedUrl]);
         break;
-      case _constants.ELEMENT_TYPE.WHITEBOARD:
+      case _constants2.ELEMENT_TYPE.WHITEBOARD:
         insertWhiteboard && insertWhiteboard(editor, fileInfo.name, fileInfo.path);
         break;
       default:
@@ -101,14 +117,14 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
     var fileInfo = (0, _objectSpread2["default"])({}, currentSelectedFile);
 
     // Insert video element in sdoc
-    if (dialogType === _constants.ELEMENT_TYPE.VIDEO) {
+    if (dialogType === _constants2.ELEMENT_TYPE.VIDEO) {
       insertFile(fileInfo);
       closeDialog();
       return;
     }
 
     // Insert whiteboard file in sdoc
-    if (dialogType === _constants.ELEMENT_TYPE.WHITEBOARD) {
+    if (dialogType === _constants2.ELEMENT_TYPE.WHITEBOARD) {
       insertFile(fileInfo);
       closeDialog();
       return;
@@ -134,11 +150,6 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
     closeDialog();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [currentSelectedFile]);
-  var toggleSearch = (0, _react.useCallback)(function () {
-    setIsOpenSearch(function (prev) {
-      return !prev;
-    });
-  }, []);
   var handleSearchInputChange = (0, _react.useCallback)(function (e) {
     var keyword = e.target.value.toLowerCase();
     setTemSearchContent(keyword);
@@ -146,9 +157,12 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
   var executeSearch = (0, _react.useCallback)(function () {
     if (!temSearchContent.trim()) {
       setSearchContent('');
+      setIsOpenSearch(false);
       return;
     }
+    setCurrentSelectedFile(null);
     setSearchContent(temSearchContent);
+    setIsOpenSearch(true);
   }, [temSearchContent]);
   var handleInputKeyDown = (0, _react.useCallback)(function (e) {
     if ((0, _isHotkey["default"])('enter', e)) {
@@ -158,14 +172,52 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
     if ((0, _isHotkey["default"])('escape', e)) {
       e.preventDefault();
       e.stopPropagation();
-      setIsOpenSearch(!isOpenSearch);
+      var el = searchRef.current;
+      if (!el) return;
+      el && el.blur();
+      el && (el.value = '');
+      setSearchContent('');
+      setIsOpenSearch(false);
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [executeSearch, isOpenSearch]);
   (0, _react.useEffect)(function () {
     if (!isOpenSearch) {
       setSearchContent('');
+      var el = searchRef.current;
+      el && (el.value = '');
     }
   }, [isOpenSearch]);
+  var dirent = (0, _react.useMemo)(function () {
+    return {
+      name: currentSelectedFile === null || currentSelectedFile === void 0 ? void 0 : currentSelectedFile.name,
+      type: currentSelectedFile ? 'file' : 'dir',
+      isLib: (currentSelectedFile === null || currentSelectedFile === void 0 ? void 0 : currentSelectedFile.path) === '/',
+      file_tags: [],
+      path: currentSelectedFile === null || currentSelectedFile === void 0 ? void 0 : currentSelectedFile.path
+    };
+  }, [currentSelectedFile]);
+  (0, _react.useEffect)(function () {
+    if (!repoID || !currentSelectedFile) return;
+    var eventBus = _eventBus["default"].getInstance();
+    eventBus.dispatch(_constants.INTERNAL_EVENT.FILE_METADATA_COMPONENT, function (component) {
+      setFileMetadataComponent(function () {
+        return component;
+      });
+    });
+  }, [repoID, currentSelectedFile, dirent]);
+  var onClickTreeView = (0, _react.useCallback)(function () {
+    setIsTreeView(true);
+    setIsOpenSearch(false);
+    setSearchContent('');
+    setCurrentSelectedFile(null);
+  }, []);
+  var onClickListView = (0, _react.useCallback)(function () {
+    setIsTreeView(false);
+    setIsOpenSearch(false);
+    setSearchContent('');
+    setCurrentSelectedFile(null);
+  }, []);
   return /*#__PURE__*/_react["default"].createElement(_reactstrap.Modal, {
     isOpen: true,
     autoFocus: true,
@@ -179,42 +231,63 @@ var SelectSdocFileDialog = function SelectSdocFileDialog(_ref) {
   }, /*#__PURE__*/_react["default"].createElement("h5", {
     className: "modal-title-container"
   }, t(modalTitle)), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "search-container"
-  }, !isOpenSearch && /*#__PURE__*/_react["default"].createElement("div", {
-    className: "search-icon-container"
+    className: "modal-operation-container"
+  }, enableMetadata && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "toggle-view"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])('sdocfont sdoc-tree-view', {
+      'active': isTreeView
+    }),
+    onClick: onClickTreeView
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])('sdocfont sdoc-list-ul sdoc-list-view', {
+      'active': !isTreeView
+    }),
+    onClick: onClickListView
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdocfont sdoc-close1 sdoc-close-dialog",
+    onClick: closeDialog
+  }))), /*#__PURE__*/_react["default"].createElement(_reactstrap.ModalBody, {
+    className: "p-0"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-file-select-container"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-file-select-wrapper"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-file-left-panel"
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdocfont sdoc-find-replace sdoc-files-search-popover",
-    onClick: toggleSearch
-  })), isOpenSearch && /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-files-search-popover-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-search-wrapper"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdocfont sdoc-find-replace sdoc-search"
   }), /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
-    autoFocus: true,
+    innerRef: searchRef,
     className: "sdoc-search-input",
     onKeyUp: handleInputKeyDown,
     onChange: handleSearchInputChange,
     id: "sdoc-search",
     placeholder: t('Search')
-  }), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdocfont sdoc-close1 sdoc-close",
-    onClick: toggleSearch
-  })))), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdocfont sdoc-close1 sdoc-close-dialog",
-    onClick: closeDialog
-  })), /*#__PURE__*/_react["default"].createElement(_reactstrap.ModalBody, {
-    className: "p-0"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-file-select-container"
-  }, /*#__PURE__*/_react["default"].createElement(_localFiles["default"], {
-    fileType: _constants.FILE_TYPE[dialogType],
+  }))), isTreeView ? /*#__PURE__*/_react["default"].createElement(_treeView["default"], {
+    fileType: _constants2.FILE_TYPE[dialogType],
     onSelectedFile: onSelectedFile,
     toggle: closeDialog,
     searchContent: searchContent,
     isOpenSearch: isOpenSearch
-  }), /*#__PURE__*/_react["default"].createElement("div", {
+  }) : /*#__PURE__*/_react["default"].createElement(_listView["default"], {
+    fileType: _constants2.FILE_TYPE[dialogType],
+    onSelectedFile: onSelectedFile,
+    searchContent: searchContent,
+    isOpenSearch: isOpenSearch
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-file-metadata-wrapper"
+  }, FileMetadataComponent && repoID && currentSelectedFile && /*#__PURE__*/_react["default"].createElement(_useCollaborators.CollaboratorsProvider, {
+    repoID: repoID
+  }, /*#__PURE__*/_react["default"].createElement(FileMetadataComponent, {
+    repoID: repoID,
+    path: currentSelectedFile === null || currentSelectedFile === void 0 ? void 0 : currentSelectedFile.path,
+    dirent: dirent
+  })))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-file-select-footer"
   }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Button, {
     color: "secondary",

package/dist/extension/commons/select-file-dialog/list-view/index.css

@@ -0,0 +1,71 @@
+.sdoc-files-list {
+  flex: 1;
+  padding: 8px 16px;
+  width: 100%;
+  height: 400px;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+}
+
+.sdoc-file-wrapper {
+  border-radius: 4px;
+  cursor: pointer;
+  display: flex;
+  font-size: .8125rem;
+  height: auto;
+  padding: 10px 0 10px 8px;
+  position: relative;
+}
+
+.sdoc-file-wrapper:hover {
+  background-color: #f5f5f5;
+}
+
+.sdoc-file-wrapper .file-icon {
+  height: 36px;
+  width: 36px;
+}
+
+.sdoc-item-content {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1;
+  margin-left: .25rem;
+  overflow: hidden;
+}
+
+.sdoc-item-name {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-size: 14px;
+}
+
+.sdoc-item-path {
+  color: #666;
+}
+
+.sdoc-item-user-container {
+  display: flex;
+  color: #666;
+}
+
+.sdoc-item-user-container .item-divide {
+  margin: 0 5px;
+  transform: translateY(-1px);
+}
+
+.sdoc-files-list .sdoc-file-checked {
+  position: absolute;
+  right: 10px;
+  top: 30px;
+  color: #798d99;
+  font-size: 12px;
+  font-weight: 400;
+}
+
+.sdoc-files-list .sdoc-file-search-no-result {
+  display: flex;
+  justify-content: center;
+}

package/dist/extension/commons/select-file-dialog/list-view/index.js

@@ -0,0 +1,146 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _regenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/regenerator"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactI18next = require("react-i18next");
+var _context2 = _interopRequireDefault(require("../../../../context"));
+var _helpers = require("../helpers");
+require("./index.css");
+var ListView = function ListView(_ref) {
+  var onSelectedFile = _ref.onSelectedFile,
+    fileType = _ref.fileType,
+    t = _ref.t,
+    searchContent = _ref.searchContent,
+    isOpenSearch = _ref.isOpenSearch;
+  var _useState = (0, _react.useState)(null),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    currentActiveItem = _useState2[0],
+    setCurrentActiveItem = _useState2[1];
+  var _useState3 = (0, _react.useState)([]),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    allFileList = _useState4[0],
+    setAllFileList = _useState4[1];
+  var _useState5 = (0, _react.useState)([]),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    fileList = _useState6[0],
+    setFileList = _useState6[1];
+  var _useState7 = (0, _react.useState)(''),
+    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+    repoName = _useState8[0],
+    setRepoName = _useState8[1];
+  var onSelectFile = (0, _react.useCallback)(function (e, file) {
+    e && e.stopPropagation();
+    setCurrentActiveItem(file);
+    onSelectedFile(file);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    var getFileMetadata = /*#__PURE__*/function () {
+      var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regenerator2["default"])().m(function _callee() {
+        var res, sortedRecords, firstFile, filePath;
+        return (0, _regenerator2["default"])().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _context.n = 1;
+              return _context2["default"].getFileMetadataInfo(fileType);
+            case 1:
+              res = _context.v;
+              setRepoName(res.data.repo_name);
+              sortedRecords = (0, _toConsumableArray2["default"])(res.data.records).sort(function (a, b) {
+                return new Date(b._mtime) - new Date(a._mtime);
+              });
+              setAllFileList(sortedRecords);
+              setFileList(sortedRecords);
+              firstFile = sortedRecords[0];
+              if (firstFile) {
+                filePath = (firstFile._parent_dir === '/' ? '' : firstFile._parent_dir) + '/' + firstFile._name;
+                onSelectFile(null, {
+                  id: firstFile._id,
+                  name: firstFile._name,
+                  path: filePath
+                });
+              }
+            case 2:
+              return _context.a(2);
+          }
+        }, _callee);
+      }));
+      return function getFileMetadata() {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    getFileMetadata();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    if (!isOpenSearch || !searchContent.trim()) {
+      setFileList(allFileList);
+    }
+    if (searchContent.trim() && isOpenSearch) {
+      var keyword = searchContent.trim().toLowerCase();
+      var result = allFileList.filter(function (file) {
+        var _file$_name, _file$_parent_dir, _file$file_creator_ni;
+        var mtimeStr = new Date(file._mtime).toLocaleString().toLowerCase();
+        return ((_file$_name = file._name) === null || _file$_name === void 0 ? void 0 : _file$_name.toLowerCase().includes(keyword)) || ((_file$_parent_dir = file._parent_dir) === null || _file$_parent_dir === void 0 ? void 0 : _file$_parent_dir.toLowerCase().includes(keyword)) || mtimeStr.includes(keyword) || ((_file$file_creator_ni = file.file_creator_nickname) === null || _file$file_creator_ni === void 0 ? void 0 : _file$file_creator_ni.toLowerCase().includes(keyword)) || (repoName === null || repoName === void 0 ? void 0 : repoName.toLowerCase().includes(keyword));
+      });
+      setFileList(result);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isOpenSearch, searchContent]);
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-files-list"
+  }, fileList.map(function (file) {
+    var fileTypeIcon = (0, _helpers.parcelFileTypeIcon)(file._name);
+    var dirPath = repoName + (file._parent_dir === '/' ? '' : file._parent_dir);
+    var date = new Date(file._mtime);
+    var fileAdjustTime = date.toLocaleString();
+    var username = file.file_creator_nickname;
+    var selected = (currentActiveItem === null || currentActiveItem === void 0 ? void 0 : currentActiveItem.id) === file._id;
+    var filePath = (file._parent_dir === '/' ? '' : file._parent_dir) + '/' + file._name;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      key: file._id,
+      className: "sdoc-file-wrapper",
+      onClick: function onClick(e) {
+        return onSelectFile(e, {
+          id: file._id,
+          name: file._name,
+          path: filePath
+        });
+      }
+    }, /*#__PURE__*/_react["default"].createElement("img", {
+      className: "file-icon",
+      src: fileTypeIcon,
+      alt: ""
+    }), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-item-content"
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-item-name ellipsis",
+      title: file._name
+    }, file._name), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-item-path ellipsis",
+      title: dirPath
+    }, dirPath), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-item-user-container ellipsis"
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "item-user"
+    }, username), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "item-divide"
+    }, "|"), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "item-adjust-time"
+    }, fileAdjustTime))), selected && /*#__PURE__*/_react["default"].createElement("i", {
+      className: "sdoc-file-checked sdocfont sdoc-check-mark"
+    }));
+  }), isOpenSearch && fileList.length === 0 && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-file-search-no-result"
+  }, t('No_results')));
+};
+var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(ListView);

package/dist/extension/commons/select-file-dialog/{local-files → tree-view}/index.css

@@ -44,7 +44,7 @@
   right: 1px;
 }
 
-.sdoc-file-checked {
+.sdoc-files-tree .sdoc-file-checked {
   position: absolute;
   right: 10px;
   color: #798d99;
@@ -94,7 +94,6 @@
 
 .sdoc-folder-container.sdoc-folder-search-results .sdoc-file-info {
   height: 59px;
-  width: 486px;
   padding: 10px 50px;
   flex-direction: column;
   justify-content: center;

package/dist/extension/commons/select-file-dialog/{local-files → tree-view}/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _regeneratorValues2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/regeneratorValues"));
 var _regenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
@@ -19,7 +20,7 @@ var _context4 = _interopRequireDefault(require("../../../../context"));
 var _commonUtils = require("../../../../utils/common-utils");
 var _helpers = require("../helpers");
 require("./index.css");
-var LocalFiles = function LocalFiles(_ref) {
+var TreeView = function TreeView(_ref) {
   var onSelectedFile = _ref.onSelectedFile,
     toggle = _ref.toggle,
     fileType = _ref.fileType,
@@ -171,32 +172,38 @@ var LocalFiles = function LocalFiles(_ref) {
       getTreeData(rootPath);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isOpenSearch, searchContent, isOpenSearch]);
+  }, [isOpenSearch, searchContent]);
   var onToggle = (0, _react.useCallback)(/*#__PURE__*/function () {
     var _ref3 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regenerator2["default"])().m(function _callee2(e, item, treeData) {
       return (0, _regenerator2["default"])().w(function (_context3) {
         while (1) switch (_context3.n) {
           case 0:
             e && e.stopPropagation();
-            if (!expandedFolder.has(item.indexId)) {
+            if (!isOpenSearch) {
               _context3.n = 1;
               break;
             }
+            return _context3.a(2);
+          case 1:
+            if (!expandedFolder.has(item.indexId)) {
+              _context3.n = 2;
+              break;
+            }
             collapsedFolder(treeData, item.indexId);
             expandedFolder["delete"](item.indexId);
-            _context3.n = 3;
+            _context3.n = 4;
             break;
-          case 1:
-            _context3.n = 2;
-            return getTreeData(item.path, item.indexId, treeData);
           case 2:
-            expandedFolder.add(item.indexId);
+            _context3.n = 3;
+            return getTreeData(item.path, item.indexId, treeData);
           case 3:
+            expandedFolder.add(item.indexId);
+          case 4:
             onSelectedFile(null);
             setCurrentActiveItem(item);
             setExpandedFolder(new Set(Array.from(expandedFolder)));
             // eslint-disable-next-line react-hooks/exhaustive-deps
-          case 4:
+          case 5:
             return _context3.a(2);
         }
       }, _callee2);
@@ -207,8 +214,11 @@ var LocalFiles = function LocalFiles(_ref) {
   }(), [expandedFolder]);
   var onSelectFile = (0, _react.useCallback)(function (e, file) {
     e.stopPropagation();
-    setCurrentActiveItem(file);
-    onSelectedFile(file);
+    var newFile = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, file), {}, {
+      path: file.path || file.fullpath
+    });
+    setCurrentActiveItem(newFile);
+    onSelectedFile(newFile);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var getSearchFiles = (0, _react.useCallback)(function (searchContent, fileType) {
@@ -229,20 +239,24 @@ var LocalFiles = function LocalFiles(_ref) {
   }, []);
   var renderFileTree = (0, _react.useCallback)(function (data) {
     if (!Array.isArray(data) || data.length === 0) return null;
+    if (isOpenSearch && !hasSearchResult) return null;
     return data.map(function (item) {
       var _item$fullpath, _item$children, _item$children2;
       if (!item) return null;
       var type = item.type,
         indexId = item.indexId,
-        name = item.name;
+        name = item.name,
+        file_uuid = item.file_uuid,
+        path = item.path,
+        fullpath = item.fullpath;
       // Get file type icon
       var fileTypeIcon = (0, _helpers.parcelFileTypeIcon)(name);
       var result = (_item$fullpath = item.fullpath) === null || _item$fullpath === void 0 ? void 0 : _item$fullpath.split('/').filter(Boolean);
       item.fullpath && result.pop();
       var folderPath = item.fullpath && result.join('/');
-      var selected = (currentActiveItem === null || currentActiveItem === void 0 ? void 0 : currentActiveItem.indexId) === indexId;
+      var selected = (currentActiveItem === null || currentActiveItem === void 0 ? void 0 : currentActiveItem.path) === (path || fullpath);
       return /*#__PURE__*/_react["default"].createElement("div", {
-        key: indexId,
+        key: indexId || file_uuid,
         className: (0, _classnames["default"])('sdoc-folder-container', {
           'sdoc-folder-search-results': hasSearchResult === true
         })
@@ -292,11 +306,11 @@ var LocalFiles = function LocalFiles(_ref) {
       })));
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [treeData, currentActiveItem, expandedFolder]);
+  }, [treeData, currentActiveItem, expandedFolder, isOpenSearch, hasSearchResult]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-files-tree"
   }, renderFileTree(treeData), isOpenSearch && !hasSearchResult && !isCurrentLibrary && /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-file-search-no-result"
   }, t('No_results')));
 };
-var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(LocalFiles);
+var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(TreeView);

package/dist/extension/plugins/sdoc-link/hover-menu/index.js

@@ -154,7 +154,7 @@ var SdocLinkHoverMenu = function SdocLinkHoverMenu(_ref) {
       return handleOpenLinkPreview('sdoc-file-preview');
     }
   }, /*#__PURE__*/_react["default"].createElement("i", {
-    className: "sdocfont eye icon-font"
+    className: "sdocfont sodc-eye icon-font"
   })), isShowTooltip && /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
     target: "sdoc_link_preview",
     placement: "top",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "2.0.182",
+  "version": "2.0.183",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -71,5 +71,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "66343e00bc56ccd16080bb5c0a1d69d8de792c44"
+  "gitHead": "9b4bf8c3349fbe955d3119910cbad3c42f54f024"
 }

package/dist/comment/components/global-comment/global-comment-body-header.js

@@ -1,91 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactI18next = require("react-i18next");
-var _reactstrap = require("reactstrap");
-var _mouseEvent = require("../../../utils/mouse-event");
-var _constants = require("../../constants");
-var CommentTypeDropdownItem = function CommentTypeDropdownItem(_ref) {
-  var type = _ref.type,
-    setCommentType = _ref.setCommentType;
-  var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
-    t = _useTranslation.t;
-  var handleCommentTypeChanged = (0, _react.useCallback)(function (event, type) {
-    (0, _mouseEvent.eventStopPropagation)(event);
-    setCommentType(type);
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  return /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownItem, {
-    className: "sdoc-dropdown-menu-item",
-    tag: 'div',
-    onClick: function onClick(event) {
-      return handleCommentTypeChanged(event, type);
-    }
-  }, t(type));
-};
-var GlobalCommentBodyHeader = function GlobalCommentBodyHeader(_ref2) {
-  var _ref2$commentList = _ref2.commentList,
-    commentList = _ref2$commentList === void 0 ? [] : _ref2$commentList,
-    commentType = _ref2.commentType,
-    setCommentType = _ref2.setCommentType;
-  var _useTranslation2 = (0, _reactI18next.useTranslation)('sdoc-editor'),
-    t = _useTranslation2.t;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    isDropdownOpen = _useState2[0],
-    setDropdownOpen = _useState2[1];
-  var commentTip = null;
-  if (commentList.length === 1) {
-    commentTip = t('Total_1_comment');
-  } else if (commentList.length > 1) {
-    commentTip = t('Total_count_comments', {
-      count: commentList.length
-    });
-  }
-  var id = 'comment-type-controller';
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comments-panel-body__header"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comments-types-count"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    id: "comment-types",
-    className: "comment-type"
-  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Dropdown, {
-    isOpen: isDropdownOpen,
-    toggle: function toggle() {
-      return setDropdownOpen(!isDropdownOpen);
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownToggle, {
-    tag: 'div',
-    caret: true,
-    className: "d-flex align-items-center justify-content-center"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    id: id
-  }, t(commentType))), /*#__PURE__*/_react["default"].createElement(_reactstrap.DropdownMenu, {
-    className: "sdoc-dropdown-menu sdoc-comment-filter-dropdown",
-    container: "comment-types"
-  }, /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
-    type: _constants.COMMENT_TYPES.ALL,
-    setCommentType: setCommentType
-  }), /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
-    type: _constants.COMMENT_TYPES.DOC,
-    setCommentType: setCommentType
-  }), /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
-    type: _constants.COMMENT_TYPES.RESOLVED,
-    setCommentType: setCommentType
-  }), /*#__PURE__*/_react["default"].createElement(CommentTypeDropdownItem, {
-    type: _constants.COMMENT_TYPES.UNRESOLVED,
-    setCommentType: setCommentType
-  })))), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comment-count-tip"
-  }, commentTip)));
-};
-var _default = exports["default"] = GlobalCommentBodyHeader;