useSelectedChannelState

A low-level primitive that subscribes to channel events and returns a value derived from the channel via a selector. It is built on React's useSyncExternalStore, and most of the other channel-state hooks (e.g. useChannelName, useChannelImage, useChannelOwnCapabilities) delegate to it.

This is an advanced building block. Prefer the purpose-built hooks above for common cases, and reach for this hook only when you need to read a piece of channel state that does not yet have a dedicated hook.

Best Practices

• Keep the selector referentially stable (define it at module scope or memoize it) to avoid re-subscribing on every render.
• Keep stateChangeEventKeys referentially stable for the same reason; it defaults to ['all'], which re-renders on every channel event — narrow it to the specific events you care about for better performance.
• Return primitive or shallowly-stable values from the selector so React can bail out of unnecessary re-renders.
• Handle undefined — the hook returns undefined when no channel is provided.

Usage

import { useSelectedChannelState } from "stream-chat-react-native";

const memberCount = useSelectedChannelState({
  channel,
  selector: (channel) => channel.data?.member_count ?? 0,
  stateChangeEventKeys: ["channel.updated"],
});

Parameters

The hook takes a single options object:

Returns