From e00d3ffce94526f636098dba8e447a01a9df6e32 Mon Sep 17 00:00:00 2001
From: Louis Rouffineau <dev@louis.io>
Date: Tue, 15 Oct 2024 16:46:46 +0200
Subject: [PATCH] Always show reactions outside of the message bubble

No matter which content type it is
---
 components/Chat/Message/Message.tsx | 34 ++++++-----------------------
 1 file changed, 7 insertions(+), 27 deletions(-)

diff --git a/components/Chat/Message/Message.tsx b/components/Chat/Message/Message.tsx
index 227228512..dfa265ec0 100644
--- a/components/Chat/Message/Message.tsx
+++ b/components/Chat/Message/Message.tsx
@@ -279,13 +279,7 @@ const ChatMessage = ({
   const reactions = useMemo(() => getMessageReactions(message), [message]);
   const hasReactions = Object.keys(reactions).length > 0;
   const isChatMessage = !isGroupUpdated;
-  const shouldShowReactionsOutside =
-    isChatMessage && (isAttachment || isFrame || isTransaction);
-  const shouldShowReactionsInside =
-    isChatMessage && !shouldShowReactionsOutside;
-  const shouldShowOutsideContentRow =
-    isChatMessage &&
-    (isTransaction || isFrame || (isAttachment && hasReactions));
+  const shouldShowOutsideContentRow = isChatMessage && hasReactions;
 
   let messageMaxWidth: DimensionValue;
   if (isDesktop) {
@@ -476,18 +470,6 @@ const ChatMessage = ({
                       </TouchableOpacity>
                     </View>
                   )}
-                  {shouldShowReactionsInside && (
-                    <View
-                      style={
-                        hasReactions ? styles.reactionsContainer : { flex: 1 }
-                      }
-                    >
-                      <ChatMessageReactions
-                        message={message}
-                        reactions={reactions}
-                      />
-                    </View>
-                  )}
                 </ChatMessageActions>
                 {shouldShowOutsideContentRow ? (
                   <View style={styles.outsideContentRow}>
@@ -502,14 +484,12 @@ const ChatMessage = ({
                         </Text>
                       </TouchableOpacity>
                     )}
-                    {shouldShowReactionsOutside && (
-                      <View style={styles.outsideReactionsContainer}>
-                        <ChatMessageReactions
-                          message={message}
-                          reactions={reactions}
-                        />
-                      </View>
-                    )}
+                    <View style={styles.outsideReactionsContainer}>
+                      <ChatMessageReactions
+                        message={message}
+                        reactions={reactions}
+                      />
+                    </View>
                     {isFrame && message.fromMe && !hasReactions && (
                       <MessageStatus message={message} />
                     )}