Change editor participant (#3924)

* add API

* change style

t# interactive rebase in progress; onto 01448aa67

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>

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}>

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',
       },
     },
   },

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();