From c2e050be720f32c3e1221e283a13e4b9ecbc965a Mon Sep 17 00:00:00 2001
From: Bojan Mojsilovic <bmojsilovic@itekako.com>
Date: Mon, 8 Jan 2024 13:34:11 +0100
Subject: [PATCH] Fix emoji input for messages and notes

---
 src/components/NewNote/EditBox/EditBox.tsx | 7 ++++++-
 src/pages/Messages.tsx                     | 8 +++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/components/NewNote/EditBox/EditBox.tsx b/src/components/NewNote/EditBox/EditBox.tsx
index b84d089..7f70aec 100644
--- a/src/components/NewNote/EditBox/EditBox.tsx
+++ b/src/components/NewNote/EditBox/EditBox.tsx
@@ -161,7 +161,12 @@ const EditBox: Component<{
       return false;
     }
 
-    if (!isMentioning() && !isEmojiInput() && e.key === ':' && previousChar === ' ') {
+    if (!isMentioning() && !isEmojiInput() && e.key === ':') {
+      // Ignore if `@` is a part of a word
+      if (textArea.selectionStart > 0 && ![' ', '\r\n', '\r', '\n'].includes(textArea.value[textArea.selectionStart-1])) {
+        return false;
+      }
+
       emojiCursorPosition = getCaretCoordinates(textArea, textArea.selectionStart);
       setEmojiInput(true);
       return false;
diff --git a/src/pages/Messages.tsx b/src/pages/Messages.tsx
index abb83f2..59ec83e 100644
--- a/src/pages/Messages.tsx
+++ b/src/pages/Messages.tsx
@@ -376,6 +376,12 @@ const Messages: Component = () => {
     }
 
     if (!isMentioning() && !isEmojiInput() && e.key === ':') {
+
+      // Ignore if `:` is a part of a word
+      if (newMessageInput.selectionStart > 0 && ![' ', '\r\n', '\r', '\n'].includes(newMessageInput.value[newMessageInput.selectionStart-1])) {
+        return false;
+      }
+
       emojiCursorPosition = getCaretCoordinates(newMessageInput, newMessageInput.selectionStart);
       setEmojiInput(true);
       return false;
@@ -869,7 +875,7 @@ const Messages: Component = () => {
 
     const taRect = newMessageInput.getBoundingClientRect();
 
-    let newBottom = taRect.height - emojiCursorPosition.top;
+    let newBottom = taRect.height - emojiCursorPosition.top + 32;
     let newLeft = emojiCursorPosition.left;
 
     emojiOptions.style.bottom = `${newBottom}px`;