Merge pull request #137 from Unshut-Labs/saulmc/convo-style-fixes

fix: message tails, reaction count alignment, group message sender
ephemeraHQ · Jun 24, 2024 · cc66061 · cc66061
2 parents b282f06 + 4e6c5c6
commit cc66061
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 7 deletions.
diff --git a/components/Chat/Message/Message.tsx b/components/Chat/Message/Message.tsx
@@ -250,9 +250,10 @@ function ChatMessage({ message, colorScheme, isGroup, isFrame }: Props) {
               <MessageSenderAvatar message={message} />
             )}
             <View style={{ flex: 1 }}>
-              {isGroup && !message.fromMe && showInBubble && (
-                <MessageSender message={message} />
-              )}
+              {isGroup &&
+                !message.fromMe &&
+                !message.hasPreviousMessageInSeries &&
+                showInBubble && <MessageSender message={message} />}
               <View
                 style={{
                   alignSelf: message.fromMe ? "flex-end" : "flex-start",
@@ -369,7 +370,7 @@ function ChatMessage({ message, colorScheme, isGroup, isFrame }: Props) {
                       </Text>
                     </TouchableOpacity>
                   )}
-                  {!message.hasNextMessageInSeries && (
+                  {!message.hasNextMessageInSeries && message.fromMe && (
                     <View
                       style={[
                         styles.statusContainer,
@@ -481,7 +482,7 @@ const useStyles = () => {
     },
     statusContainer: {
       marginLeft: "auto",
-      marginVertical: 7,
+      marginVertical: 5,
     },
     linkToFrame: {
       fontSize: 11,

diff --git a/components/Chat/Message/MessageActions.tsx b/components/Chat/Message/MessageActions.tsx
@@ -398,7 +398,7 @@ export default function ChatMessageActions({
           {!message.hasNextMessageInSeries &&
             !isFrame &&
             !isAttachment &&
-            isTransaction &&
+            !isTransaction &&
             (Platform.OS === "ios" || Platform.OS === "web") && (
               <MessageTail
                 style={[

diff --git a/components/Chat/Message/MessageReactions.tsx b/components/Chat/Message/MessageReactions.tsx
@@ -113,6 +113,7 @@ const useStyles = () => {
       paddingHorizontal: 6,
       borderRadius: 8,
       flexDirection: "row",
+      alignItems: "center",
     },
     emojis: {
       fontSize: 16,
@@ -121,7 +122,7 @@ const useStyles = () => {
     count: {
       fontSize: 15,
       color: textSecondaryColor(colorScheme),
-      marginLeft: 5,
+      marginLeft: 4,
     },
   });
 };