From d4174ac44969e310955bf9a997acfe1f270dc990 Mon Sep 17 00:00:00 2001
From: sup39 <dev@sup39.dev>
Date: Tue, 16 Jan 2024 10:24:46 +0900
Subject: [PATCH] fix: twemoji in emoji board preview

---
 src/app/components/emoji-board/EmojiBoard.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/app/components/emoji-board/EmojiBoard.tsx b/src/app/components/emoji-board/EmojiBoard.tsx
index 56d0fad..fd0af1e 100644
--- a/src/app/components/emoji-board/EmojiBoard.tsx
+++ b/src/app/components/emoji-board/EmojiBoard.tsx
@@ -280,6 +280,7 @@ export const EmojiGroup = as<
 
 const NativeEmoji = (emoji: IEmoji) =>
   isUsingTwemoji() ? <img
+    loading="lazy"
     className={css.EmoticonImg}
     src={getEmojiUrl(emoji.unicode)}
     alt={emoji.shortcode}
@@ -740,7 +741,16 @@ export function EmojiBoard({
       const emojiInfo = getEmojiItemInfo(element);
       if (!emojiInfo || !emojiPreviewTextRef.current) return;
       if (emojiInfo.type === EmojiType.Emoji && emojiPreviewRef.current) {
-        emojiPreviewRef.current.textContent = emojiInfo.data;
+        if (isUsingTwemoji()) {
+          const img = document.createElement('img');
+          img.className = css.CustomEmojiImg;
+          img.setAttribute('src', getEmojiUrl(emojiInfo.data));
+          img.setAttribute('alt', emojiInfo.shortcode);
+          emojiPreviewRef.current.textContent = '';
+          emojiPreviewRef.current.appendChild(img);
+        } else {
+          emojiPreviewRef.current.textContent = emojiInfo.data;
+        }
       } else if (emojiInfo.type === EmojiType.CustomEmoji && emojiPreviewRef.current) {
         const img = document.createElement('img');
         img.className = css.CustomEmojiImg;