Synchronize the implementation of mentions in CKEditor

diff --git a/ts/WoltLabSuite/Core/Component/Ckeditor/Mention.ts b/ts/WoltLabSuite/Core/Component/Ckeditor/Mention.ts
index 39ac17cedbb7e5de2b94809ca47fd4ca56c431c9..44ee0eed43a75f804c55f7b7220da80c0895d15e 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Ckeditor/Mention.ts
+++ b/ts/WoltLabSuite/Core/Component/Ckeditor/Mention.ts
@@ -17,7 +17,7 @@ type SearchResultItem = {
   avatarTag: string;
   username: string;
   userID: number;
-  //  type: "group" | "user";
+  type: "user";
 };
 type ResultGetSearchResultList = SearchResultItem[];
 
@@ -43,6 +43,8 @@ async function getPossibleMentions(query: string): Promise<UserMention[]> {
       id: `@${item.username}`,
       text: item.username,
       icon: item.avatarTag,
+      objectId: item.userID,
+      type: item.type,
     };
   });
 }
@@ -56,7 +58,6 @@ function getMentionConfiguration(): MentionConfig {
           return getPossibleMentions(query) as any;
         },
         itemRenderer: (item: Awaited<ReturnType<typeof getPossibleMentions>>[0]) => {
-          // TODO: This is ugly.
           return createFragmentFromHtml(`
             <span class="ckeditor5__mention">${item.icon} ${item.text}</span>
           `).firstElementChild as HTMLElement;

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Mention.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Mention.js
index dc6e5f020aa2fa5a59c7545364be2050aa2747da..0ee189c1f30c3aedcb6db1d0c1e68af5779d83f3 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Mention.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Mention.js
@@ -24,6 +24,8 @@ define(["require", "exports", "../../Ajax/Backend", "../../Dom/Util", "./Event"]
                 id: `@${item.username}`,
                 text: item.username,
                 icon: item.avatarTag,
+                objectId: item.userID,
+                type: item.type,
             };
         });
     }
@@ -36,7 +38,6 @@ define(["require", "exports", "../../Ajax/Backend", "../../Dom/Util", "./Event"]
                         return getPossibleMentions(query);
                     },
                     itemRenderer: (item) => {
-                        // TODO: This is ugly.
                         return (0, Util_1.createFragmentFromHtml)(`
             <span class="ckeditor5__mention">${item.icon} ${item.text}</span>
           `).firstElementChild;

diff --git a/wcfsetup/install/files/lib/action/EditorGetMentionSuggestionsAction.class.php b/wcfsetup/install/files/lib/action/EditorGetMentionSuggestionsAction.class.php
index eac1eae742e1aa2fc578ee2c8629816d71b84029..a2b50c6045683ca4e4cb4858100176ef216d2fc1 100644 (file)
--- a/wcfsetup/install/files/lib/action/EditorGetMentionSuggestionsAction.class.php
+++ b/wcfsetup/install/files/lib/action/EditorGetMentionSuggestionsAction.class.php
@@ -42,6 +42,7 @@ final class EditorGetMentionSuggestionsAction implements RequestHandlerInterface
                     'avatarTag' => $userProfile->getAvatar()->getImageTag(16),
                     'username' => $userProfile->getUsername(),
                     'userID' => $userProfile->getObjectID(),
+                    'type' => 'user',
                 ],
                 $users
             ),

diff --git a/wcfsetup/install/files/style/bbcode/userMention.scss b/wcfsetup/install/files/style/bbcode/userMention.scss
index dfb34a524f723a09c7df03257fe06206c8d1886b..84424f5f4287f5d422ff7f6c97fb03a2009f1187 100644 (file)
--- a/wcfsetup/install/files/style/bbcode/userMention.scss
+++ b/wcfsetup/install/files/style/bbcode/userMention.scss
@@ -1,3 +1,4 @@
+.ck.ck-content .mention,
 .userMention {
        background-color: var(--wcfSidebarBackground);
        border-radius: 2px;

diff --git a/wcfsetup/install/files/style/ui/wsc31.scss b/wcfsetup/install/files/style/ui/wsc31.scss
index f5c30b21adb40af42184e6021e2982817a052ccc..6db4da897e1db3ea8a03c2c656d0cb45efe4724d 100644 (file)
--- a/wcfsetup/install/files/style/ui/wsc31.scss
+++ b/wcfsetup/install/files/style/ui/wsc31.scss
@@ -174,6 +174,7 @@
                        }
                }
        }
+       .ck.ck-content .mention,
        .userMention {
                color: var(--wcfSidebarLink);