revert code to last version

frontend/src/components/dropdown-menu/text-dropdown-menu.js

@@ -1,105 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import listener from '../context-menu/globalEventListener';
-import { Dropdown, DropdownMenu, DropdownToggle, DropdownItem } from 'reactstrap';
-import { gettext } from '../../utils/constants';
-
-const propTypes = {
-  menuClass: PropTypes.string,
-  menuType: PropTypes.oneOf(['pc', 'mobile']),
-  menuChildren: PropTypes.string.isRequired,
-  menuList: PropTypes.array.isRequired,
-  isHandleContextMenuEvent: PropTypes.bool,
-  onMenuItemClick: PropTypes.func.isRequired,
-};
-
-class TextDropDownMenu extends React.Component {
-
-  static defaultProps = {
-    isHandleContextMenuEvent: true,
-    menuType: 'pc',
-  };
-
-  constructor(props) {
-    super(props);
-    this.state = {
-      isItemMenuShow: false,
-    };
-  }
-
-  componentDidMount() {
-    if (this.props.isHandleContextMenuEvent) {
-      this.listenerId = listener.register(this.onShowMenu, this.onHideMenu);
-    }
-  }
-
-  componentWillUnmount() {
-    if (this.props.isHandleContextMenuEvent && this.listenerId) {
-      listener.unregister(this.listenerId);
-    }
-  }
-
-  onShowMenu = () => {
-    // nothing todo
-  }
-
-  onHideMenu = () => {
-    if (this.state.isItemMenuShow) {
-      this.setState({isItemMenuShow: false});
-    }
-  }
-
-  onDropdownToggleClick = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-
-    this.toggleOperationMenu();
-  }
-
-  toggleOperationMenu = () => {
-    this.setState({isItemMenuShow: !this.state.isItemMenuShow});
-  }
-
-  onMenuItemClick = (event) => {
-    let operation = event.target.dataset.toggle;
-    this.props.onMenuItemClick(operation, event);
-  }
-
-  render() {
-    let { menuClass, menuChildren, menuList } = this.props;
-    menuClass = 'btn btn-secondary operation-item ' + menuClass;
-
-    if (!menuList.length) {
-      return '';
-    }
-
-    return (
-      <Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
-        <DropdownToggle
-          className={menuClass}
-          title={gettext('More Operations')}
-          data-toggle="dropdown" 
-          aria-expanded={this.state.isItemMenuShow}
-          // onClick={this.onDropdownToggleClick}
-        >
-          {menuChildren}
-        </DropdownToggle>
-        <DropdownMenu>
-          {menuList.map((menuItem, index) => {
-            if (menuItem === 'Divider') {
-              return <DropdownItem key={index} divider />;
-            } else {
-              return (
-                <DropdownItem key={index} data-toggle={menuItem.key} onClick={this.onMenuItemClick}>{menuItem.value}</DropdownItem>
-              );
-            }
-          })}
-        </DropdownMenu>
-      </Dropdown>
-    );
-  }
-}
-
-TextDropDownMenu.propTypes = propTypes;
-
-export default TextDropDownMenu;

frontend/src/components/toolbar/view-file-toolbar.js

@@ -1,15 +1,13 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
-import { Tooltip} from 'reactstrap';
+import { DropdownToggle, Dropdown, DropdownMenu, DropdownItem, Tooltip} from 'reactstrap';
 import { Utils } from '../../utils/utils';
 import { gettext, siteRoot } from '../../utils/constants';
 import { seafileAPI } from '../../utils/seafile-api';
-import TextTranslation from '../../utils/text-translation';
 import ModalPotal from '../modal-portal';
 import ShareDialog from '../dialog/share-dialog';
 import EditFileTagDialog from '../dialog/edit-filetag-dialog';
 import RelatedFileDialogs from '../dialog/related-file-dialogs';
-import TextDropDownMenu from '../dropdown-menu/text-dropdown-menu';
 
 const propTypes = {
   path: PropTypes.string.isRequired,
@@ -33,6 +31,7 @@ class ViewFileToolbar extends React.Component {
     super(props);
     this.state = {
       isDraftMessageShow: false,
+      isMoreMenuShow: false,
       isShareDialogShow: false,
       isEditTagDialogShow: false,
       isRelatedFileDialogShow: false,
@@ -59,20 +58,8 @@ class ViewFileToolbar extends React.Component {
     this.setState({isDraftMessageShow: !this.state.isDraftMessageShow});
   }
 
-  onMenuItemClick = (operation) => {
+  toggleMore = () => {
-    switch (operation) {
+    this.setState({isMoreMenuShow: !this.state.isMoreMenuShow});
-      case 'Share':
-        this.onShareToggle();
-        break;
-      case 'Tags':
-        this.onEditFileTagToggle();
-        break;
-      case 'Related Files':
-        this.onListRelatedFileToggle();
-        break;
-      default:
-        break;
-    }
   }
 
   onShareToggle = () => {
@@ -117,13 +104,16 @@ class ViewFileToolbar extends React.Component {
             </Fragment>
           )}
           {filePermission === 'rw' && (
-            <TextDropDownMenu 
+            <Dropdown isOpen={this.state.isMoreMenuShow} toggle={this.toggleMore}>
-              menuClass={'btn btn-secondary operation-item'}
+              <DropdownToggle className='btn btn-secondary operation-item'>
-              menuType={'pc'}
+                {gettext('More')}
-              menuChildren={gettext('More')}
+              </DropdownToggle>
-              menuList={[TextTranslation.SHARE, TextTranslation.TAGS, TextTranslation.RELATED_FILES]}
+              <DropdownMenu>
-              onMenuItemClick={this.onMenuItemClick}
+                <DropdownItem onClick={this.onShareToggle}>{gettext('Share')}</DropdownItem>
-            />
+                <DropdownItem onClick={this.onEditFileTagToggle}>{gettext('Tags')}</DropdownItem>
+                <DropdownItem onClick={this.onListRelatedFileToggle}>{gettext('Related Files')}</DropdownItem>
+              </DropdownMenu>
+            </Dropdown>
           )}
         </div>
         {this.state.isShareDialogShow && (
@@ -172,4 +162,4 @@ class ViewFileToolbar extends React.Component {
 
 ViewFileToolbar.propTypes = propTypes;
 
-export default ViewFileToolbar;
+export default ViewFileToolbar;