MessageSimple

Renders a message inside MessageList. Optimized to reduce unnecessary re-renders. This is the default component for the MessageSimple prop.

Best Practices

• Keep custom message components lightweight to preserve list performance.
• Use context-provided props (alignment, groupStyles) instead of re-computing them.
• Avoid deep ChannelContext usage inside message rows to prevent re-renders.
• Respect showMessageStatus and onlyEmojis when customizing UI.
• Override subcomponents instead of replacing MessageSimple unless necessary.

Props

alignment

Sets whether the message aligns left or right in the list.

channel

Channel instance from the Stream Chat client.

enableMessageGroupingByUser

Note: Available in SDK version >= v3.9.0.

If false, consecutive messages from the same user won’t be grouped.

groupStyles

Position of the message within a group of consecutive messages from the same user. Use groupStyles to style messages based on position (for example, avatars show only on the last message).

hasReactions

True if the message has at least one reaction.

isMyMessage

True if the message was sent by the current user.

lastGroupMessage

Whether or not this is the last message in a group of messages.

members

Members of current channel. This value is received from backend when you query a channel, either using client.queryChannels() or channel.watch() API call.

Record<
  string, // userId
  {
    banned?: boolean;
    created_at?: string;
    invite_accepted_at?: string;
    invite_rejected_at?: string;
    invited?: boolean;
    is_moderator?: boolean;
    role?: string;
    shadow_banned?: boolean;
    updated_at?: string;
    user?: UserResponse<UserType>;
    user_id?: string;
  }
>;

message

Message object.

onlyEmojis

True if the message text contains only emojis.

otherAttachments

All attachments except file and image.

showMessageStatus

When false, message status (read receipt, pending indicator) isn’t rendered. Defaults to true for messages sent by the current user.

MyMessageTheme

Theme applied to the current user’s messages.

UI Component Props

MessageAvatar

Renders the sender avatar in MessageList. Only shown for other users’ messages.

MessageContent

Renders message content (status, attachments, reactions, etc.) in MessageList.

MessageDeleted

Renders a deleted message.

MessageFooter

Renders the message footer in MessageList.

MessageHeader

Renders the header for a message in MessageList.

MessagePinnedHeader

Renders the pinned message label in MessageList.

MessageReplies

Shows thread reply count and avatars of users who replied.

MessageStatus

Renders message status (time and read receipts).

ReactionListBottom

Renders the reactions list below the message bubble.

ReactionListPosition

Position of the reaction list in the message component. Default is above the message content.

ReactionListTop

Renders the reactions list above the message bubble.