Fix inserting trailing colon after mention/pill

src/components/views/rooms/SendMessageComposer.js

@@ -502,9 +502,8 @@ export default class SendMessageComposer extends React.Component {
             member.rawDisplayName : userId;
         const caret = this._editorRef.getCaret();
         const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
-        // index is -1 if there are no parts but we only care for if this would be the part in position 0
-        const insertIndex = position.index > 0 ? position.index : 0;
-        const parts = partCreator.createMentionParts(insertIndex, displayName, userId);
+        // Insert suffix only if the caret is at the start of the composer
+        const parts = partCreator.createMentionParts(caret.offset === 0, displayName, userId);
         model.transform(() => {
             const addedLen = model.insert(parts, position);
             return model.positionForOffset(caret.offset + addedLen, true);

src/editor/autocomplete.ts

@@ -125,10 +125,8 @@ export default class AutocompleteWrapperModel {
             case "at-room":
                 return [this.partCreator.atRoomPill(completionId), this.partCreator.plain(completion.suffix)];
             case "user":
-                // not using suffix here, because we also need to calculate
-                // the suffix when clicking a display name to insert a mention,
-                // which happens in createMentionParts
-                return this.partCreator.createMentionParts(this.partIndex, text, completionId);
+                // Insert suffix only if the pill is the part with index 0 - we are at the start of the composer
+                return this.partCreator.createMentionParts(this.partIndex === 0, text, completionId);
             case "command":
                 // command needs special handling for auto complete, but also renders as plain texts
                 return [(this.partCreator as CommandPartCreator).command(text)];

src/editor/parts.ts

@@ -543,9 +543,9 @@ export class PartCreator {
         return new UserPillPart(userId, displayName, member);
     }
 
-    createMentionParts(partIndex: number, displayName: string, userId: string) {
+    createMentionParts(insertTrailingCharacter: boolean, displayName: string, userId: string) {
         const pill = this.userPill(displayName, userId);
-        const postfix = this.plain(partIndex === 0 ? ": " : " ");
+        const postfix = this.plain(insertTrailingCharacter ? ": " : " ");
         return [pill, postfix];
     }
 }