From 3e37f553abfd4691ddb7c6187edcc2140def4820 Mon Sep 17 00:00:00 2001
From: Pujan <shahpujan1992@gmail.com>
Date: Tue, 21 Mar 2023 16:34:19 +0530
Subject: [PATCH 1/3] tooltip moved to EmojiReactionBubble

---
 .../Reactions/EmojiReactionBubble.js          | 60 +++++++------------
 .../Reactions/ReportActionItemReactions.js    | 28 ++++++---
 2 files changed, 43 insertions(+), 45 deletions(-)

diff --git a/src/components/Reactions/EmojiReactionBubble.js b/src/components/Reactions/EmojiReactionBubble.js
index 0b1694dbe0cf..fe7f90ed225d 100644
--- a/src/components/Reactions/EmojiReactionBubble.js
+++ b/src/components/Reactions/EmojiReactionBubble.js
@@ -9,12 +9,8 @@ import withCurrentUserPersonalDetails, {
     withCurrentUserPersonalDetailsPropTypes,
 } from '../withCurrentUserPersonalDetails';
 import * as Report from '../../libs/actions/Report';
-import Tooltip from '../Tooltip';
-import ReactionTooltipContent from './ReactionTooltipContent';
 
 const propTypes = {
-    emojiName: PropTypes.string.isRequired,
-
     /**
      * The emoji codes to display in the bubble.
      */
@@ -63,41 +59,31 @@ const defaultProps = {
 const EmojiReactionBubble = (props) => {
     const hasUserReacted = Report.hasAccountIDReacted(props.currentUserPersonalDetails.accountID, props.reactionUsers);
     return (
-        <Tooltip
-            renderTooltipContent={() => (
-                <ReactionTooltipContent
-                    emojiName={props.emojiName}
-                    emojiCodes={props.emojiCodes}
-                    accountIDs={props.reactionUsers}
-                />
-            )}
+        <Pressable
+            style={({hovered, pressed}) => [
+                styles.emojiReactionBubble,
+                StyleUtils.getEmojiReactionBubbleStyle(hovered || pressed, hasUserReacted, props.sizeScale),
+            ]}
+            onPress={props.onPress}
+            onLongPress={props.onReactionListOpen}
         >
-            <Pressable
-                style={({hovered, pressed}) => [
-                    styles.emojiReactionBubble,
-                    StyleUtils.getEmojiReactionBubbleStyle(hovered || pressed, hasUserReacted, props.sizeScale),
-                ]}
-                onPress={props.onPress}
-                onLongPress={props.onReactionListOpen}
+            <Text style={[
+                styles.emojiReactionText,
+                StyleUtils.getEmojiReactionTextStyle(props.sizeScale),
+            ]}
             >
-                <Text style={[
-                    styles.emojiReactionText,
-                    StyleUtils.getEmojiReactionTextStyle(props.sizeScale),
-                ]}
-                >
-                    {props.emojiCodes.join('')}
-                </Text>
-                {props.count > 0 && (
-                <Text style={[
-                    styles.reactionCounterText,
-                    StyleUtils.getEmojiReactionCounterTextStyle(hasUserReacted, props.sizeScale),
-                ]}
-                >
-                    {props.count}
-                </Text>
-                )}
-            </Pressable>
-        </Tooltip>
+                {props.emojiCodes.join('')}
+            </Text>
+            {props.count > 0 && (
+            <Text style={[
+                styles.reactionCounterText,
+                StyleUtils.getEmojiReactionCounterTextStyle(hasUserReacted, props.sizeScale),
+            ]}
+            >
+                {props.count}
+            </Text>
+            )}
+        </Pressable>
     );
 };
 
diff --git a/src/components/Reactions/ReportActionItemReactions.js b/src/components/Reactions/ReportActionItemReactions.js
index cbac72accf5f..dcaf840a7c38 100644
--- a/src/components/Reactions/ReportActionItemReactions.js
+++ b/src/components/Reactions/ReportActionItemReactions.js
@@ -7,6 +7,8 @@ import EmojiReactionBubble from './EmojiReactionBubble';
 import emojis from '../../../assets/emojis';
 import AddReactionBubble from './AddReactionBubble';
 import getPreferredEmojiCode from './getPreferredEmojiCode';
+import Tooltip from '../Tooltip';
+import ReactionTooltipContent from './ReactionTooltipContent';
 
 /**
  * Given an emoji object and a list of senders it will return an
@@ -68,14 +70,24 @@ const ReportActionItemReactions = (props) => {
                 };
 
                 return (
-                    <EmojiReactionBubble
-                        key={reaction.emoji}
-                        count={reactionCount}
-                        emojiName={reaction.emoji}
-                        emojiCodes={emojiCodes}
-                        onPress={onPress}
-                        reactionUsers={reactionUsers}
-                    />
+                    <Tooltip
+                        renderTooltipContent={() => (
+                            <ReactionTooltipContent
+                                emojiName={reaction.emoji}
+                                emojiCodes={emojiCodes}
+                                accountIDs={reactionUsers}
+                            />
+                        )}
+                    >
+                        <EmojiReactionBubble
+                            key={reaction.emoji}
+                            count={reactionCount}
+                            emojiName={reaction.emoji}
+                            emojiCodes={emojiCodes}
+                            onPress={onPress}
+                            reactionUsers={reactionUsers}
+                        />
+                    </Tooltip>
                 );
             })}
             {reactionsWithCount.length > 0 && <AddReactionBubble onSelectEmoji={props.toggleReaction} />}

From 6f8cfba4c8b4659436f3490cb7736c8e187d1015 Mon Sep 17 00:00:00 2001
From: Pujan <shahpujan1992@gmail.com>
Date: Tue, 21 Mar 2023 21:58:21 +0530
Subject: [PATCH 2/3] removed emojiName prop passing for EmojiReactionBubble

---
 src/components/Reactions/ReportActionItemReactions.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/Reactions/ReportActionItemReactions.js b/src/components/Reactions/ReportActionItemReactions.js
index dcaf840a7c38..59d43a471169 100644
--- a/src/components/Reactions/ReportActionItemReactions.js
+++ b/src/components/Reactions/ReportActionItemReactions.js
@@ -82,7 +82,6 @@ const ReportActionItemReactions = (props) => {
                         <EmojiReactionBubble
                             key={reaction.emoji}
                             count={reactionCount}
-                            emojiName={reaction.emoji}
                             emojiCodes={emojiCodes}
                             onPress={onPress}
                             reactionUsers={reactionUsers}

From 92802c8f9b8d81e52b985d0eed0db409ec4a1c11 Mon Sep 17 00:00:00 2001
From: Pujan <shahpujan1992@gmail.com>
Date: Tue, 21 Mar 2023 22:05:13 +0530
Subject: [PATCH 3/3] removed emojiName prop passing

---
 .../Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js     | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
index 6e561d4a5201..0ce7e798031f 100644
--- a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
+++ b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
@@ -44,7 +44,6 @@ const BaseQuickEmojiReactions = props => (
             // Note: focus is handled by the Pressable component in EmojiReactionBubble
             <Tooltip text={`:${emoji.name}:`} key={emoji.name} focusable={false}>
                 <EmojiReactionBubble
-                    emojiName={emoji.name}
                     emojiCodes={[getPreferredEmojiCode(emoji, props.preferredSkinTone)]}
                     sizeScale={EMOJI_BUBBLE_SCALE}
                     onPress={() => {