@@ -160,25 +129,23 @@ class DirentDetail extends React.Component {
renderDetailBody = (bigIconUrl, folderDirent) => {
const { dirent, fileTags } = this.props;
return (
-
-
-
- {this.state.direntDetail &&
-
-
-
- }
-
+
+
+ {this.state.direntDetail &&
+
+
+
+ }
+
);
};
@@ -196,33 +163,12 @@ class DirentDetail extends React.Component {
bigIconUrl = `${siteRoot}thumbnail/${repoID}/1024` + Utils.encodePath(`${path === '/' ? '' : path}/${dirent.name}`);
}
let direntName = dirent ? dirent.name : folderDirent.name;
-
- if ((dirent && dirent.type === 'file') || path.lastIndexOf('.') > -1) {
- return (
-
- {this.renderHeader(smallIconUrl, direntName)}
-
-
- {this.renderDetailBody(bigIconUrl, folderDirent)}
-
-
-
-
-
- );
- } else {
- return (
-
- {this.renderHeader(smallIconUrl, direntName)}
- {this.renderDetailBody(bigIconUrl, folderDirent)}
-
- );
- }
+ return (
+
+ {this.renderHeader(smallIconUrl, direntName)}
+ {this.renderDetailBody(bigIconUrl, folderDirent)}
+
+ );
}
}
diff --git a/frontend/src/components/dirent-grid-view/dirent-grid-view.js b/frontend/src/components/dirent-grid-view/dirent-grid-view.js
index c9be322c9b..7a0c19bfb5 100644
--- a/frontend/src/components/dirent-grid-view/dirent-grid-view.js
+++ b/frontend/src/components/dirent-grid-view/dirent-grid-view.js
@@ -166,9 +166,6 @@ class DirentGridView extends React.Component {
case 'Unmark as draft':
this.onUnmarkAsDraft(currentObject);
break;
- case 'Comment':
- this.onCommentItem();
- break;
case 'History':
this.onHistory(currentObject);
break;
@@ -303,10 +300,6 @@ class DirentGridView extends React.Component {
});
};
- onCommentItem = () => {
- this.props.showDirentDetail('comments');
- };
-
onHistory = (currentObject) => {
let repoID = this.props.repoID;
let filePath = this.getDirentPath(currentObject);
diff --git a/frontend/src/components/dirent-list-view/dirent-list-item.js b/frontend/src/components/dirent-list-view/dirent-list-item.js
index f7dba7e5d0..9042105489 100644
--- a/frontend/src/components/dirent-list-view/dirent-list-item.js
+++ b/frontend/src/components/dirent-list-view/dirent-list-item.js
@@ -281,10 +281,6 @@ class DirentListItem extends React.Component {
case 'Unmark as draft':
this.onUnmarkAsDraft();
break;
- case 'Comment':
- this.props.onDirentClick(this.props.dirent);
- this.props.showDirentDetail('comments');
- break;
case 'History':
this.onHistory();
break;
diff --git a/frontend/src/components/file-view/comment-panel.js b/frontend/src/components/file-view/comment-panel.js
deleted file mode 100644
index 135c8440a6..0000000000
--- a/frontend/src/components/file-view/comment-panel.js
+++ /dev/null
@@ -1,355 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import moment from 'moment';
-import { processor } from '@seafile/seafile-editor';
-import { Button, Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';
-import { gettext } from '../../utils/constants';
-import { seafileAPI } from '../../utils/seafile-api';
-import { Utils } from '../../utils/utils';
-import toaster from '../toast';
-import { MentionsInput, Mention } from 'react-mentions';
-import { defaultStyle, defaultMentionStyle } from '../../css/react-mentions-default-style';
-
-import '../../css/comments-list.css';
-
-const { username, repoID, filePath } = window.app.pageOptions;
-
-const CommentPanelPropTypes = {
- toggleCommentPanel: PropTypes.func.isRequired,
- commentsNumber: PropTypes.number,
- participants: PropTypes.array,
- onParticipantsChange: PropTypes.func,
-};
-
-class CommentPanel extends React.Component {
-
- constructor(props) {
- super(props);
- this.state = {
- commentsList: [],
- showResolvedComment: true,
- participants: null,
- relatedUsers: null,
- comment: '',
- };
- this.toBeAddedParticipant = [];
- }
-
- listComments = () => {
- seafileAPI.listComments(repoID, filePath).then((res) => {
- this.setState({
- commentsList: res.data.comments
- });
- }).catch(error => {
- let errMessage = Utils.getErrorMsg(error);
- toaster.danger(errMessage);
- });
- };
-
- listRepoRelatedUsers = () => {
- seafileAPI.listRepoRelatedUsers(repoID).then((res) => {
- let users = res.data.user_list.map((item) => {
- return { id: item.email, display: item.name};
- });
- this.setState({ relatedUsers: users });
- });
- };
-
- handleCommentChange = (event) => {
- this.setState({ comment: event.target.value });
- };
-
- addComment = () => {
- if (!this.state.comment.trim()) return;
- seafileAPI.postComment(repoID, filePath, this.state.comment.trim()).then(() => {
- this.listComments();
- }).catch(err => {
- toaster.danger(Utils.getErrorMsg(err));
- });
- this.setState({ comment: '' });
- };
-
- onSubmit = () => {
- this.addParticipant(username);
- if (this.toBeAddedParticipant.length === 0) {
- this.addComment();
- } else {
- seafileAPI.addFileParticipants(repoID, filePath, this.toBeAddedParticipant).then((res) => {
- this.onParticipantsChange(repoID, filePath);
- this.toBeAddedParticipant = [];
- this.addComment();
- }).catch((err) => {
- toaster.danger(Utils.getErrorMsg(err));
- });
- }
- };
-
- resolveComment = (event) => {
- seafileAPI.updateComment(repoID, event.target.id, 'true').then(() => {
- this.listComments();
- }).catch(error => {
- let errMessage = Utils.getErrorMsg(error);
- toaster.danger(errMessage);
- });
- };
-
- deleteComment = (event) => {
- seafileAPI.deleteComment(repoID, event.target.id).then(() => {
- this.listComments();
- }).catch(error => {
- let errMessage = Utils.getErrorMsg(error);
- toaster.danger(errMessage);
- });
- };
-
- editComment = (commentID, newComment) => {
- seafileAPI.updateComment(repoID, commentID, null, null, newComment).then((res) => {
- this.listComments();
- }).catch(error => {
- let errMessage = Utils.getErrorMsg(error);
- toaster.danger(errMessage);
- });
- };
-
- onParticipantsChange = () => {
- if (this.props.onParticipantsChange) {
- this.props.onParticipantsChange();
- } else {
- this.getParticipants();
- }
- };
-
- getParticipants = () => {
- if (this.props.participants) {
- this.setState({ participants: this.props.participants });
- } else {
- seafileAPI.listFileParticipants(repoID, filePath).then((res) => {
- this.setState({ participants: res.data.participant_list });
- });
- }
- };
-
- checkParticipant = (email) => {
- return this.state.participants.map((participant) => {return participant.email;}).includes(email);
- };
-
- addParticipant = (email) => {
- if (this.checkParticipant(email)) return;
- this.toBeAddedParticipant.push(email);
- };
-
- renderUserSuggestion = (entry, search, highlightedDisplay, index, focused) => {
- return
{highlightedDisplay}
;
- };
-
- componentDidMount() {
- this.listComments();
- this.getParticipants();
- this.listRepoRelatedUsers();
- }
-
- componentWillReceiveProps(nextProps) {
- if (this.props.commentsNumber !== nextProps.commentsNumber) {
- this.listComments();
- }
- if (this.props.participants !== nextProps.participants) {
- this.setState({ participants: nextProps.participants });
- }
- }
-
- render() {
- const { commentsList } = this.state;
- return (
-
-
-
-
-
-
{gettext('Comments')}
-
-
- {commentsList.length > 0 ? (
-
- {commentsList.map((item, index = 0, arr) => {
- let oldTime = (new Date(item.created_at)).getTime();
- let time = moment(oldTime).format('YYYY-MM-DD HH:mm');
- return (
-
- );
- })}
-
) :
-
{gettext('No comment yet.')}
- }
-
-
-
- `@${display}`}
- data={this.state.relatedUsers}
- renderSuggestion={this.renderUserSuggestion}
- style={defaultMentionStyle}
- onAdd={(id, display) => {this.addParticipant(id);}}
- appendSpaceOnAdd={true}
- />
-
-
-
-
-
-
- );
- }
-}
-
-CommentPanel.propTypes = CommentPanelPropTypes;
-
-
-const commentItemPropTypes = {
- time: PropTypes.string.isRequired,
- item: PropTypes.object.isRequired,
- deleteComment: PropTypes.func.isRequired,
- resolveComment: PropTypes.func.isRequired,
- showResolvedComment: PropTypes.bool.isRequired,
- editComment: PropTypes.func.isRequired,
-};
-
-class CommentItem extends React.Component {
-
- constructor(props) {
- super(props);
- this.state = {
- dropdownOpen: false,
- html: '',
- newComment: this.props.item.comment,
- editable: false,
- };
- }
-
- toggleDropDownMenu = () => {
- this.setState({
- dropdownOpen: !this.state.dropdownOpen,
- });
- };
-
- convertComment = (mdFile) => {
- processor.process(mdFile).then((result) => {
- let html = String(result);
- this.setState({ html: html });
- });
- };
-
- toggleEditComment = () => {
- this.setState({
- editable: !this.state.editable
- });
- };
-
- updateComment = (event) => {
- const newComment = this.state.newComment;
- if (this.props.item.comment !== newComment) {
- this.props.editComment(event.target.id, newComment);
- }
- this.toggleEditComment();
- };
-
- handleCommentChange = (event) => {
- this.setState({
- newComment: event.target.value,
- });
- };
-
- onCommentClick = (e) => {
- // click participant link, page shouldn't jump
- if (e.target.nodeName !== 'A') return;
- const preNode = e.target.previousSibling;
- if (preNode && preNode.nodeType === 3 && preNode.nodeValue.slice(-1) === '@') {
- e.preventDefault();
- }
- };
-
- componentWillMount() {
- this.convertComment(this.props.item.comment);
- }
-
- componentWillReceiveProps(nextProps) {
- this.convertComment(nextProps.item.comment);
- }
-
- render() {
- const item = this.props.item;
- if (item.resolved && !this.props.showResolvedComment) {
- return null;
- }
- if (this.state.editable) {
- return(
-
-
-
-
-
{item.user_name}
-
{this.props.time}
-
-
-
- {' '}
-
-
-
- );
- }
- return (
-
-
-
-
-
{item.user_name}
-
{this.props.time}
-
-
-
-
-
-
- {(item.user_email === username) &&
- {gettext('Delete')}}
- {(item.user_email === username) &&
- {gettext('Edit')}
- }
- {!item.resolved &&
- {gettext('Mark as resolved')}
- }
-
-
-
this.onCommentClick(e)}
- >
-
- );
- }
-}
-
-CommentItem.propTypes = commentItemPropTypes;
-
-export default CommentPanel;
diff --git a/frontend/src/components/file-view/file-toolbar.js b/frontend/src/components/file-view/file-toolbar.js
index 17af52b69c..99f2a879c8 100644
--- a/frontend/src/components/file-view/file-toolbar.js
+++ b/frontend/src/components/file-view/file-toolbar.js
@@ -16,7 +16,6 @@ const propTypes = {
isSaving: PropTypes.bool,
needSave: PropTypes.bool,
toggleLockFile: PropTypes.func.isRequired,
- toggleCommentPanel: PropTypes.func.isRequired,
toggleDetailsPanel: PropTypes.func.isRequired
};
@@ -27,7 +26,7 @@ const {
fileName,
canEditFile, err,
// fileEnc, // for 'edit', not undefined only for some kinds of files (e.g. text file)
- canDownloadFile, enableComment
+ canDownloadFile,
} = window.app.pageOptions;
class FileToolbar extends React.Component {
@@ -106,12 +105,10 @@ class FileToolbar extends React.Component {
showShareBtn = true;
}
- let canComment = enableComment;
const { isCustomPermission, customPermission } = this;
if (isCustomPermission) {
const { download_external_link } = customPermission.permission;
showShareBtn = download_external_link;
- canComment = false;
}
return (
@@ -196,11 +193,6 @@ class FileToolbar extends React.Component {
- {canComment && (
-
- {gettext('Comment')}
-
- )}
{filePerm == 'rw' && (
{gettext('History')}
@@ -264,11 +256,6 @@ class FileToolbar extends React.Component {
)}
- {canComment && (
-
- {gettext('Comment')}
-
- )}
{gettext('Details')}
diff --git a/frontend/src/components/file-view/file-view.js b/frontend/src/components/file-view/file-view.js
index 4a2ae05a1a..7267363290 100644
--- a/frontend/src/components/file-view/file-view.js
+++ b/frontend/src/components/file-view/file-view.js
@@ -7,7 +7,6 @@ import { Utils } from '../../utils/utils';
import toaster from '../toast';
import FileInfo from './file-info';
import FileToolbar from './file-toolbar';
-import CommentPanel from './comment-panel';
import FileDetails from '../dirent-detail/file-details';
import '../../css/file-view.css';
@@ -35,7 +34,6 @@ class FileView extends React.Component {
isStarred: isStarred,
isLocked: isLocked,
lockedByMe: lockedByMe,
- isCommentPanelOpen: false,
isDetailsPanelOpen: false
};
}
@@ -44,12 +42,6 @@ class FileView extends React.Component {
this.setState({isDetailsPanelOpen: !this.state.isDetailsPanelOpen});
};
- toggleCommentPanel = () => {
- this.setState({
- isCommentPanelOpen: !this.state.isCommentPanelOpen
- });
- };
-
toggleStar = () => {
if (this.state.isStarred) {
seafileAPI.unstarItem(repoID, filePath).then((res) => {
@@ -113,19 +105,11 @@ class FileView extends React.Component {
isSaving={this.props.isSaving}
needSave={this.props.needSave}
toggleLockFile={this.toggleLockFile}
- toggleCommentPanel={this.toggleCommentPanel}
toggleDetailsPanel={this.toggleDetailsPanel}
/>