wcfsetup/install/files/js/WoltLabSuite/Core/Component/Ckeditor/Mention.js

   1 /**
   2  * Provides mention support for users and groups.
   3  *
   4  * @author Alexander Ebert
   5  * @copyright 2001-2023 WoltLab GmbH
   6  * @license GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
   7  * @since 6.0
   8  * @woltlabExcludeBundle tiny
   9  */
  10 define(["require", "exports", "../../Ajax/Backend", "../../Dom/Util", "./Event"], function (require, exports, Backend_1, Util_1, Event_1) {
  11     "use strict";
  12     Object.defineProperty(exports, "__esModule", { value: true });
  13     exports.setup = void 0;
  14     async function getPossibleMentions(query) {
  15         // Prevent excessive attempts to resolve mentions.
  16         if (query.length > 24) {
  17             return [];
  18         }
  19         // TODO: Provide the URL as a parameter.
  20         const url = new URL(window.WSC_API_URL + "index.php?editor-get-mention-suggestions/");
  21         url.searchParams.set("query", query);
  22         const result = (await (0, Backend_1.prepareRequest)(url.toString())
  23             .get()
  24             .allowCaching()
  25             .disableLoadingIndicator()
  26             .fetchAsJson());
  27         return result.map((item) => {
  28             if (item.type === "user") {
  29                 return {
  30                     id: `@${item.username}`,
  31                     text: `@${item.username}`,
  32                     icon: item.avatarTag,
  33                     objectId: item.userID,
  34                     type: item.type,
  35                 };
  36             }
  37             else {
  38                 return {
  39                     id: `@${item.name}`,
  40                     text: `@${item.name}`,
  41                     icon: '<fa-icon name="users"></fa-icon>',
  42                     objectId: item.groupID,
  43                     type: item.type,
  44                 };
  45             }
  46         });
  47     }
  48     function getMentionConfiguration() {
  49         return {
  50             feeds: [
  51                 {
  52                     feed: (query) => getPossibleMentions(query),
  53                     itemRenderer: (item) => {
  54                         return (0, Util_1.createFragmentFromHtml)(`
  55             <span class="ckeditor5__mention">${item.icon} ${item.text}</span>
  56           `).firstElementChild;
  57                     },
  58                     marker: "@",
  59                     minimumCharacters: 3,
  60                 },
  61             ],
  62         };
  63     }
  64     function setup(element) {
  65         (0, Event_1.listenToCkeditor)(element).setupConfiguration(({ configuration, features }) => {
  66             if (!features.mention) {
  67                 return;
  68             }
  69             configuration.mention = getMentionConfiguration();
  70         });
  71     }
  72     exports.setup = setup;
  73 });