SyncManager SDKs JS v1
SyncManager SDKs JS
SyncManager SDKs
JS
Version 1

Channel sync

Copy link

This page provides an overview of how channels can be synchronized by using the ChannelCollection together with other components. The ChannelCollection is a view adapter that subscribes to channel-related events through the ChannelCollectionHandler. As the handler listens to both cached events and real-time events, it can be leveraged to direct view implementation.

For example, if SyncManager receives a real-time event that the current user left a channel, it creates a collection event which has the remove action for the channel and delivers it to the collection handler. At the same time, cached events are also delivered to the handler. The collection uses the fetch() method to load channels from the cache and then delivers a collection event, which has the insert action for the channels, to the collection handler.


Initialization

Copy link

The following shows how to initialize and use a ChannelCollection instance:

const listQuery = sb.createMyGroupChannelListQuery();
const collection = new SendBirdSyncManager.ChannelCollection(listQuery);
const handler = new SendBirdSyncManager.ChannelCollection.CollectionHandler();

handler.onChannelEvent = (action, channels) => {
    switch (action) {
        case 'insert':
            // Add channels to the view.
            break;
        case 'update':
            // Update channels in the view.
            break;
        case 'move':
            // Change the position of channels in the view.
            break;
        case 'remove':
            // Remove channels from the view.
            break;
        case 'clear':
            // Clear the view.
            break;
    }
};

collection.setCollectionHandler(handler);
collection.fetch();

In the above sample, the collection sets the collection handler to listen to channel events and call the fetch() after initialization. At runtime, according to your caching status, the insert event can return once or twice. The first event is called to fetch channels from the cache. If not enough channels are cached, SyncManager waits until background sync synchronizes with the server before delivering the rest of the channels. Then, you may get more events with those channels.


Real-time events

Copy link

SyncManager listens to real-time events from the Chat SDK in order to apply changes and notify the current user. Below is the list of real-time channel events that SyncManager listens to through the ChannelCollectionHandler's onChannelEvent() callback method:

Real-time channel events

Copy link
EventAction with description

onChannelChanged

update or insert: One of the following group channel properties has been changed: distinct, push notification preferences, last message (excluding silent admin messages), unread message count, name, cover image, data, or custom type. If the collection doesn't have the channel in the channel list, an insert event is given instead of update. If the property change affects the order of the channel list, the move event is also invoked.

onChannelHidden

update: A group channel has been hidden from the list. If the collection doesn't have the channel in the channel list, the event is ignored.

onChannelDeleted

remove: A group channel has been deleted. If the collection doesn't have the channel in the channel list, the event is ignored.

onChannelFrozen

update: A group channel has been frozen. If the collection doesn't have the channel in the channel list, the event is ignored.

onChannelUnfrozen

update: A group channel has been unfrozen. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaDataCreated

update: A metadata for a group channel has been created. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaDataUpdated

update: A metadata for a group channel has been updated. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaDataDeleted

update: A metadata for a group channel has been deleted. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaCounterCreated

update: A metacounter for a group channel has been created. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaCounterUpdated

update: A metacounter for a group channel has been updated. If the collection doesn't have the channel in the channel list, the event is ignored.

onMetaCounterDeleted

update: A metacounter for a group channel has been deleted. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserReceivedInvitation

update: A user has been invited to a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserDeclinedInvitation

update or remove: A user has declined an invitation to a group channel. If the user is the current user, a remove event is given instead of update. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserJoined

update: A user has joined a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserLeft

update or remove: A user has left a group channel. If the user is the current user, a remove event is given instead of update. If the collection doesn't have the channel in the channel list, the event is ignored.

onReadReceiptUpdated

update: A user has read a specific unread message in a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserMuted

update: A user has been muted in a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserUnmuted

update: A user has been unmuted in a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserBanned

update or remove: A user has been banned from a group channel. If the user is the current user, a remove event is given instead of update. If the collection doesn't have the channel in the channel list, the event is ignored.

onUserUnbanned

update: A user has been unbanned from a group channel. If the collection doesn't have the channel in the channel list, the event is ignored.

Note: The collection has an array that holds all the channels that should be shown in the view. If a channel isn’t shown in the view, it means that the collection isn’t holding it because background sync synchronization hasn’t been completed at that time.


fetch()

Copy link

The fetch() method fetches channels from the local cache and delivers them to the ChannelCollectionHandler instance. If not enough channels are cached, the fetch() waits until background sync synchronizes and brings the retrieved channels. The fetch() should be called when:

  • A collection is created.
  • A connection is established.
  • The app goes to the foreground.
  • The scroll reaches the bottom.
  • The app returns from a locked screen when still in the foreground.

The fetch() subscribes to background sync to pull data from the local cache. As the fetch() doesn’t directly interact with Sendbird server, while online, it waits until background sync synchronizes the server to the cache before retrieving new data. However, after synchronization is completed by background sync, the fetch() can refresh the view with new data. Therefore, the fetch() can not only read cached data, but also update data in the view.


Channel order

Copy link

By default, cached channels are listed in reverse chronological order, meaning the channel that most recently received a message appears first. The channel order is automatically updated in the local cache when a new message arrives.

Note: When a message arrives in an uncached channel, the channel is automatically cached and brought to the top of the list since it most recently received a message.

If needed, by changing the value of the MyGroupChannelListQuery's order option from the Chat SDK, cached channels can also be listed chronologically as well as alphabetically by channel name or metadata value:

var listQuery = sb.GroupChannel.createMyGroupChannelListQuery();
listQuery.includeEmpty = true;
listQuery.order = 'channel_name_alphabetical'; // 'chronological', 'latest_last_message', 'channel_name_alphabetical', and 'metadata_value_alphabetical'
...

Close the view

Copy link

When the channel list view is closed, the collection should be cleared. A ChannelCollection has the remove() method which clears all the channels managed by the collection and stops synchronization processes in the collection. If the collection isn’t explicitly dropped, the applicable memory won’t be released and could lead to performance slowdown.