ChannelPreviewMessageDeliveryStatus

Renders message delivery/read status in a channel row inside ChannelList. This is the default component for the PreviewMessageDeliveryStatus prop.

Best Practices

• Show delivery state only for messages sent by the current user.
• Keep icons subtle so delivery state does not overpower message preview text.
• Account for channels where read events are disabled.
• Avoid rendering this indicator when no meaningful status is available.
• Keep custom icon colors consistent with your chat semantics tokens.

General Usage

Customize it and pass it via PreviewMessageDeliveryStatus on ChannelList.

import {
  ChannelList,
  ChannelMessagePreviewDeliveryStatus,
} from "stream-chat-react-native";

const App = () => {
  return (
    <ChannelList
      PreviewMessageDeliveryStatus={(props) => (
        <ChannelMessagePreviewDeliveryStatus {...props} />
      )}
    />
  );
};

Props

channel

message

Message used to determine delivery state and sender context.