fix toggle tags popover (#5835)

frontend/src/components/common/seahub-popover.js

@@ -23,12 +23,12 @@ class SeahubPopover extends React.Component {
   isSelectOpen = false;
 
   componentDidMount() {
-    document.addEventListener('mousedown', this.onMouseDown, true);
+    document.addEventListener('mousedown', this.onMouseDown);
     document.addEventListener('keydown', this.onKeyDown);
   }
 
   componentWillUnmount() {
-    document.removeEventListener('mousedown', this.onMouseDown, true);
+    document.removeEventListener('mousedown', this.onMouseDown);
     document.removeEventListener('keydown', this.onKeyDown);
   }
 

frontend/src/components/cur-dir-path/dir-tool.js

@@ -24,8 +24,13 @@ class DirTool extends React.Component {
     this.tagsIconID = `tags-icon-${uuidv4()}`;
   }
 
-  onShowListRepoTag = (e) => {
+  onMouseDown = (e) => {
-    this.setState({ isListRepoTagShow: true });
+    e.stopPropagation();
+  };
+
+  toggleRepoTag = (e) => {
+    e.stopPropagation();
+    this.setState({ isListRepoTagShow: !this.state.isListRepoTagShow });
   };
 
   hidePopover = (e) => {
@@ -61,7 +66,16 @@ class DirTool extends React.Component {
       toolbarDom = (
         <ul className="path-toolbar">
           <li className="toolbar-item">
-            <a className="op-link sf2-icon-tag" href="#" id={this.tagsIconID} role="button" onClick={this.onShowListRepoTag} title={gettext('Tags')} aria-label={gettext('Tags')}></a>
+            <a
+              className="op-link sf2-icon-tag"
+              href="#"
+              id={this.tagsIconID}
+              role="button"
+              onClick={this.toggleRepoTag}
+              onMouseDown={this.onMouseDown}
+              title={gettext('Tags')}
+              aria-label={gettext('Tags')}
+            ></a>
           </li>
           <li className="toolbar-item">
             <a className="op-link sf2-icon-recycle" href={trashUrl} title={gettext('Trash')} aria-label={gettext('Trash')}></a>
@@ -74,7 +88,16 @@ class DirTool extends React.Component {
       toolbarDom = (
         <ul className="path-toolbar">
           <li className="toolbar-item">
-            <a className="op-link sf2-icon-tag" href="#" id={this.tagsIconID} role="button" onClick={this.onShowListRepoTag} title={gettext('Tags')} aria-label={gettext('Tags')}></a>
+            <a
+              className="op-link sf2-icon-tag"
+              href="#"
+              id={this.tagsIconID}
+              role="button"
+              onClick={this.toggleRepoTag}
+              onMouseDown={this.onMouseDown}
+              title={gettext('Tags')}
+              aria-label={gettext('Tags')}
+            ></a>
           </li>
           <li className="toolbar-item">
             <a className="op-link sf2-icon-recycle" href={trashUrl} title={gettext('Trash')} aria-label={gettext('Trash')}></a>

frontend/src/components/dialog/org-admin-invite-user-dialog.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Button, Modal, Input, ModalHeader, ModalBody, ModalFooter, Label, Form, InputGroup, InputGroupAddon, FormGroup } from 'reactstrap';
+import { Button, Modal, Input, ModalHeader, ModalBody, ModalFooter, Label, Form, FormGroup } from 'reactstrap';
 import { gettext } from '../../utils/constants';
 
 const propTypes = {
@@ -26,7 +26,7 @@ class OrgAdminInviteUserDialog extends React.Component {
       this.setState({isAddingUser: true});
       this.props.handleSubmit(email.trim());
     }
-  }
+  };
 
   handleKeyPress = (e) => {
     e.preventDefault();
@@ -38,11 +38,11 @@ class OrgAdminInviteUserDialog extends React.Component {
   inputEmail = (e) => {
     let email = e.target.value.trim();
     this.setState({email: email});
-  }
+  };
 
   toggle = () => {
     this.props.toggle();
-  }
+  };
 
   validateInputParams() {
     let errMessage;

frontend/src/components/dialog/org-admin-invite-user-via-weixin-dialog.js

@@ -20,10 +20,10 @@ class OrgAdminInviteUserViaWeiXinDialog extends React.Component {
     copy(this.props.invitationLink);
     this.props.toggle();
     const message = gettext('Internal link has been copied to clipboard');
-    toaster.success(message), {
+    toaster.success(message, {
       duration: 2
-    };
+    });
-  }
+  };
 
   render() {
     return (

frontend/src/components/dialog/repo-seatable-integration-dialog.js

@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Modal, ModalHeader, ModalBody } from 'reactstrap';
 import SeatableAccountSettingList from '../seatable-integration-account-setting-widgets/seatable-account-setting-list.js';

frontend/src/components/search/ai-search.js

@@ -286,7 +286,7 @@ export default class AISearch extends Component {
     this.updateSearchPageURL(queryData);
     queryData['per_page'] = PER_PAGE;
     queryData['page'] = page;
-     this.onAiSearch(queryData, cancelToken, page);
+    this.onAiSearch(queryData, cancelToken, page);
   };
 
   onAiSearch = (queryData, cancelToken, page) => {
@@ -294,12 +294,12 @@ export default class AISearch extends Component {
     seafileAPI.aiSearchFiles(queryData, cancelToken).then(res => {
       results = [...results, ...this.formatResultItems(res.data.results)];
       this.setState({
-          resultItems: results,
+        resultItems: results,
-          isResultGetted: true,
+        isResultGetted: true,
-          isLoading: false,
+        isLoading: false,
-          page: page + 1,
+        page: page + 1,
-          hasMore: false,
+        hasMore: false,
-        });
+      });
     }).catch(error => {
       /* eslint-disable */
       console.log(error);

frontend/src/components/seatable-integration-account-setting-widgets/add-seatable-account-setting.js

@@ -66,7 +66,6 @@ class AddSeatableAccountSetting extends Component {
   };
 
   addSeatableAccountSetting = () => {
-    const { t } = this.props;
     let { base_name, seatable_url, seatable_api_token } = this.state;
     base_name = base_name.trim();
     seatable_url = seatable_url.trim();

frontend/src/pages/markdown-editor/index.js

@@ -16,7 +16,7 @@ import '../../css/markdown-viewer/markdown-editor.css';
 const CryptoJS = require('crypto-js');
 const URL = require('url-parse');
 
-const { repoID, filePath, fileName, draftID, isDraft, hasDraft, isLocked, lockedByMe } = window.app.pageOptions;
+const { repoID, filePath, fileName, isDraft, hasDraft, isLocked, lockedByMe } = window.app.pageOptions;
 const { siteRoot, serviceUrl, seafileCollabServer } = window.app.config;
 const userInfo = window.app.userInfo;
 const IMAGE_SUFFIXES = ['png', 'PNG', 'jpg', 'JPG', 'jpeg', 'JPEG', 'gif', 'GIF'];

frontend/src/pages/org-admin/org-users-users.js

@@ -134,7 +134,7 @@ class OrgUsers extends Component {
 
   toggleInviteUserViaWeiXinDialog = () => {
     this.setState({isInviteUserViaWeiXinDialogOpen: !this.state.isInviteUserViaWeiXinDialogOpen});
-  }
+  };
 
   initOrgUsersData = (page) => {
     const { sortBy, sortOrder } = this.state;
@@ -218,13 +218,13 @@ class OrgUsers extends Component {
         orgUsers: users.concat(this.state.orgUsers)
       });
 
-      res.data.success.map(item => {
+      res.data.success.forEach(item => {
         let msg = gettext('successfully sent email to %s.');
         msg = msg.replace('%s', item.email);
         toaster.success(msg);
       });
 
-      res.data.failed.map(item => {
+      res.data.failed.forEach(item => {
         const msg = `${item.email}: ${item.error_msg}`;
         toaster.danger(msg);
       });