From 4ed8b567f1222b9d8e2b91f1289625264403f653 Mon Sep 17 00:00:00 2001
From: Mikkel Ricky <rimi@aarhus.dk>
Date: Mon, 11 Mar 2024 18:11:57 +0100
Subject: [PATCH] Fixed user mentions

---
 app/Domain/Api/Controllers/Users.php                    | 8 ++++++++
 public/assets/js/app/core/editors.js                    | 9 +++++++--
 public/assets/js/libs/tinymce-plugins/mention/plugin.js | 4 ++--
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/app/Domain/Api/Controllers/Users.php b/app/Domain/Api/Controllers/Users.php
index 6071ba1ba6..4e93481597 100644
--- a/app/Domain/Api/Controllers/Users.php
+++ b/app/Domain/Api/Controllers/Users.php
@@ -58,6 +58,14 @@ public function get(array $params): Response
 
             $users = $this->userService->getUsersWithProjectAccess($_SESSION['userdata']['id'], $projectId);
 
+            if (isset($params['query'])) {
+                $query = $params['query'];
+                // Perform a simple filter by query and create a list of the result.
+                $users = array_values(
+                    array_filter($users, static fn (array $user) => false !== stripos(implode(' ', $user), $query))
+                );
+            }
+
             return $this->tpl->displayJson($users);
         }
 
diff --git a/public/assets/js/app/core/editors.js b/public/assets/js/app/core/editors.js
index fccd46659a..f30152daed 100644
--- a/public/assets/js/app/core/editors.js
+++ b/public/assets/js/app/core/editors.js
@@ -49,7 +49,10 @@ leantime.editorController = (function () {
             // Do your ajax call
             // When using multiple delimiters you can alter the query depending on the delimiter used
             if (delimiter === '@') {
-                jQuery.getJSON(leantime.appUrl + '/api/users?projectUsersAccess=current', function (data) {
+                jQuery.getJSON(leantime.appUrl + '/api/users', {
+                    projectUsersAccess: 'current',
+                    query: query
+                }, function (data) {
                     //call process to show the result
                     let users = [];
                     for (let i = 0; i < data.length; i++) {
@@ -72,7 +75,9 @@ leantime.editorController = (function () {
         },
         insert: function (item) {
             return '<a class="userMention" data-tagged-user-id="' + item.id + '" href="javascript:void(0)"><img src="' + leantime.appUrl + '/api/users?profileImage=' + item.id + '" alt="' + item.name + ' Image"/>' + item.name.trim() + '</a>&nbsp;';
-        }
+        },
+        // The default value is 10 (cf. https://github.com/StevenDevooght/tinyMCE-mention?tab=readme-ov-file#items)
+        items: 10
     };
 
     var imageUploadHandler = function(blobInfo, success, failure) {
diff --git a/public/assets/js/libs/tinymce-plugins/mention/plugin.js b/public/assets/js/libs/tinymce-plugins/mention/plugin.js
index cd35657323..530c25b96d 100644
--- a/public/assets/js/libs/tinymce-plugins/mention/plugin.js
+++ b/public/assets/js/libs/tinymce-plugins/mention/plugin.js
@@ -61,7 +61,7 @@
         renderInput: function () {
             var rawHtml =  '<span id="autocomplete">' +
                                 '<span id="autocomplete-delimiter">' + this.options.delimiter + '</span>' +
-                                '<span id="autocomplete-searchtext"><span class="dummy">\uFEFF</span></span>' +
+                                '<span id="autocomplete-searchtext"><span class="dummy">\u200b</span></span>' +
                             '</span>';
 
             this.editor.execCommand('mceInsertContent', false, rawHtml);
@@ -181,7 +181,7 @@
         },
 
         lookup: function () {
-            this.query = $.trim($(this.editor.getBody()).find('#autocomplete-searchtext').text()).replace('\ufeff', '');
+            this.query = $.trim($(this.editor.getBody()).find('#autocomplete-searchtext').text()).replace('\u200b', '');
 
             if (this.$dropdown === undefined) {
                 this.show();