Hetal Sodavadiya
Hetal Sodavadiya

Reputation: 73

How to set condition to set channel url using setState method in onChannelSelect props of sendbird-uikit package?

onChannelSelect function is called whenever component is rendered so channelUrl variable is reset.Because of that channel url is not changed when we click on any channel.Every time first channel's url was set from channel list.So how can i set channel url using setState method ??

import { ChannelList, SendBirdProvider, Channel } from "sendbird-uikit";

 setChannelUrl = (channel) => {
        console.log("channel", channel.url)
        this.setState({ channelUrl: channel.url })

    }
<div className="container cart">
                        <SendBirdProvider appId={global.chat.sendbirdAppId}
                            userId={profile.sendbird_id} >
                            <div className="card card-aspenku">
                                <div className="row">
                                    <div className="col-md-4" style={{ height: '400px' }} >
                                        <ChannelList
                                            onChannelSelect={(channel) => {
                                                if (this.state.channelUrl === "" || 
                                                    this.state.channelUrl !== channel.url) 
                                                {
                                                    console.log("channel")
                                                    this.setChannelUrl(channel)
                                                }
                                                else {
                                                    console.log("no channel")
                                                }
                                            }}
                                            queries={{
                                                channelListQuery: {
                                                    includeEmpty: true,
                                                },
                                                applicationUserListQuery: {
                                                    limit: 30,
                                                    userIdsFilter: [profile.sendbird_id],
                                                }
                                            }}
                                        />
                                    </div>
                                    <div className="col-md-8" style={{ height: '400px' }}>
                                        {this.state.channelUrl && <Channel
                                            channelUrl={this.state.channelUrl}
                                            queries={{
                                                messageListParams: {
                                                    senderUserIds: [profile.sendbird_id],
                                                    prevResultSize: 10,
                                                    includeParentMessageText: true,
                                                    includeReaction: true,
                                                }
                                            }}

                                        />}
                                    </div>
                                </div>
                            </div>
                        </SendBirdProvider>
                    </div>

Upvotes: 1

Views: 187

Answers (0)

Related Questions