From ca64f6f5bba04c775f4432b8c9217b8fd4c8c8d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alexandre=20K=C3=BChn?= <aku@odoo.com>
Date: Wed, 21 Jun 2023 10:27:06 +0000
Subject: [PATCH] [FIX] mail: improved (fuzzy) search of emoji picker
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Before this commit, search in emoji picker was case-sensitive
and had no scoring of items. For example:
- typing "ok" did not match with 🆗
- "ok" 1st suggestion was 😘 because of keyword "face blowing a kiss"
 and this is one of the 1st emoji having characters "o" and "k" in
 search terms.

After this commit, search is now fuzzy:
- typing "ok" shows 🆗
- "ok" 1st suggestions are 👌 & 🆗

Task-3175520

closes odoo/odoo#126801

X-original-commit: 4953172398719df829735f381f4e8939f17b1989
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 addons/mail/static/src/core/common/emoji_picker.js | 14 +++-----------
 addons/mail/static/tests/emoji/emoji_tests.js      | 10 ++++++++++
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/addons/mail/static/src/core/common/emoji_picker.js b/addons/mail/static/src/core/common/emoji_picker.js
index d8451609a93..479d14a3b08 100644
--- a/addons/mail/static/src/core/common/emoji_picker.js
+++ b/addons/mail/static/src/core/common/emoji_picker.js
@@ -19,7 +19,7 @@ import { browser } from "@web/core/browser/browser";
 import { _t } from "@web/core/l10n/translation";
 import { usePopover } from "@web/core/popover/popover_hook";
 import { memoize } from "@web/core/utils/functions";
-import { escapeRegExp } from "@web/core/utils/strings";
+import { fuzzyLookup } from "@web/core/utils/search";
 
 /**
  *
@@ -269,16 +269,8 @@ export class EmojiPicker extends Component {
     getEmojis() {
         const search = this.state.searchStr;
         if (search.length > 1) {
-            const regexp = new RegExp(
-                search
-                    .split("")
-                    .map((x) => escapeRegExp(x))
-                    .join(".*")
-            );
-            return this.emojis.filter((emoji) =>
-                [emoji.name, ...emoji.keywords, ...emoji.emoticons, ...emoji.shortcodes].some((x) =>
-                    x.match(regexp)
-                )
+            return fuzzyLookup(this.state.searchStr, this.emojis, (emoji) =>
+                [emoji.name, ...emoji.keywords, ...emoji.emoticons, ...emoji.shortcodes].join(" ")
             );
         }
         return this.emojis;
diff --git a/addons/mail/static/tests/emoji/emoji_tests.js b/addons/mail/static/tests/emoji/emoji_tests.js
index 1dc199beea1..8d882fc9f84 100644
--- a/addons/mail/static/tests/emoji/emoji_tests.js
+++ b/addons/mail/static/tests/emoji/emoji_tests.js
@@ -23,6 +23,16 @@ QUnit.test("search emoji from keywords", async (assert) => {
     assert.containsOnce($, ".o-mail-Emoji:contains(🌮)");
 });
 
+QUnit.test("search emoji from keywords should be case insensitive", async (assert) => {
+    const pyEnv = await startServer();
+    const channelId = pyEnv["discuss.channel"].create({ name: "" });
+    const { openDiscuss } = await start();
+    await openDiscuss(channelId);
+    await click("button[aria-label='Emojis']");
+    await insertText("input[placeholder='Search for an emoji']", "ok");
+    assert.containsOnce($, ".o-mail-Emoji:contains(🆗)"); // all search terms are uppercase OK
+});
+
 QUnit.test("search emoji from keywords with special regex character", async (assert) => {
     const pyEnv = await startServer();
     const channelId = pyEnv["discuss.channel"].create({ name: "" });