diff --git a/frontend/src/components/common/notice-item.js b/frontend/src/components/common/notice-item.js
index 75afcec786..0722840990 100644
--- a/frontend/src/components/common/notice-item.js
+++ b/frontend/src/components/common/notice-item.js
@@ -210,7 +210,7 @@ class NoticeItem extends React.Component {
       <li onClick={this.onNoticeItemClick} className={noticeItem.seen ? 'read' : 'unread'}>
         <div className="notice-item">
           <div className="main-info">
-            <img src={avatar_url} width="32" height="32" className="avatar" />
+            <img src={avatar_url} width="32" height="32" className="avatar" alt=""/>
             <p className="brief" dangerouslySetInnerHTML={{__html: notice}}></p>
           </div>
           <p className="time">{moment(noticeItem.time).fromNow()}</p>
diff --git a/frontend/src/components/context-menu/actions.js b/frontend/src/components/context-menu/actions.js
index 19ed703abe..4fbca00514 100644
--- a/frontend/src/components/context-menu/actions.js
+++ b/frontend/src/components/context-menu/actions.js
@@ -7,7 +7,7 @@ export const MENU_HIDE = 'REACT_CONTEXTMENU_HIDE';
 
 
 export function dispatchGlobalEvent(eventName, opts, target = window) {
-	// Compatibale with IE
+  // Compatibale with IE
   // @see http://stackoverflow.com/questions/26596123/internet-explorer-9-10-11-event-constructor-doesnt-work
   let event;
 
diff --git a/frontend/src/components/dialog/change-repo-password-dialog.js b/frontend/src/components/dialog/change-repo-password-dialog.js
index 6284452924..4f1b946a29 100644
--- a/frontend/src/components/dialog/change-repo-password-dialog.js
+++ b/frontend/src/components/dialog/change-repo-password-dialog.js
@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Modal, ModalHeader, ModalBody, ModalFooter, Alert } from 'reactstrap'; 
 import { gettext, repoPasswordMinLength } from '../../utils/constants';
@@ -79,30 +79,30 @@ class ChangeRepoPasswordDialog extends React.Component {
       submitBtnDisabled: true  
     });
     seafileAPI.changeEncryptedRepoPassword(this.props.repoID, oldPassword, newPassword)
-    .then(() => {
-      this.props.toggleDialog();
-      toaster.success(gettext('Successfully changed library password.'));
-    }).catch((error) => {
-      let errorMsg = '';
-      if (error.response) {
-        if (error.response.data) {
+      .then(() => {
+        this.props.toggleDialog();
+        toaster.success(gettext('Successfully changed library password.'));
+      }).catch((error) => {
+        let errorMsg = '';
+        if (error.response) {
+          if (error.response.data) {
             errorMsg = error.response.data.error_msg;
-        } else {
+          } else {
             errorMsg = gettext('Error');
-        }   
-      } else {
+          }   
+        } else {
           errorMsg = gettext('Please check the network.');
-      }   
-      this.setState({
-        errorMsg: errorMsg,
-        submitBtnDisabled: false
-      }); 
-    });
+        }   
+        this.setState({
+          errorMsg: errorMsg,
+          submitBtnDisabled: false
+        }); 
+      });
   }
 
 
   render() {
-    const { repoID, repoName, toggleDialog } = this.props;
+    const { repoName, toggleDialog } = this.props;
 
     return (
       <Modal isOpen={true} centered={true} style={{height: 'auto'}}>
@@ -121,7 +121,7 @@ class ChangeRepoPasswordDialog extends React.Component {
           </form>
         </ModalBody>
         <ModalFooter>
-            <button className="btn btn-primary" disabled={this.state.submitBtnDisabled} onClick={this.formSubmit}>{gettext('Submit')}</button>
+          <button className="btn btn-primary" disabled={this.state.submitBtnDisabled} onClick={this.formSubmit}>{gettext('Submit')}</button>
         </ModalFooter>
       </Modal>
     );
diff --git a/frontend/src/components/file-chooser/repo-list-item.js b/frontend/src/components/file-chooser/repo-list-item.js
index bd9fa2f1cb..8b00924cea 100644
--- a/frontend/src/components/file-chooser/repo-list-item.js
+++ b/frontend/src/components/file-chooser/repo-list-item.js
@@ -162,7 +162,7 @@ class RepoListItem extends React.Component {
               <span className="icon far fa-folder tree-node-icon"></span> 
             </i>
           </div>
-         </div>
+        </div>
         {this.state.isShowChildren && (
           <TreeListView 
             repo={this.props.repo} 
diff --git a/frontend/src/components/file-chooser/tree-list-item.js b/frontend/src/components/file-chooser/tree-list-item.js
index 1a2a99eb9d..bc5ccc1e9a 100644
--- a/frontend/src/components/file-chooser/tree-list-item.js
+++ b/frontend/src/components/file-chooser/tree-list-item.js
@@ -90,19 +90,19 @@ class TreeViewItem extends React.Component {
       <div className="file-chooser-item">
         <div className={`${node.path === '/'? 'hide': ''}`}>
           <div className={`${(isCurrentRepo && isCurrentPath) ? 'item-active' : ''} item-info`} onClick={this.onItemClick}>
-          <div className="item-text">
-            <span className="name user-select-none ellipsis">{node.object && node.object.name}</span>
+            <div className="item-text">
+              <span className="name user-select-none ellipsis">{node.object && node.object.name}</span>
+            </div>
+            <div className="item-left-icon">
+              {
+                node.object.type !== 'file' &&
+                <span className={`icon item-toggle fa ${node.isExpanded ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
+              }
+              <i className="tree-node-icon">
+                <span className={`icon far ${node.object.type === 'dir' ? 'fa-folder' : 'fa-file'}`}></span>
+              </i>
+            </div>
           </div>
-          <div className="item-left-icon">
-          {
-            node.object.type !== 'file' &&
-            <span className={`icon item-toggle fa ${node.isExpanded ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
-          }
-            <i className="tree-node-icon">
-              <span className={`icon far ${node.object.type === 'dir' ? 'fa-folder' : 'fa-file'}`}></span>
-            </i>
-          </div>
-         </div>
         </div>
         {node.isExpanded && this.renderChildren()}
       </div>
diff --git a/frontend/src/components/main-side-nav.js b/frontend/src/components/main-side-nav.js
index 1c6cd0ac78..d2843e2ccd 100644
--- a/frontend/src/components/main-side-nav.js
+++ b/frontend/src/components/main-side-nav.js
@@ -224,7 +224,7 @@ class MainSideNav extends React.Component {
               </Link>
             </li>
             {canInvitePeople &&
-                <li className="nav-item">
+              <li className="nav-item">
                 <Link className={`nav-link ellipsis ${this.getActiveClass('invitations')}`} to={siteRoot + 'invitations/'} title={gettext('Invite People')} onClick={() => this.tabItemClick('invitations')}>
                   <span className="sf2-icon-invite" aria-hidden="true"></span>
                   <span className="nav-text">{gettext('Invite People')}</span>
diff --git a/frontend/src/components/wiki-markdown-viewer.js b/frontend/src/components/wiki-markdown-viewer.js
index a6cc0c4103..1dfca1aa27 100644
--- a/frontend/src/components/wiki-markdown-viewer.js
+++ b/frontend/src/components/wiki-markdown-viewer.js
@@ -235,7 +235,7 @@ class WikiMarkdownViewer extends React.Component {
       return <Loading />;
     }
     // In dir-column-file repoID is one of props, width is 100%; In wiki-viewer repoID is not props, width isn't 100%
-    let contentClassName = `${this.props.repoID ? contentClass + ' w-100' : contentClass}`
+    let contentClassName = `${this.props.repoID ? contentClass + ' w-100' : contentClass}`;
     return (
       <div ref={this.markdownContainer} className="wiki-page-container" onScroll={this.onScrollHandler.bind(this)}>
         <div className={contentClassName}>
diff --git a/frontend/src/pages/data-grid/app-main.js b/frontend/src/pages/data-grid/app-main.js
index 18c02a54e4..1510ddedf5 100644
--- a/frontend/src/pages/data-grid/app-main.js
+++ b/frontend/src/pages/data-grid/app-main.js
@@ -23,7 +23,7 @@ const DEFAULT_DATA = {
     }
   ],
   rows:  [{name: 'name_' + 0}]
-}
+};
 
 class AppMain extends React.Component {
 
diff --git a/frontend/src/pages/groups/group-view.js b/frontend/src/pages/groups/group-view.js
index 28a293a584..d7c2e3359e 100644
--- a/frontend/src/pages/groups/group-view.js
+++ b/frontend/src/pages/groups/group-view.js
@@ -222,11 +222,11 @@ class GroupView extends React.Component {
       });
       this.setState({repoList: repoList});
       let name = repo.repo_name;
-      var msg = gettext("Successfully deleted {name}.").replace('{name}', name);
+      var msg = gettext('Successfully deleted {name}.').replace('{name}', name);
       toaster.success(msg);
     }).catch(() => {
       let name = repo.repo_name;
-      var msg = gettext("Failed to delete {name}.").replace('{name}', name);
+      var msg = gettext('Failed to delete {name}.').replace('{name}', name);
       toaster.danger(msg);
     });
   }
diff --git a/frontend/src/pages/my-libs/mylib-repo-list-item.js b/frontend/src/pages/my-libs/mylib-repo-list-item.js
index 7f0b5032de..d26ecc26ca 100644
--- a/frontend/src/pages/my-libs/mylib-repo-list-item.js
+++ b/frontend/src/pages/my-libs/mylib-repo-list-item.js
@@ -196,11 +196,11 @@ class MylibRepoListItem extends React.Component {
     seafileAPI.deleteRepo(repo.repo_id).then((res) => {
       this.props.onDeleteRepo(repo);
       let name = repo.repo_name;
-      var msg = gettext("Successfully deleted {name}.").replace('{name}', name);
+      var msg = gettext('Successfully deleted {name}.').replace('{name}', name);
       toaster.success(msg);
     }).catch(() => {
       let name = repo.repo_name;
-      var msg = gettext("Failed to delete {name}.").replace('{name}', name);
+      var msg = gettext('Failed to delete {name}.').replace('{name}', name);
       toaster.danger(msg);
     });
   }
diff --git a/frontend/src/pages/share-admin/share-links.js b/frontend/src/pages/share-admin/share-links.js
index 56ea38a54d..c8c0e1a49e 100644
--- a/frontend/src/pages/share-admin/share-links.js
+++ b/frontend/src/pages/share-admin/share-links.js
@@ -27,7 +27,7 @@ class Content extends Component {
     this.props.sortItems(sortBy, sortOrder);
   }
 
- constructor(props) {
+  constructor(props) {
     super(props);
     this.state = {
       modalOpen: false,
@@ -121,7 +121,7 @@ class Item extends Component {
   constructor(props) {
     super(props);
 
-    let item = this.props.item
+    let item = this.props.item;
     this.state = {
       currentPermission: item.permissions.can_download ? 'Preview and download' : 'Preview only',
       showOpIcon: false,
@@ -210,7 +210,7 @@ class Item extends Component {
     let deleteIconClassName = 'sf2-icon-delete action-icon' + iconVisibility;
     return (
       <tr onMouseEnter={this.handleMouseOver} onMouseLeave={this.handleMouseOut}>
-        <td><img src={iconUrl} width="24" /></td>
+        <td><img src={iconUrl} width="24" alt=""/></td>
         <td>
           {item.is_dir ?
             <Link to={linkUrl}>{item.obj_name}</Link> :
diff --git a/frontend/src/pages/shared-libs/shared-libs.js b/frontend/src/pages/shared-libs/shared-libs.js
index 3af004ca42..43faadba6e 100644
--- a/frontend/src/pages/shared-libs/shared-libs.js
+++ b/frontend/src/pages/shared-libs/shared-libs.js
@@ -180,7 +180,7 @@ class Item extends Component {
       });
       // TODO: show feedback msg
     }).catch((error) => {
-        // TODO: show feedback msg
+      // TODO: show feedback msg
     });
   }
 
@@ -196,7 +196,7 @@ class Item extends Component {
     } else {
       seafileAPI.starItem(this.props.data.repo_id, '/').then(() => {
         this.setState({isStarred: !this.state.isStarred});
-      })
+      });
     }
   }
 
@@ -266,7 +266,7 @@ class Item extends Component {
             {(isPro && data.is_admin) &&
               <a href="#" className={shareIconClassName} title={gettext('Share')} onClick={this.share}></a>
             }
-            <a href="#" className={leaveShareIconClassName} title={gettext("Leave Share")} onClick={this.leaveShare}></a>
+            <a href="#" className={leaveShareIconClassName} title={gettext('Leave Share')} onClick={this.leaveShare}></a>
           </td>
         </tr>
         {this.state.isShowSharedDialog && (
diff --git a/frontend/src/pages/sys-admin/index.js b/frontend/src/pages/sys-admin/index.js
index 5b0263de7e..49bfe21a91 100644
--- a/frontend/src/pages/sys-admin/index.js
+++ b/frontend/src/pages/sys-admin/index.js
@@ -1,11 +1,11 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Router } from '@reach/router';
-import { siteRoot, gettext } from '../../utils/constants';
+import { siteRoot } from '../../utils/constants';
 import SidePanel from './side-panel';
 import MainPanel from './main-panel';
 import FileScanRecords from './file-scan-records';
-import WorkWeixinDepartments from './work-weixin-departments'
+import WorkWeixinDepartments from './work-weixin-departments';
 
 import '../../assets/css/fa-solid.css';
 import '../../assets/css/fa-regular.css';
diff --git a/frontend/src/pages/sys-admin/work-weixin-departments.js b/frontend/src/pages/sys-admin/work-weixin-departments.js
index b313a96108..d7383023b9 100644
--- a/frontend/src/pages/sys-admin/work-weixin-departments.js
+++ b/frontend/src/pages/sys-admin/work-weixin-departments.js
@@ -231,8 +231,8 @@ class WorkWeixinDepartments extends Component {
       <div className="main-panel-north border-left-show">
         <div className="cur-view-toolbar">
           <span className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none" title="Side Nav Menu"></span>
-          <Button className={btnClass + "my-1 d-md-none"} onClick={this.onSubmit}>{'导入用户'}</Button>
-          <Button className={btnClass + "hidden-md-up"} onClick={this.onSubmit}>{'导入用户'}</Button>
+          <Button className={btnClass + 'my-1 d-md-none'} onClick={this.onSubmit}>{'导入用户'}</Button>
+          <Button className={btnClass + 'hidden-md-up'} onClick={this.onSubmit}>{'导入用户'}</Button>
         </div>
         <div className="common-toolbar">
           <Account isAdminPanel={true}/>
diff --git a/frontend/src/pages/sys-admin/work-weixin/work-weixin-department-members-list.js b/frontend/src/pages/sys-admin/work-weixin/work-weixin-department-members-list.js
index 9999583a22..afefbdc030 100644
--- a/frontend/src/pages/sys-admin/work-weixin/work-weixin-department-members-list.js
+++ b/frontend/src/pages/sys-admin/work-weixin/work-weixin-department-members-list.js
@@ -70,7 +70,7 @@ class WorkWeixinDepartmentMembersList extends Component {
         }
         {!isMembersListLoading && this.props.membersList.length === 0 &&
           <div className="message empty-tip text-center">
-            <img src={`${siteRoot}media/img/member-list-empty-2x.png`}/>
+            <img src={`${siteRoot}media/img/member-list-empty-2x.png`} alt=""/>
             <h4>{'成员列表为空'}</h4>
           </div>
         }
diff --git a/frontend/src/pages/sys-admin/work-weixin/work-weixin-departments-tree-node.js b/frontend/src/pages/sys-admin/work-weixin/work-weixin-departments-tree-node.js
index 5ebeecb2a7..1d54a8c3b4 100644
--- a/frontend/src/pages/sys-admin/work-weixin/work-weixin-departments-tree-node.js
+++ b/frontend/src/pages/sys-admin/work-weixin/work-weixin-departments-tree-node.js
@@ -55,7 +55,7 @@ class WorkWeixinDepartmentsTreeNode extends Component {
     let toggleClass = classNames({
       'folder-toggle-icon fa fa-caret-down': department.children && this.state.isChildrenShow,
       'folder-toggle-icon fa fa-caret-right': department.children && !this.state.isChildrenShow,
-    })
+    });
     let nodeInnerClass = classNames({
       'tree-node-inner': true,
       'tree-node-hight-light': checkedDepartmentId === department.id