Chat UIKit React v3
Chat UIKit React
Chat UIKit
React
Version 3

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.

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

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

import SendbirdProvider from "@sendbird/uikit-react/SendbirdProvider";
import MessageSearch from "@sendbird/uikit-react/MessageSearch";

import "@sendbird/uikit-react/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>
    );
}