diff --git a/src/components/dms/ActionsWrapper.web.tsx b/src/components/dms/ActionsWrapper.web.tsx index 75f816c07d..8d67051535 100644 --- a/src/components/dms/ActionsWrapper.web.tsx +++ b/src/components/dms/ActionsWrapper.web.tsx @@ -15,7 +15,11 @@ import {EmojiSmile_Stroke2_Corner0_Rounded as EmojiSmileIcon} from '#/components import * as Toast from '#/components/Toast' import type * as bsky from '#/types/bsky' import {EmojiReactionPicker} from './EmojiReactionPicker' -import {canReact, hasReachedReactionLimit} from './util' +import { + canReact, + hasReachedReactionLimit, + MESSAGE_BUBBLE_MAX_WIDTH, +} from './util' export function ActionsWrapper({ message, @@ -163,7 +167,10 @@ export function ActionsWrapper({ + style={[ + {maxWidth: MESSAGE_BUBBLE_MAX_WIDTH}, + isFromSelf ? a.align_end : a.align_start, + ]}> {children} diff --git a/src/components/dms/MessageItem.tsx b/src/components/dms/MessageItem.tsx index 6d5f9ef425..2e3cffe997 100644 --- a/src/components/dms/MessageItem.tsx +++ b/src/components/dms/MessageItem.tsx @@ -62,6 +62,7 @@ import {groupReactions} from './ReactionsDialog' import { CLUSTERED_MESSAGE_THRESHOLD_MS, filterBlockedReactions, + MESSAGE_BUBBLE_MAX_WIDTH, MESSAGE_GAP_THRESHOLD_MS, } from './util' @@ -661,7 +662,7 @@ function BlockedPlaceholder({ return ( <>