diff --git a/frontend/src/components/dirent-detail/detail-comments-list.js b/frontend/src/components/dirent-detail/detail-comments-list.js
index d0b1f9fc3c..0b8e2a9b61 100644
--- a/frontend/src/components/dirent-detail/detail-comments-list.js
+++ b/frontend/src/components/dirent-detail/detail-comments-list.js
@@ -181,6 +181,7 @@ class DetailCommentList extends React.Component {
               renderSuggestion={this.renderUserSuggestion}
               style={defaultMentionStyle}
               onAdd={(id, display) => {this.addParticipant(id);}}
+              appendSpaceOnAdd={true}
             />
           </MentionsInput>
           <Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>{gettext('Submit')}</Button>
diff --git a/frontend/src/components/file-view/comment-panel.js b/frontend/src/components/file-view/comment-panel.js
index 8b9cc5e4ef..76a523a7bc 100644
--- a/frontend/src/components/file-view/comment-panel.js
+++ b/frontend/src/components/file-view/comment-panel.js
@@ -227,6 +227,7 @@ class CommentPanel extends React.Component {
               renderSuggestion={this.renderUserSuggestion}
               style={defaultMentionStyle}
               onAdd={(id, display) => {this.addParticipant(id);}}
+              appendSpaceOnAdd={true}
             />
           </MentionsInput>
           <Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>
diff --git a/frontend/src/css/react-mentions-default-style.js b/frontend/src/css/react-mentions-default-style.js
index 6761f07e07..a38ef1f70e 100644
--- a/frontend/src/css/react-mentions-default-style.js
+++ b/frontend/src/css/react-mentions-default-style.js
@@ -55,15 +55,17 @@ const defaultStyle = {
       overflow: 'auto',
       position: 'absolute',
       bottom: 14,
+      width: '150px',
     },
     item: {
+      width: 'auto',
       padding: '5px 15px',
-      minWidth: '50px',
+      overflowX: 'auto',
       borderBottom: '1px solid rgba(0,0,0,0.15)',
       '&focused': {
         backgroundColor: '#f19654',
         color: '#fff',
-        fontWeight: '700',
+        fontWeight: '400',
       },
     },
   },
diff --git a/frontend/src/markdown-editor.js b/frontend/src/markdown-editor.js
index ac3b89c77b..d57ab05626 100644
--- a/frontend/src/markdown-editor.js
+++ b/frontend/src/markdown-editor.js
@@ -262,6 +262,9 @@ class EditorUtilities {
     return seafileAPI.addFileParticipants(repoID, filePath, emails);
   }
 
+  listRepoRelatedUsers() {
+    return seafileAPI.listRepoRelatedUsers(repoID);
+  }
 }
 
 const editorUtilities = new EditorUtilities();