diff --git a/frontend/src/components/dir-view-mode/dir-column-file.js b/frontend/src/components/dir-view-mode/dir-column-file.js
index a417ecfa56..c561c52aaa 100644
--- a/frontend/src/components/dir-view-mode/dir-column-file.js
+++ b/frontend/src/components/dir-view-mode/dir-column-file.js
@@ -14,7 +14,7 @@ const propTypes = {
   goDraftPage: PropTypes.func.isRequired,
   isFileLoading: PropTypes.bool.isRequired,
   isFileLoadedErr: PropTypes.bool.isRequired,
-  filePermission: PropTypes.bool,
+  filePermission: PropTypes.string,
   content: PropTypes.string,
   lastModified: PropTypes.string,
   latestContributor: PropTypes.string,
diff --git a/frontend/src/components/dir-view-mode/dir-column-view.js b/frontend/src/components/dir-view-mode/dir-column-view.js
index 130d9ea6f4..21210f2854 100644
--- a/frontend/src/components/dir-view-mode/dir-column-view.js
+++ b/frontend/src/components/dir-view-mode/dir-column-view.js
@@ -32,7 +32,7 @@ const propTypes = {
   isDraft: PropTypes.bool.isRequired,
   hasDraft: PropTypes.bool.isRequired,
   goDraftPage: PropTypes.func.isRequired,
-  filePermission: PropTypes.bool.isRequired,
+  filePermission: PropTypes.string,
   content: PropTypes.string,
   lastModified: PropTypes.string,
   latestContributor: PropTypes.string,
diff --git a/frontend/src/components/file-content-view.js b/frontend/src/components/file-content-view.js
deleted file mode 100644
index a93361bc3e..0000000000
--- a/frontend/src/components/file-content-view.js
+++ /dev/null
@@ -1,132 +0,0 @@
-import React, { Fragment } from 'react';
-import PropTypes from 'prop-types';
-import { Utils } from '../utils/utils';
-import { gettext, siteRoot } from '../utils/constants';
-import { seafileAPI } from '../utils/seafile-api';
-import CommonToolbar from './toolbar/common-toolbar';
-import CurDirPath from './cur-dir-path';
-import WikiMarkdownViewer from './wiki-markdown-viewer';
-
-const propTypes = {
-  pathPrefix: PropTypes.array.isRequired,
-  currentMode: PropTypes.string.isRequired,
-  path: PropTypes.string.isRequired,
-  hash: PropTypes.string,
-  onTabNavClick: PropTypes.func.isRequired,
-  onSideNavMenuClick: PropTypes.func.isRequired,
-  onSearchedClick: PropTypes.func.isRequired,
-  onMainNavBarClick: PropTypes.func.isRequired,
-  repoID: PropTypes.string.isRequired,
-  currentRepoInfo: PropTypes.object,
-  repoPermission: PropTypes.bool,
-  isDraft: PropTypes.bool,
-  hasDraft: PropTypes.bool,
-  goDraftPage: PropTypes.func.isRequired,
-  isFileLoading: PropTypes.bool.isRequired,
-  filePermission: PropTypes.bool,
-  content: PropTypes.string,
-  lastModified: PropTypes.string,
-  latestContributor: PropTypes.string,
-  onLinkClick: PropTypes.func.isRequired,
-};
-
-class FileContentView extends React.Component {
-
-  componentDidMount() {
-    if (this.props.hash) {
-      let hash = this.props.hash;
-      setTimeout(function() {
-        window.location.hash = hash;
-      }, 500);
-    }
-  }
-
-  onEditClick = (e) => {
-    e.preventDefault();
-    let { path, repoID } = this.props;
-    let url = siteRoot + 'lib/' + repoID + '/file' + Utils.encodePath(path) + '?mode=edit';
-    window.open(url);
-  }
-
-  onNewDraft = (e) => {
-    e.preventDefault();
-    let { path, repoID } = this.props;
-    seafileAPI.createDraft(repoID, path).then(res => {
-      window.location.href = siteRoot + 'lib/' + res.data.origin_repo_id + '/file' + res.data.draft_file_path + '?mode=edit';
-    });
-  }
-
-  goDraftPage = (e) => {
-    e.preventDefault();
-    this.props.goDraftPage();
-  }
-  
-  render() {
-    let repoID = this.props.repoID;
-    return (
-      <div className={`main-panel o-hidden ${this.props.currentMode === 'column' ? 'dir-main-content' : ''}`}>
-        <div className="main-panel-north border-left-show">
-          <div className="cur-view-toolbar">
-            <span className="sf2-icon-menu hidden-md-up d-md-none side-nav-toggle" title={gettext('Side Nav Menu')} onClick={this.props.onSideNavMenuClick}></span>
-            <div className="dir-operation">
-              {(this.props.filePermission && !this.props.hasDraft ) && (
-                <Fragment>
-                  <button className="btn btn-secondary operation-item" title={gettext('Edit File')} onClick={this.onEditClick}>{gettext('Edit')}</button>
-                </Fragment>
-              )}
-              {/* default have read priv */}
-              {(!this.props.isDraft && !this.props.hasDraft) && (
-                <button className="btn btn-secondary operation-item" title={gettext('New Draft')} onClick={this.onNewDraft}>{gettext('New Draft')}</button>
-              )}
-            </div>
-          </div>
-          <CommonToolbar repoID={repoID} onSearchedClick={this.props.onSearchedClick} searchPlaceholder={gettext('Search files in this library')}/>
-        </div>
-        <div className="main-panel-center flex-row">
-          <div className="cur-view-container">
-            <div className="cur-view-path">
-              {this.props.currentRepoInfo && (
-                <CurDirPath 
-                  repoID={repoID}
-                  repoName={this.props.currentRepoInfo.repo_name}
-                  pathPrefix={this.props.pathPrefix}
-                  currentPath={this.props.path} 
-                  permission={this.props.repoPermission} 
-                  onPathClick={this.props.onMainNavBarClick}
-                  onTabNavClick={this.props.onTabNavClick}
-                  isViewFile={true}
-                  updateUsedRepoTags={this.props.updateUsedRepoTags}
-                />
-              )}
-            </div>
-            <div className="cur-view-content">
-              <WikiMarkdownViewer
-                isTOCShow={false}
-                isFileLoading={this.props.isFileLoading}
-                markdownContent={this.props.content}
-                lastModified = {this.props.lastModified}
-                latestContributor={this.props.latestContributor}
-                onLinkClick={this.props.onLinkClick}
-              >
-                <Fragment>
-                  {(!this.props.isDraft && this.props.hasDraft) &&
-                    <div className='seafile-btn-view-review text-center'>
-                      <div className='tag tag-green'>
-                        {gettext('This file is in draft stage.')}
-                        <span className="ml-2" onClick={this.goDraftPage}>{gettext('View Draft')}</span>
-                      </div>
-                    </div>
-                  }
-                </Fragment>
-              </WikiMarkdownViewer>
-            </div>
-          </div>
-        </div>
-      </div>
-    )
-  }
-}
-
-FileContentView.propTypes = propTypes;
-
-export default FileContentView;
diff --git a/frontend/src/components/toolbar/view-file-toolbar.js b/frontend/src/components/toolbar/view-file-toolbar.js
index 8efad4b5e3..f636d6e557 100644
--- a/frontend/src/components/toolbar/view-file-toolbar.js
+++ b/frontend/src/components/toolbar/view-file-toolbar.js
@@ -16,7 +16,7 @@ const propTypes = {
   repoEncrypted: PropTypes.bool.isRequired,
   enableDirPrivateShare: PropTypes.bool.isRequired,
   isGroupOwnedRepo: PropTypes.bool.isRequired,
-  filePermission: PropTypes.bool.isRequired,
+  filePermission: PropTypes.string,
   isDraft: PropTypes.bool.isRequired,
   hasDraft: PropTypes.bool.isRequired,
   fileTags: PropTypes.array.isRequired,
@@ -85,26 +85,25 @@ class ViewFileToolbar extends React.Component {
   }
 
   render() {
-
+    let { filePermission } = this.props;
     let name = Utils.getFileName(this.props.path);
     let dirent = { name: name };
 
     return (
       <Fragment>
         <div className="dir-operation">
-          {(this.props.filePermission && !this.props.hasDraft) && (
+          {((filePermission === 'rw' || filePermission === 'cloud-edit') && !this.props.hasDraft) && (
             <Fragment>
               <button className="btn btn-secondary operation-item" title={gettext('Edit File')} onClick={this.onEditClick}>{gettext('Edit')}</button>
             </Fragment>
           )}
-          {/* default have read priv */}
-          {(!this.props.isDraft && !this.props.hasDraft) && (
+          {(filePermission === 'rw' && !this.props.isDraft && !this.props.hasDraft) && (
             <Fragment>
               <button id="new-draft" className="btn btn-secondary operation-item" onClick={this.onNewDraft}>{gettext('New Draft')}</button>
               <Tooltip target="new-draft" placement="bottom" isOpen={this.state.isDraftMessageShow} toggle={this.onDraftHover}>{gettext('Create a draft from this file, instead of editing it directly.')}</Tooltip>
             </Fragment>
           )}
-          {this.props.filePermission && (
+          {filePermission === 'rw' && (
             <Dropdown isOpen={this.state.isMoreMenuShow} toggle={this.toggleMore}>
               <DropdownToggle className='btn btn-secondary operation-item'>
                 {gettext('More')}
diff --git a/frontend/src/pages/lib-content-view/lib-content-container.js b/frontend/src/pages/lib-content-view/lib-content-container.js
index 9b8b835d64..0acb258977 100644
--- a/frontend/src/pages/lib-content-view/lib-content-container.js
+++ b/frontend/src/pages/lib-content-view/lib-content-container.js
@@ -34,7 +34,7 @@ const propTypes = {
   fileTags: PropTypes.array.isRequired,
   goDraftPage: PropTypes.func.isRequired,
   isFileLoading: PropTypes.bool.isRequired,
-  filePermission: PropTypes.bool.isRequired,
+  filePermission: PropTypes.string,
   content: PropTypes.string,
   lastModified: PropTypes.string,
   latestContributor: PropTypes.string,
diff --git a/frontend/src/pages/lib-content-view/lib-content-toolbar.js b/frontend/src/pages/lib-content-view/lib-content-toolbar.js
index b5b69c0bd4..1bda24b038 100644
--- a/frontend/src/pages/lib-content-view/lib-content-toolbar.js
+++ b/frontend/src/pages/lib-content-view/lib-content-toolbar.js
@@ -9,7 +9,7 @@ import ViewFileToolbar from '../../components/toolbar/view-file-toolbar';
 
 const propTypes = {
   isViewFile: PropTypes.bool.isRequired,
-  filePermission: PropTypes.bool.isRequired, // ture = 'rw'
+  filePermission: PropTypes.string,
   isDraft: PropTypes.bool.isRequired,
   hasDraft: PropTypes.bool.isRequired,
   fileTags: PropTypes.array.isRequired,
diff --git a/frontend/src/pages/lib-content-view/lib-content-view.js b/frontend/src/pages/lib-content-view/lib-content-view.js
index f177c120e8..44b29754f0 100644
--- a/frontend/src/pages/lib-content-view/lib-content-view.js
+++ b/frontend/src/pages/lib-content-view/lib-content-view.js
@@ -57,7 +57,7 @@ class LibContentView extends React.Component {
       currentNode: null,
       isFileLoading: true,
       isFileLoadedErr: false,
-      filePermission: true,
+      filePermission: '',
       content: '',
       lastModified: '',
       latestContributor: '',
@@ -352,7 +352,7 @@ class LibContentView extends React.Component {
         seafileAPI.getFileContent(res.data).then((res) => {
           this.setState({
             content: res.data,
-            filePermission: permission === 'rw' || permission === 'cloud-edit',
+            filePermission: permission,
             latestContributor: last_modifier_name,
             lastModified: moment.unix(mtime).fromNow(),
             isFileLoading: false,