From f50c9fb4ef217d5271ddd5a8df8d5f1ef83a4b00 Mon Sep 17 00:00:00 2001
From: Piyush Bhatt <2023kuec2027@iiitkota.ac.in>
Date: Tue, 11 Mar 2025 15:00:54 +0530
Subject: [PATCH] Add emojione

---
 .../client/views/room/composer/messageBox/MessageBox.tsx     | 5 ++++-
 .../views/room/composer/messageBox/types/emoji-toolkit.ts    | 3 +++
 2 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 apps/meteor/client/views/room/composer/messageBox/types/emoji-toolkit.ts

diff --git a/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx b/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx
index 05f93f5c73ce1..53142b292e25a 100644
--- a/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx
+++ b/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx
@@ -13,6 +13,7 @@ import {
 } from '@rocket.chat/ui-composer';
 import { useTranslation, useUserPreference, useLayout, useSetting } from '@rocket.chat/ui-contexts';
 import { useMutation } from '@tanstack/react-query';
+import * as emojione from 'emoji-toolkit';
 import type { ReactElement, FormEvent, MouseEvent, ClipboardEvent } from 'react';
 import { memo, useRef, useReducer, useCallback, useSyncExternalStore } from 'react';
 
@@ -155,7 +156,9 @@ const MessageBox = ({
 		}
 
 		const ref = messageComposerRef.current as HTMLElement;
-		chat.emojiPicker.open(ref, (emoji: string) => chat.composer?.insertText(` :${emoji}: `));
+		chat.emojiPicker.open(ref, (emoji: string) => {
+			chat.composer?.insertText(` ${emojione.shortnameToUnicode(`:${emoji}:`)} `);
+		});
 	});
 
 	const handleSendMessage = useEffectEvent(() => {
diff --git a/apps/meteor/client/views/room/composer/messageBox/types/emoji-toolkit.ts b/apps/meteor/client/views/room/composer/messageBox/types/emoji-toolkit.ts
new file mode 100644
index 0000000000000..8e8ac155a965e
--- /dev/null
+++ b/apps/meteor/client/views/room/composer/messageBox/types/emoji-toolkit.ts
@@ -0,0 +1,3 @@
+declare module 'emoji-toolkit' {
+	export function shortnameToUnicode(emoji: string): string;
+}