From f0b71b9a0e63c9b672a1cd9bc4a14fc6383c0427 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Christian=20Hamburger=20Gr=C3=B8ngaard?=
 <christian.groengaard@sanity.io>
Date: Wed, 18 Dec 2024 19:29:57 +0100
Subject: [PATCH] refactor(emoji picker): flip behavior order

---
 .../src/behaviors/behavior.emoji-picker.ts    | 82 ++++++++++---------
 1 file changed, 44 insertions(+), 38 deletions(-)

diff --git a/packages/editor/src/behaviors/behavior.emoji-picker.ts b/packages/editor/src/behaviors/behavior.emoji-picker.ts
index ab3010afe..c04a8b671 100644
--- a/packages/editor/src/behaviors/behavior.emoji-picker.ts
+++ b/packages/editor/src/behaviors/behavior.emoji-picker.ts
@@ -37,6 +37,43 @@ export function createEmojiPickerBehaviors<TEmojiMatch>(
   })
 
   return [
+    defineBehavior({
+      on: 'insert.text',
+      guard: ({context, event}) => {
+        const isEmojiChar = emojiCharRegEx.test(event.text)
+
+        if (!isEmojiChar) {
+          return {emojis: []}
+        }
+
+        const focusBlock = selectors.getFocusTextBlock({context})
+        const textBefore = selectors.getBlockTextBefore({context})
+        const emojiKeyword = `${textBefore}${event.text}`.match(
+          incompleteEmojiRegEx,
+        )?.[1]
+
+        if (!focusBlock || emojiKeyword === undefined) {
+          return {emojis: []}
+        }
+
+        const emojis = config.matchEmojis({keyword: emojiKeyword})
+
+        return {emojis}
+      },
+      actions: [
+        (_, params) => [
+          {
+            type: 'effect',
+            effect: () => {
+              emojiPickerActor.send({
+                type: 'emojis found',
+                matches: params.emojis,
+              })
+            },
+          },
+        ],
+      ],
+    }),
     defineBehavior({
       on: 'insert.text',
       guard: ({context, event}) => {
@@ -106,43 +143,6 @@ export function createEmojiPickerBehaviors<TEmojiMatch>(
         ],
       ],
     }),
-    defineBehavior({
-      on: 'insert.text',
-      guard: ({context, event}) => {
-        const isEmojiChar = emojiCharRegEx.test(event.text)
-
-        if (!isEmojiChar) {
-          return {emojis: []}
-        }
-
-        const focusBlock = selectors.getFocusTextBlock({context})
-        const textBefore = selectors.getBlockTextBefore({context})
-        const emojiKeyword = `${textBefore}${event.text}`.match(
-          incompleteEmojiRegEx,
-        )?.[1]
-
-        if (!focusBlock || emojiKeyword === undefined) {
-          return {emojis: []}
-        }
-
-        const emojis = config.matchEmojis({keyword: emojiKeyword})
-
-        return {emojis}
-      },
-      actions: [
-        (_, params) => [
-          {
-            type: 'effect',
-            effect: () => {
-              emojiPickerActor.send({
-                type: 'emojis found',
-                matches: params.emojis,
-              })
-            },
-          },
-        ],
-      ],
-    }),
     defineBehavior({
       on: 'key.down',
       guard: ({context, event}) => {
@@ -283,6 +283,12 @@ export function createEmojiPickerBehaviors<TEmojiMatch>(
           return false
         }
 
+        const matches = emojiPickerActor.getSnapshot().context.matches
+
+        if (matches.length === 0) {
+          return false
+        }
+
         const focusBlock = selectors.getFocusTextBlock({context})
         const textBefore = selectors.getBlockTextBefore({context})
         const emojiKeyword = textBefore
@@ -290,7 +296,7 @@ export function createEmojiPickerBehaviors<TEmojiMatch>(
           .match(incompleteEmojiRegEx)?.[1]
 
         if (!focusBlock || emojiKeyword === undefined) {
-          return {emojis: [], event}
+          return {emojis: []}
         }
 
         const emojis = config.matchEmojis({keyword: emojiKeyword})