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

196 Views Asked by At

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>
0

There are 0 best solutions below