diff --git a/frontend/src/components/file-view/comment-panel.js b/frontend/src/components/file-view/comment-panel.js
index f0192f3833..9bf0aec521 100644
--- a/frontend/src/components/file-view/comment-panel.js
+++ b/frontend/src/components/file-view/comment-panel.js
@@ -32,6 +32,12 @@ class CommentPanel extends React.Component {
this.toBeAddedParticipant = [];
}
+ forceUpdate = () => {
+ this.listComments();
+ this.getParticipants();
+ this.listRepoRelatedUsers();
+ };
+
listComments = () => {
seafileAPI.listComments(repoID, fileUuid).then((res) => {
this.setState({
diff --git a/frontend/src/components/file-view/file-toolbar.js b/frontend/src/components/file-view/file-toolbar.js
index 905a6cb3a5..1de5476f38 100644
--- a/frontend/src/components/file-view/file-toolbar.js
+++ b/frontend/src/components/file-view/file-toolbar.js
@@ -22,7 +22,8 @@ const propTypes = {
toggleCommentPanel: PropTypes.func.isRequired,
toggleDetailsPanel: PropTypes.func.isRequired,
setImageScale: PropTypes.func,
- rotateImage: PropTypes.func
+ rotateImage: PropTypes.func,
+ isCommentUpdated: PropTypes.bool,
};
const {
@@ -103,7 +104,7 @@ class FileToolbar extends React.Component {
const { moreDropdownOpen } = this.state;
- const { isLocked, lockedByMe } = this.props;
+ const { isLocked, lockedByMe, isCommentUpdated } = this.props;
let showLockUnlockBtn = false;
let lockUnlockText; let lockUnlockIcon;
if (canLockUnlockFile) {
@@ -214,6 +215,7 @@ class FileToolbar extends React.Component {
aria-label={gettext('Comment')}
>
+ {isCommentUpdated && }
{showShareBtn && (
{
+ const { type, content } = data;
+ if (type === 'comment-update') {
+ const { repo_id, file_uuid } = content;
+ if (repoID === repo_id && file_uuid === fileUuid) {
+ if (!this.state.isCommentPanelOpen) {
+ this.setState({ isCommentUpdated: true });
+ } else {
+ this.commentPanelRef.forceUpdate();
+ }
+ }
+ }
+ };
+
toggleCommentPanel = () => {
this.setState({
isCommentPanelOpen: !this.state.isCommentPanelOpen,
isDetailsPanelOpen: false,
+ isCommentUpdated: false,
});
};
@@ -121,6 +140,10 @@ class FileView extends React.Component {
});
};
+ setCommentPanelRef = (ref) => {
+ this.commentPanelRef = ref;
+ };
+
render() {
const { isOnlyofficeFile = false } = this.props;
const { isDetailsPanelOpen, isHeaderShown } = this.state;
@@ -142,6 +165,7 @@ class FileView extends React.Component {
/>
{isOnlyofficeFile ?
@@ -54,6 +56,7 @@ class OnlyofficeFileToolbar extends React.Component {
aria-label={gettext('Comment')}
>
+ {isCommentUpdated && }