diff --git a/features/conversation/conversation-message/conversation-message-bubble.tsx b/features/conversation/conversation-message/conversation-message-bubble.tsx index 421e65ccd..e9dafa8c9 100644 --- a/features/conversation/conversation-message/conversation-message-bubble.tsx +++ b/features/conversation/conversation-message/conversation-message-bubble.tsx @@ -5,15 +5,12 @@ import { memo } from "react"; type IBubbleContainerProps = { children: React.ReactNode; fromMe: boolean; - transparent?: boolean; }; type IBubbleContentContainerProps = { children: React.ReactNode; fromMe: boolean; hasNextMessageInSeries: boolean; - noPadding?: boolean; - transparent?: boolean; }; export const BubbleContainer = memo(function BubbleContainer( @@ -37,19 +34,16 @@ export const BubbleContainer = memo(function BubbleContainer( export const BubbleContentContainer = memo(function BubbleContentContainer( props: IBubbleContentContainerProps ) { - const { children, fromMe, hasNextMessageInSeries, noPadding, transparent } = - props; + const { children, fromMe, hasNextMessageInSeries } = props; const { theme } = useAppTheme(); const baseStyle = { - backgroundColor: transparent - ? "transparent" - : fromMe - ? theme.colors.bubbles.bubble - : theme.colors.bubbles.received.bubble, + backgroundColor: fromMe + ? theme.colors.bubbles.bubble + : theme.colors.bubbles.received.bubble, borderRadius: theme.borderRadius.sm, - paddingHorizontal: noPadding ? 0 : theme.spacing.xs, - paddingVertical: noPadding ? 0 : theme.spacing.xxs, + paddingHorizontal: theme.spacing.xs, + paddingVertical: theme.spacing.xxs, maxWidth: theme.layout.screen.width * 0.7, }; diff --git a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-big-emoji.tsx b/features/conversation/conversation-message/conversation-message-content-types/conversation-message-big-emoji.tsx deleted file mode 100644 index 069e61d77..000000000 --- a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-big-emoji.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { - BubbleContainer, - BubbleContentContainer, -} from "@/features/conversation/conversation-message/conversation-message-bubble"; -import { MessageText } from "@/features/conversation/conversation-message/conversation-message-text"; -import { useMessageContextStoreContext } from "@/features/conversation/conversation-message/conversation-message.store-context"; -import { useSelect } from "@/data/store/storeHelpers"; -import { DecodedMessage, TextCodec } from "@xmtp/react-native-sdk"; -import { memo } from "react"; - -export const MessageBigEmoji = memo(function MessageBigEmoji(props: { - message: DecodedMessage; -}) { - const { message } = props; - const textContent = message.content(); - - const { hasNextMessageInSeries, fromMe } = useMessageContextStoreContext( - useSelect(["hasNextMessageInSeries", "fromMe"]) - ); - - return ( - - - - {textContent} - - - - ); -}); diff --git a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-reply.tsx b/features/conversation/conversation-message/conversation-message-content-types/conversation-message-reply.tsx index 29bc61ddf..4a669b069 100644 --- a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-reply.tsx +++ b/features/conversation/conversation-message/conversation-message-content-types/conversation-message-reply.tsx @@ -13,7 +13,6 @@ import { isTextMessage, isTransactionReferenceMessage, useConversationMessageById, - shouldRenderBigEmoji, } from "@/features/conversation/conversation-message/conversation-message.utils"; import { useConversationStore, @@ -56,7 +55,6 @@ export const MessageReply = memo(function MessageReply(props: { } const textContent = replyMessageContent.content.text; - const isBigEmoji = textContent && shouldRenderBigEmoji(textContent); return ( @@ -100,9 +98,7 @@ export const MessageReply = memo(function MessageReply(props: { )} {!!textContent && ( - - {textContent} - + {textContent} )} diff --git a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-simple-text.tsx b/features/conversation/conversation-message/conversation-message-content-types/conversation-message-simple-text.tsx index e0b198b8d..4b5c2b5d5 100644 --- a/features/conversation/conversation-message/conversation-message-content-types/conversation-message-simple-text.tsx +++ b/features/conversation/conversation-message/conversation-message-content-types/conversation-message-simple-text.tsx @@ -7,14 +7,19 @@ import { useMessageContextStoreContext } from "@/features/conversation/conversat import { useSelect } from "@/data/store/storeHelpers"; import { DecodedMessage, TextCodec } from "@xmtp/react-native-sdk"; import { memo } from "react"; -import { MessageBigEmoji } from "./conversation-message-big-emoji"; import { shouldRenderBigEmoji } from "@/features/conversation/conversation-message/conversation-message.utils"; +import { VStack } from "@design-system/VStack"; +import { Text } from "@design-system/Text"; +import { textSizeStyles } from "@design-system/Text/Text.styles"; +import { useAppTheme } from "@theme/useAppTheme"; export const MessageSimpleText = memo(function MessageSimpleText(props: { message: DecodedMessage; }) { const { message } = props; + const { theme } = useAppTheme(); + const textContent = message.content(); const { hasNextMessageInSeries, fromMe } = useMessageContextStoreContext( @@ -22,7 +27,24 @@ export const MessageSimpleText = memo(function MessageSimpleText(props: { ); if (shouldRenderBigEmoji(textContent)) { - return ; + return ( + + + {textContent} + + + ); } return (