This is documentation for Stream Chat React SDK v11, which is no longer actively maintained. For up-to-date documentation, see the latest version (v12).

ChannelHeader

The ChannelHeader component displays pertinent information regarding the currently active channel, including image and title.

Basic Usage

Use this component by adding it as a child of the Channel component. If you want to ‘override’ this component, you simply use your custom component instead.

Example 1

<Channel channel={channel}>
  <ChannelHeader live={true} title={'General'} />
</Channel>

Example 2 - using a custom heading component.

<Channel channel={channel}>
  <YourCustomChannelHeader />
</Channel>

Props

Avatar

A custom UI component to display the avatar image.

Type	Default
component	Avatar

image

The displayed image URL for the header, defaults to the channel image if there is one.

Type	Default
string	the `channel` image

live

A boolean for showing a little indicator below the title if the channel is live right now.

Type
boolean

MenuIcon

A custom UI component to display menu icon.

Type	Default
component	MenuIcon

title

A string to set the title manually, defaults to the channel name if there is one.

Type	Default
string	the `channel` name

Channel

ChannelActionContext