Home
/
UIKit
/
React
/
Group channel

Message search is a feature that allows users to search for messages within a specific channel. It retrieves a list of messages that contains a search query from group channels joined by a user. They can search for either an exact match or a partial match.

Users can use this feature through the search bar in the message search view. When they search for a keyword in the search bar, the message search view will display the search results as shown below. Users can locate the message that they’re looking for by selecting the message result.

Showing the search results in the message search view.

Note : To learn how to implement a search system within your app, refer to Search messages.

You can customize the UI for message search by using renderSearchItem. This property of MessageSearch customizes the view of the searched message results.

Light Color Skin
Copy
import { SendBirdProvider, MessageSearch } from 'sendbird-uikit';
import "sendbird-uikit/dist/index.css";

const MyApp = () => {
  return (
    <SendBirdProvider>
      <MessageSearch
        channelUrl={channelUrl: string}
        searchString={textInput: string}
        messageSearchQuery={query: MessageSearchQuery}
        renderSearchItem={({ message, onResultClick }) => {
          return () => <CustomSearchItem message={message} />;
        }}
        onResultLoaded={(message, error) => {}}
        onResultClick={(message) => {}}
      />
    </SendBirdProvider>
  );
}