refactor(emoji picker): flip behavior order

portabletext · Dec 18, 2024 · f0b71b9 · f0b71b9
1 parent f0356de
commit f0b71b9
Showing 1 changed file with 44 additions and 38 deletions.
diff --git 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,14 +283,20 @@ 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
           .slice(0, textBefore.length - 1)
           .match(incompleteEmojiRegEx)?.[1]
 
         if (!focusBlock || emojiKeyword === undefined) {
-          return {emojis: [], event}
+          return {emojis: []}
         }
 
         const emojis = config.matchEmojis({keyword: emojiKeyword})