From 459749b99274a3a9bef2236e9d2bf762f5532efe Mon Sep 17 00:00:00 2001
From: Cyril <c.gromoff@gmail.com>
Date: Wed, 7 Jan 2026 12:30:14 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8(frontend)=20getEmojiLabel=20util=20fo?=
 =?UTF-8?q?r=20accessible=20emoji=20labeling=20across=20app?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

centralizes emoji label logic to ensure consistency and reuse in UI components
---
 .../livekit/components/ReactionPortal.tsx     | 24 +------------------
 .../rooms/livekit/utils/reactionUtils.ts      | 24 +++++++++++++++++++
 2 files changed, 25 insertions(+), 23 deletions(-)
 create mode 100644 src/frontend/src/features/rooms/livekit/utils/reactionUtils.ts

diff --git a/src/frontend/src/features/rooms/livekit/components/ReactionPortal.tsx b/src/frontend/src/features/rooms/livekit/components/ReactionPortal.tsx
index e0f71eac..40f5a51d 100644
--- a/src/frontend/src/features/rooms/livekit/components/ReactionPortal.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/ReactionPortal.tsx
@@ -5,6 +5,7 @@ import { css } from '@/styled-system/css'
 import { Participant } from 'livekit-client'
 import { useTranslation } from 'react-i18next'
 import { Reaction } from '@/features/rooms/livekit/components/controls/ReactionsToggle'
+import { getEmojiLabel } from '@/features/rooms/livekit/utils/reactionUtils'
 
 export const ANIMATION_DURATION = 3000
 export const ANIMATION_DISTANCE = 300
@@ -24,29 +25,6 @@ const srOnly = css({
   border: 0,
 })
 
-const getEmojiLabel = (
-  emoji: string,
-  t: ReturnType<typeof useTranslation>['t']
-) => {
-  const emojiLabels: Record<string, string> = {
-    'thumbs-up': t('emojis.thumbs-up', { defaultValue: 'thumbs up' }),
-    'thumbs-down': t('emojis.thumbs-down', { defaultValue: 'thumbs down' }),
-    'clapping-hands': t('emojis.clapping-hands', {
-      defaultValue: 'clapping hands',
-    }),
-    'red-heart': t('emojis.red-heart', { defaultValue: 'red heart' }),
-    'face-with-tears-of-joy': t('emojis.face-with-tears-of-joy', {
-      defaultValue: 'face with tears of joy',
-    }),
-    'face-with-open-mouth': t('emojis.face-with-open-mouth', {
-      defaultValue: 'surprised face',
-    }),
-    'party-popper': t('emojis.party-popper', { defaultValue: 'party popper' }),
-    'folded-hands': t('emojis.folded-hands', { defaultValue: 'folded hands' }),
-  }
-  return emojiLabels[emoji] ?? emoji
-}
-
 interface FloatingReactionProps {
   emoji: string
   name?: string
diff --git a/src/frontend/src/features/rooms/livekit/utils/reactionUtils.ts b/src/frontend/src/features/rooms/livekit/utils/reactionUtils.ts
new file mode 100644
index 00000000..42ff9c09
--- /dev/null
+++ b/src/frontend/src/features/rooms/livekit/utils/reactionUtils.ts
@@ -0,0 +1,24 @@
+import { useTranslation } from 'react-i18next'
+
+export const getEmojiLabel = (
+  emoji: string,
+  t: ReturnType<typeof useTranslation>['t']
+) => {
+  const emojiLabels: Record<string, string> = {
+    'thumbs-up': t('emojis.thumbs-up', { defaultValue: 'thumbs up' }),
+    'thumbs-down': t('emojis.thumbs-down', { defaultValue: 'thumbs down' }),
+    'clapping-hands': t('emojis.clapping-hands', {
+      defaultValue: 'clapping hands',
+    }),
+    'red-heart': t('emojis.red-heart', { defaultValue: 'red heart' }),
+    'face-with-tears-of-joy': t('emojis.face-with-tears-of-joy', {
+      defaultValue: 'face with tears of joy',
+    }),
+    'face-with-open-mouth': t('emojis.face-with-open-mouth', {
+      defaultValue: 'surprised face',
+    }),
+    'party-popper': t('emojis.party-popper', { defaultValue: 'party popper' }),
+    'folded-hands': t('emojis.folded-hands', { defaultValue: 'folded hands' }),
+  }
+  return emojiLabels[emoji] ?? emoji
+}