Typescript error when initializing Sendbird Desk

Sendbird Desk
1

[Problem/Question]

TS2345: Argument of type SendbirdChatWith<GroupChannelModule[]> is not assignable to parameter of type SendbirdGroupChat
Type SendbirdChatWith<GroupChannelModule[]> is not assignable to type { groupChannel: GroupChannelModule; }
Types of property groupChannel are incompatible.
Type Omit<GroupChannelModule, keyof Module> is missing the following properties from type GroupChannelModule: name, moduleSpecifier

[SDK Version]
@sendbird/chat: “4.12.8”
sendbird-desk: “1.1.2”

[Reproduction Steps]
Use the code in the documentation: Create your first ticket | Desk JavaScript SDK | Sendbird Docs

import SendbirdChat from '@sendbird/chat'
import { GroupChannelModule } from '@sendbird/chat/groupChannel'
import SendBirdDesk, { Ticket } from 'sendbird-desk'

const params = {
  appId: APP_ID,
  modules: [new GroupChannelModule()],
}
const sb = SendbirdChat.init(params)
await sb.connect(USER_ID, ACCESS_TOKEN)
SendBirdDesk.init(sb, 'web')
//                             ^
// the TS error is shown for this `sb` instance

Screenshot 2024-06-20 at 16.35.36
Screenshot 2024-06-20 at 16.35.362284×692 168 KB

2

any progress with this typing issue ? someone will address it ?

3

It’s just a matter of type casting. SendbirdChat.init() returns a SendbirdChat instance and it should cast to SendbirdGroupChat like,

const sb: SendbirdGroupChat = SendbirdChat.init(params) as SendbirdGroupChat
SendbirdDesk.init(sb, 'web')
...

SendbirdGroupChat is actually an alias type of SendbirdChat & { groupChannel: GroupChannelModule }.

4

can you please share a working example in TS ? how show we know that its an alias type?

6

The below code worked for me.

const initializeSendbird = async () => {
  const params = {
    appId: YOUR_APP_ID,
    modules: [new GroupChannelModule()],
  };
  const sendbird = SendbirdChat.init(params) as SendbirdGroupChat;
  SendbirdDesk.init(sendbird);

  await sendbird.connect(USER_ID, SESSION_TOKEN);

  return new Promise((resolve, reject) => {
      SendbirdDesk.authenticate(USER_ID, SESSION_TOKEN, () => {
        resolve(sendbird);
      });
  });
};

// put the below somewhere you'd like to initialize the SDK
const sendbird = await initializeSendbird();
7

It works.
But in reality, users should not need to cast anything.
Especially when they are on their first integration of your library (and when the documentation doesn’t even hint about it).

8

I agree with @Guy_Guy, casting is not the solution we could also use any to solve this issue.
We are missing the point of typing. Why not to update the typing of init method.

There are several more typing issues that I found :

  1. Message type - we used to have the following type :
export type SendBirdMessageType =
  | BaseMessage
  | UserMessage
  | FileMessage
  | AdminMessage;

now when accessing the message ,
const user = sbMessage.sender ? { _id: sbMessage.sender.userId, name: sbMessage.sender.nickname, avatar: sbMessage.sender.profileUrl, } : null;

sender is not recognized any more.

  1. SBDesk Authnenticate Method

given :

const sbDeskAuthenticate = (userId: string, accessToken: string) => {
  return new Promise((resolve, reject) =>
    SendBirdDesk.authenticate(userId, accessToken, (res, err) => {
      if (err) {
        return reject(err);
      }
      console.log("sbDeskAuthenticate successfully");
      return resolve(true);
    }),
  );
};

I get the following :

image
image1710×448 69.3 KB