React SDK does not show new group channels

Toni_U · September 15, 2021, 8:46am

Hello,

We’ve had no issues for some weeks nor any changes on our end. Unfortunately it seems our integration is all of a sudden sort of broken.

What is happening?
Our React app (leveraging sendbird-uikit's at v.2.3.2 which is the latest release here) does not display newer GroupChannels that have been correctly created.
We verified that the GroupChannels are created via the Sendbird Dashboard and everything seems Ok on the backend.
We also verified via direct GET call to Sendbird API

https://api-{projId}.sendbird.com/v3/users/{userId}/my_group_channels?show_empty=true&show_member=true

and the desired GroupChannels do appear in the response.
So the problem is only at the React SDK UIKit.

What do you suggest to debug this further and fix it?
Thank you

walter.rodriguez · September 15, 2021, 10:05am

Hi @Toni_U

Just want to be sure you are setting the includeEmpty parameter to true

<ChannelList
  renderChannelPreview={ChannelPreview}
  onChannelSelect={(channel) => {
    if (channel && channel.url) {
      setCurrentChannelUrl(channel.url);
    }
  }}
  queries={{
    channelListQuery: {
      includeEmpty: true
    }
}}

Toni_U · September 15, 2021, 10:38am

Hi @walter.rodriguez ,
Thank you very much for your swift reply. We use the App component directly, so there is no way to setup that parameter for our Desktop implementation.
In the case of our mobile adaptation, we do use the ChannelList component directly and have tested it with includeEmpty as well as you suggest, without luck.
However as far as I understand this parameter is apparently not relevant to our problem, since none of our channels are totally empty (we always send an ADMIN message when initializing the GroupChannel, for the problematic instances I have confirmed that these messages are indeed present so the channels aren’t empty).

What is weirdest is that no change has been done on our end for weeks. Last time a similar thing happened (file attachments broke suddenly), we fixed it upgrading to your latest UIKit. But there has been no official release beyond 2.3.2 AFAIS.

So we’re out of ideas to be honest.
Thanks for the support,

walter.rodriguez · September 15, 2021, 10:42am

Admin messages will not count. For Sendbird, a channel with admin messages will be empty.

Toni_U · September 15, 2021, 11:01am

It’s correct that one needs to send show_empty URL param when interacting via the API for the channels to be returned from /my_group_channels. The UIKit SDK seems to behave differently though - which is what we use.

Please note the following observations:

When using directly the higher component App from sendbird-uikit one cannot specify includeEmpty at all. And still we have until now been successfully displaying many channels that only have 1 admin message internally (see screenshot below). I suspected maybe App was passing includeEmpty to ChannelList but it does not seem to be the case in your source code AFAIU
We use ChannelList in our mobile screen, and even when passing includeEmpty as you suggest the new GroupChannels are not appearing.
We haven’t changed anything on our end as far as I know, it stopped working suddenly only for these new channels, the old ones appear OK even if they only have 1 ADMIN message in the conversation.

Thanks!

Screenshot of current App usage (ie. without includeEmpty param channels that have only one admin message appear successfully):

Toni_U · September 15, 2021, 11:58am

Hi @walter.rodriguez,
I tested again the ChannelList component with explicit includeEmpty and it does return the problematic channels as you mention.
So number 2) above is no longer applying if we explicitly set those parameters.

However I can guarantee 100% that at no place were we specifying includeEmpty until today and the component ChannelList was perfectly picking up channels that have only 1 ADMIN message.

Also the consequence for us is that we no longer can leverage App like we did until now, hence having to re-factor the Desktop implementation so it uses ChannelList with explicit parameters.

Are you available to have a deeper look into what changed around these components & maybe BE defaults, potentially rolling back to the previous behavior of App. Or should we jump to re-factor our integration with Sendbird?

walter.rodriguez · September 15, 2021, 12:00pm

Thanks @Toni_U for the update. I’m speaking with your AE here at Sendbird to give you a detail on this.

Toni_U · September 16, 2021, 8:13am

Hello @walter.rodriguez
Would it be possible to enable a queries prop (or its channelListQuery sub-field) for the App component, to be propagated to ChannelList (source)?

Our implementation depends on that component heavily.

walter.rodriguez · September 16, 2021, 8:19am

If I understand correctly, you should be able to propagate a query as needed and use it when listing a channel.

If not, please provide more details of your entire flow. Thanks!

Toni_U · September 16, 2021, 8:36am

Our implementation on Desktop has been literally as simple as:

import { App as SendbirdApp } from "sendbird-uikit";

export default function App({appId, userId}) {
  return (
    <SendbirdApp 
       appId={appId} 
       userId={userId} 
       theme={THEME} 
       useReaction={true} />
  )
}

That worked perfectly fine for all GroupChannels before (even the ones that had only 1 ADMIN message inside). Now since 3 days ago new GroupChannels that appear correctly created at Sendbird Backend are not fetched by the component. Those problematic channels also have inside its conversation only 1 ADMIN message.

Explicitly calling ChannelList with queries as you suggest makes those channels appear even though this explicit parameter was not necessary before.

<ChannelList
  queries={{
    channelListQuery: {
      includeEmpty: true
    }
  }}
  />

My question is, how can we propagate queries using directly the App component? It does not appear to be one of its props.

walter.rodriguez · September 16, 2021, 8:43am

Thanks for clarifying. queries belongs to ChannelList.
You can check UIKit’s source code (since it’s open source)

github.com

sendbird/sendbird-uikit-react/blob/ebc176807f58639be997c098acdb2037a49e3e09/src/smart-components/ChannelList/index.jsx

import React, { useEffect, useState, useReducer } from 'react';
import PropTypes from 'prop-types';

import withSendbirdContext from '../../lib/SendbirdSdkContext';
import * as userActions from '../../lib/dux/user/actionTypes';
import { UserProfileProvider } from '../../lib/UserProfileContext';

import * as channelListActions from './dux/actionTypes';
import channelListInitialState from './dux/initialState';
import channelListReducers from './dux/reducers';

import ChannelPreview from '../../ui/ChannelPreview';
import ChannelHeader from '../../ui/ChannelHeader';
import EditUserProfile from '../../ui/EditUserProfile';
import PlaceholderTypes from '../../ui/PlaceHolder/type';

import AddChannel from './components/AddChannel';
import ChannelPreviewAction from './components/ChannelPreviewAction';
import PlaceHolder from './components/Placeholder';

This file has been truncated. show original

Toni_U · September 16, 2021, 8:47am

Thanks for the quick reply, I am aware about that.

My question is: can you enable the possibility for App to accept the queries prop where it propagates it to its ChannelList child?

Also, is there any possible explanation you could think of intuitively of why App component used to work fine and now it doesn’t for such empty(1admin message only) channels?

walter.rodriguez · September 16, 2021, 8:51am

Will check the first part of your question with our UIKit developers.

For the second part, not sure why it was not working before since this behaviour is per design in our SDK.

Toni_U · September 16, 2021, 9:02am

Thanks! Would be fantastic since I believe our problem would be quickly fixed right away if we could propagate queries from App directly.

Toni_U · September 16, 2021, 9:28am

Hello @walter.rodriguez ,
I believe I have found a possible explanation, this is only a hypothesis but as far as I understand what you said here has not been entirely true the whole time.
If we fetch the response from

GET /my_group_channels/:channel-id

for two different channels:

Channel A. An old channel which React UIKit displays correctly via the App component (ie. no explicit includeEmpty)
Channel B. A newer channel which React UIKit does NOT display at all via the App component.

They both have 1 ADMIN ONLY message in their conversation.

We see that their lastMessage field is very different:

// Channel A <-- correctly fetched
{
    "message_survival_seconds": -1,
    "unread_message_count": 0,
    "is_distinct": false,
    "custom_type": "",
    "is_ephemeral": false,
    "cover_url": "https://static.sendbird.com/sample/cover/cover_12.jpg",
    "freeze": false,
    "created_by": null,
    "is_discoverable": false,
    "is_public": false,
    "data": "",
    "disappearing_message": {
        "message_survival_seconds": -1,
        "is_triggered_by_message_read": false
    },
    "ignore_profanity_filter": false,
    "is_super": false,
    "name": "",
    "member_count": 2,
    "created_at": 1629325548,
    "is_access_code_required": false,
    "is_broadcast": false,
    "last_message": {
        "custom_type": "",
        "mentioned_users": [],
        "updated_at": 0,
        "is_removed": false,
        "type": "ADMM",
        "message": "Messages are end-to-end encrypted. No one outside of this chat can read them",
        "data": "",
        "mention_type": "users",
        "created_at": 1629325548249,
        "channel_type": "group",
        "channel_url": "url-channel-A",
        "message_id": 1187906223
    },
    "unread_mention_count": 0,
    "sms_fallback": {
        "wait_seconds": -1,
        "exclude_user_ids": []
    },
    "joined_member_count": 2,
    "max_length_message": 5000,
    "channel_url": "channel-url-a",
    "channel": {
        "name": "",
        "member_count": 2,
        "custom_type": "",
        "channel_url": "channel-url-a",
        "created_at": 1629325548,
        "cover_url": "https://static.sendbird.com/sample/cover/cover_12.jpg",
        "max_length_message": 5000,
        "data": ""
    }
}

whereas Channel B:

// Channel B <-- not fetched by <App />
{
    "message_survival_seconds": -1,
    "unread_message_count": 0,
    "is_distinct": false,
    "custom_type": "",
    "is_ephemeral": false,
    "cover_url": "https://static.sendbird.com/sample/cover/cover_12.jpg",
    "freeze": false,
    "created_by": null,
    "is_discoverable": false,
    "is_public": false,
    "data": "",
    "disappearing_message": {
        "message_survival_seconds": -1,
        "is_triggered_by_message_read": false
    },
    "ignore_profanity_filter": false,
    "is_super": false,
    "name": "",
    "member_count": 2,
    "created_at": 1631718592,
    "is_access_code_required": false,
    "is_broadcast": false,
    "last_message": null,
    "unread_mention_count": 0,
    "sms_fallback": {
        "wait_seconds": -1,
        "exclude_user_ids": []
    },
    "joined_member_count": 2,
    "max_length_message": 5000,
    "channel_url": "channel-url-B",
    "channel": {
        "name": "",
        "member_count": 2,
        "custom_type": "",
        "channel_url": "channel-url-B",
        "created_at": 1631718592,
        "cover_url": "https://static.sendbird.com/sample/cover/cover_12.jpg",
        "max_length_message": 5000,
        "data": ""
    }
}

From here we can extract that before ADMM channels were considered a lastMessage, but that does not happen with newer channels - hence needing an explicit includeEmpty parameter. My suspicion is that something must have changed at your backend which no longers flags ADMIN messages as a message; which wasn’t the case before.
Let me know if this makes sense.

walter.rodriguez · September 16, 2021, 9:29am

Thanks @Toni_U for this detailed information.
Will update this information to our developers and get back to you.

Toni_U · September 16, 2021, 9:33am

Thanks @walter.rodriguez!
Please let me know if you need specific details (eg channel URLs etc).

We’re very focused on this problem since our whole company depends on Chat which is not usable now for new clients. So we’re waiting to see if it’s worth for us to re-implement our integration via ChannelList (worst case) or you can enable queries at App to workaround this breaking change (best case).

Tyler · September 16, 2021, 12:01pm

Hi @Toni_U,

Could you DM me your Application ID? I’d like to investigate the differences in the channel/messages while Walter talks with our Engineering team.

Toni_U · September 16, 2021, 12:05pm

Done, thank you for the investigation!

Toni_U · September 16, 2021, 12:10pm

Note that we are in the process of pseudo-manually sending a non-admin message to each of the affected channels since this problem is totally disruptive for our operations and need to bypass it as soon as possible.

I hope that will not affect you investigation; we just cannot afford to wait any longer for this to be operational again.

React SDK does not show new group channels

Not finding what you need