Fix mention bubbles not rendered in comment editor

The NcRichContenteditable requires the "userData" property to be given
to render the mention bubbles. Otherwise after selecting a candidate
mention just "@" followed by the user id is shown in plain text.

To solve that now the data of the candidate mentions is cached whenever
the autocomplete list is shown, and reset once a comment has been sent.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>

Author: danxuliu

apps/comments/src/components/Comment.vue

@@ -68,6 +68,7 @@
 			<NcRichContenteditable ref="editor"
 				:auto-complete="autoComplete"
 				:contenteditable="!loading"
+				:user-data="userData"
 				:value="localMessage"
 				@update:value="updateLocalMessage"
 				@submit="onSubmit" />

apps/comments/src/views/Comments.vue

@@ -28,6 +28,7 @@
 			:auto-complete="autoComplete"
 			:editor="true"
 			:ressource-id="ressourceId"
+			:user-data="candidateMentionsData"
 			class="comments__writer"
 			@new="onNewComment" />
 
@@ -127,6 +128,7 @@ export default {
 				actorId: getCurrentUser().uid,
 				key: 'editor',
 			},
+			candidateMentionsData: {},
 
 			Comment,
 		}
@@ -251,7 +253,14 @@ export default {
 					limit: loadState('comments', 'maxAutoCompleteResults'),
 				},
 			})
-			return callback(results.data.ocs.data)
+
+			const candidateMentions = results.data.ocs.data
+
+			candidateMentions.forEach(candidateMention => {
+				this.candidateMentionsData[candidateMention.id] = candidateMention
+			})
+
+			return callback(candidateMentions)
 		},
 
 		/**
@@ -261,6 +270,8 @@ export default {
 		 */
 		onNewComment(comment) {
 			this.comments.unshift(comment)
+			// Reset cached candidate mentions
+			this.candidateMentionsData = {}
 		},
 
 		/**