agora-appbuilder-core 4.0.21 → 4.0.22-beta-3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agora-appbuilder-core",
-  "version": "4.0.21",
+  "version": "4.0.22-beta-3",
   "description": "React Native template for RTE app builder",
   "main": "index.js",
   "files": [

package/template/src/components/chat/chatConfigure.native.tsx

@@ -29,6 +29,7 @@ interface ChatMessageAttributes {
   file_name?: string;
   file_url?: string;
   from_platform?: string;
+  channel?: string;
 }
 interface chatConfigureContextInterface {
   open: boolean;
@@ -65,7 +66,7 @@ const ChatConfigure = ({children}) => {
   const chatClient = ChatClient.getInstance();
   const chatManager = chatClient.chatManager;
 
-  const localUid = data?.channel + '_' + data?.uid?.toString();
+  const localUid = data?.uid?.toString();
   const agoraToken = data?.chat?.user_token;
   const {store} = React.useContext(StorageContext);
   const {
@@ -119,11 +120,14 @@ const ChatConfigure = ({children}) => {
             messages[0].chatType === ChatMessageChatType.PeerChat;
           const {msgId, from, body, localTime} = messages[0];
           const chatType = body.type;
-          const fromUser = from.split('_')[1];
-          const {file_ext, file_name, file_url, from_platform} = messages[0]
-            .attributes as ChatMessageAttributes;
+          const fromUser = from;
+          const {file_ext, file_name, file_url, from_platform, channel} =
+            messages[0].attributes as ChatMessageAttributes;
 
-          //@ts-ignore
+          // prevent cross channel msgs
+          if (channel !== data.channel) {
+            return;
+          }
 
           switch (chatType) {
             case ChatMessageType.TXT:
@@ -277,7 +281,7 @@ const ChatConfigure = ({children}) => {
           logger.log(
             LogSource.Internals,
             'CHAT',
-            `Logged in User ${localUid} to Agora Chat Server`,
+            `Logged in Native User ${localUid} to Agora Chat Server`,
           );
           setupMessageListener();
           // adding chat connection event listeners
@@ -291,6 +295,11 @@ const ChatConfigure = ({children}) => {
             onConnected() {
               console.warn('onConnected');
               // once sdk connects to chat server successfully , need to add message listeners
+              logger.log(
+                LogSource.Internals,
+                'CHAT',
+                `Native User ${localUid} to connected to Agora Chat Server`,
+              );
             },
             onDisconnected() {
               console.warn('onDisconnected:');
@@ -305,7 +314,7 @@ const ChatConfigure = ({children}) => {
           logger.error(
             LogSource.Internals,
             'CHAT',
-            `Failed Looger  User ${localUid} to Agora Chat Server`,
+            `Failed Logging Native User ${localUid} from Agora Chat Server`,
             error,
           );
         }
@@ -334,6 +343,9 @@ const ChatConfigure = ({children}) => {
     switch (type) {
       case ChatMessageType.TXT:
         chatMsg = ChatMessage.createTextMessage(to, msg, chatMsgChatType);
+        chatMsg.attributes = {
+          channel: data.channel,
+        };
         break;
       case ChatMessageType.IMAGE:
         chatMsg = ChatMessage.createImageMessage(to, url, chatMsgChatType);
@@ -343,6 +355,7 @@ const ChatConfigure = ({children}) => {
           file_name: option?.ext?.file_name,
           file_url: option?.ext?.file_url, // this local url , when upload util is available for native then will use it
           from_platform: 'native',
+          channel: data.channel,
         };
 
         console.warn('Image msg to be sent', chatMsg);
@@ -358,6 +371,7 @@ const ChatConfigure = ({children}) => {
           file_name: option?.ext?.file_name,
           file_url: option?.url, // this local url , when upload util is available for native then will use it
           from_platform: 'native',
+          channel: data.channel,
         };
         console.warn('File msg to be sent', chatMsg);
         break;
@@ -381,13 +395,9 @@ const ChatConfigure = ({children}) => {
 
           // this is local user messages
           if (option.chatType === SDKChatType.SINGLE_CHAT) {
-            addMessageToPrivateStore(
-              Number(option.to.split('_')[1]),
-              messageData,
-              true,
-            );
+            addMessageToPrivateStore(Number(option.to), messageData, true);
           } else {
-            addMessageToStore(Number(option.from.split('_')[1]), messageData);
+            addMessageToStore(Number(option.from), messageData);
           }
         }
       })

package/template/src/components/chat/chatConfigure.tsx

@@ -77,6 +77,8 @@ const ChatConfigure = ({children}) => {
   useEffect(() => {
     const initializeChatSDK = async () => {
       try {
+        // disable Chat SDK logs
+        AgoraChat.logger.disableAll();
         const CHAT_APP_KEY = `${$config.CHAT_ORG_NAME}#${$config.CHAT_APP_NAME}`;
         // Initializes the Web client.
         newConn = new AgoraChat.connection({
@@ -84,10 +86,10 @@ const ChatConfigure = ({children}) => {
         });
         // Logs into Agora Chat.
         const result = await newConn.open({
-          user: data?.channel + '_' + data?.uid?.toString(),
+          user: data?.uid?.toString(),
           agoraToken: data.chat.user_token,
         });
-        logger.debug(
+        logger.log(
           LogSource.Internals,
           'CHAT',
           `Logged in User ${data.uid} to Agora Chat Server`,
@@ -97,16 +99,29 @@ const ChatConfigure = ({children}) => {
         newConn.addEventHandler('connection&message', {
           // app is connected to chat server
           onConnected: () => {
-            console.log('%cChatSDK: connected to chat server', 'color: blue');
+            logger.log(
+              LogSource.Internals,
+              'CHAT',
+              `User  ${data.uid} connected to Agora Chat Server`,
+            );
           },
 
           onFileMessage: message => {
+            if (message?.ext?.channel !== data?.channel) {
+              return;
+            }
+            logger.debug(
+              LogSource.Internals,
+              'CHAT',
+              `Received File Message`,
+              message,
+            );
             const fileUrl =
               message.ext?.from_platform === 'native'
                 ? message.url
                 : message.ext.file_url;
 
-            const fromUser = message?.from.split('_')[1];
+            const fromUser = message?.from;
 
             if (message.chatType === SDKChatType.GROUP_CHAT) {
               showMessageNotification(
@@ -151,12 +166,21 @@ const ChatConfigure = ({children}) => {
             }
           },
           onImageMessage: message => {
+            if (message?.ext?.channel !== data?.channel) {
+              return;
+            }
+            logger.debug(
+              LogSource.Internals,
+              'CHAT',
+              `Received Img Message`,
+              message,
+            );
             const fileUrl =
               message.ext?.from_platform === 'native'
                 ? message.url
                 : message.ext.file_url;
 
-            const fromUser = message?.from.split('_')[1];
+            const fromUser = message?.from;
 
             if (message.chatType === SDKChatType.GROUP_CHAT) {
               showMessageNotification(
@@ -203,14 +227,17 @@ const ChatConfigure = ({children}) => {
           },
           // text message is recieved
           onTextMessage: message => {
-            console.log(
-              '%cChatSDK: received msg: %s. from: %s',
-              'color: blue',
-              JSON.stringify(message, null, 2),
-              defaultContentRef.current[message.from]?.name,
+            if (message?.ext?.channel !== data?.channel) {
+              return;
+            }
+            logger.debug(
+              LogSource.Internals,
+              'CHAT',
+              `Received Text Message`,
+              message,
             );
 
-            const fromUser = message?.from.split('_')[1];
+            const fromUser = message?.from;
 
             if (message.chatType === SDKChatType.GROUP_CHAT) {
               // show to notifcation- group msg received
@@ -262,20 +289,14 @@ const ChatConfigure = ({children}) => {
           },
           // on token expired
           onTokenExpired: () => {
-            console.log('%cChatSDK: token has expired', 'color: blue');
+            logger.log(LogSource.Internals, 'CHAT', 'ChatSDK Token expired');
           },
           onError: error => {
-            console.log('%cChatSDK: error', 'color: blue', error);
+            logger.error(LogSource.Internals, 'CHAT', 'ChatSDK Error', error);
           },
         });
         connRef.current = newConn;
-        logger.debug(LogSource.Internals, 'CHAT', 'Initialized Chat SDK');
       } catch (error) {
-        console.log(
-          '%cChatSDK: initialization error: %s',
-          'color: red',
-          JSON.stringify(error, null, 2),
-        );
         logger.error(
           LogSource.Internals,
           'CHAT',
@@ -289,7 +310,7 @@ const ChatConfigure = ({children}) => {
     initializeChatSDK();
     return () => {
       newConn.close();
-      logger.debug(
+      logger.log(
         LogSource.Internals,
         'CHAT',
         `Logging out User ${data.uid} from Agora Chat Server`,
@@ -304,6 +325,9 @@ const ChatConfigure = ({children}) => {
     if (connRef.current) {
       //TODO thumb and url of actual image uploaded available in file upload complete
       const localFileUrl = option?.ext?.file_url || '';
+      //add channel name so to prevent cross channel message mixup when same user joins two diff channels
+      // this is filtered on msgRecived event
+      option.ext = {...option?.ext, channel: data?.channel};
       //@ts-ignore
       const msg = AgoraChat.message.create(option);
       connRef.current
@@ -331,13 +355,9 @@ const ChatConfigure = ({children}) => {
           //todo chattype as per natue type
           // this is local user messages
           if (option.chatType === SDKChatType.SINGLE_CHAT) {
-            addMessageToPrivateStore(
-              Number(option?.to.split('_')[1]),
-              messageData,
-              true,
-            );
+            addMessageToPrivateStore(Number(option?.to), messageData, true);
           } else {
-            addMessageToStore(Number(option?.from.split('_')[1]), messageData);
+            addMessageToStore(Number(option?.from), messageData);
           }
         })
         .catch(error => {
@@ -402,11 +422,9 @@ const ChatConfigure = ({children}) => {
     const CHAT_APP_KEY = `${$config.CHAT_ORG_NAME}#${$config.CHAT_APP_NAME}`;
     const uploadObj = {
       onFileUploadProgress: (data: ProgressEvent) => {
-        console.log('Chat-SDK: upload inprogress', data);
         setUploadStatus(UploadStatus.IN_PROGRESS);
       },
       onFileUploadComplete: (data: any) => {
-        console.log('Chat-SDK: upload success', data);
         const url = `${data.uri}/${data.entities[0].uuid}?em-redirect=true&share-secret=${data.entities[0]['share-secret']}`;
         //TODO: handle for multiple uploads
         setUploadedFiles(prev => {
@@ -415,7 +433,6 @@ const ChatConfigure = ({children}) => {
         setUploadStatus(UploadStatus.SUCCESS);
       },
       onFileUploadError: (error: any) => {
-        console.log('Chat-SDK: upload error', error);
         logger.error(LogSource.Internals, 'CHAT', 'Attachment upload failed');
         setUploadStatus(UploadStatus.FAILURE);
       },
@@ -451,7 +468,12 @@ const ChatConfigure = ({children}) => {
       connRef.current
         .recallMessage(option)
         .then(res => {
-          console.log('recall success', res);
+          logger.debug(
+            LogSource.Internals,
+            'CHAT',
+            'Chat Message Reacalled Success',
+            res,
+          );
         })
         .catch(err => {
           logger.debug(

package/template/src/subComponents/ChatInput.native.tsx

@@ -150,10 +150,8 @@ export const ChatTextInput = (props: ChatTextInputProps) => {
         ? SDKChatType.SINGLE_CHAT
         : SDKChatType.GROUP_CHAT,
       type: ChatMessageType.TXT,
-      from: data.channel + '_' + data.uid.toString(),
-      to: privateChatUser
-        ? data.channel + '_' + privateChatUser.toString()
-        : groupID,
+      from: data.uid.toString(),
+      to: privateChatUser ? privateChatUser.toString() : groupID,
       msg: message,
     };
     sendChatSDKMessage(option);

package/template/src/subComponents/ChatInput.tsx

@@ -145,17 +145,13 @@ export const ChatTextInput = (props: ChatTextInputProps) => {
       return;
     }
 
-    debugger;
-    console.log(data);
     const option = {
       chatType: privateChatUser
         ? SDKChatType.SINGLE_CHAT
         : SDKChatType.GROUP_CHAT,
       type: ChatMessageType.TXT,
-      from: data.channel + '_' + data.uid.toString(),
-      to: privateChatUser
-        ? data.channel + '_' + privateChatUser.toString()
-        : groupID,
+      from: data.uid.toString(),
+      to: privateChatUser ? privateChatUser.toString() : groupID,
       msg: message,
     };
     sendChatSDKMessage(option);

package/template/src/subComponents/chat/ChatActionMenu.tsx

@@ -62,7 +62,7 @@ export const ChatActionMenu = (props: CaptionsActionMenuProps) => {
   const {defaultContent} = useContent();
 
   const {
-    data: {isHost, chat, channel},
+    data: {isHost, chat},
   } = useRoomInfo();
 
   const groupID = chat.group_id;
@@ -167,13 +167,7 @@ export const ChatActionMenu = (props: CaptionsActionMenuProps) => {
           confirmLabel={confirmLabel}
           confirmLabelStyle={{color: $config.SEMANTIC_ERROR}}
           onConfirmClick={() => {
-            deleteAttachment(
-              msgId,
-              privateChatUser
-                ? channel + '_' + recallFromUser
-                : recallFromUser.toString(),
-              chatType,
-            );
+            deleteAttachment(msgId, recallFromUser.toString(), chatType);
             if (chatType === SDKChatType.SINGLE_CHAT) {
               removeMessageFromPrivateStore(msgId, isLocal);
             }

package/template/src/subComponents/chat/ChatAttachment.native.tsx

@@ -128,13 +128,11 @@ export const ChatAttachmentButton = (props: ChatAttachmentButtonProps) => {
         const option = {
           type: isImageUploaded ? ChatMessageType.IMAGE : ChatMessageType.FILE,
           url: filePath,
-          to: privateChatUser
-            ? data.channel + '_' + privateChatUser.toString()
-            : groupID,
+          to: privateChatUser ? privateChatUser.toString() : groupID,
           chatType: privateChatUser
             ? SDKChatType.SINGLE_CHAT
             : SDKChatType.GROUP_CHAT,
-          from: data.channel + '_' + data.uid.toString(),
+          from: data.uid.toString(),
           fileName: result[0].name,
           ext: {
             file_length: result[0].size,
@@ -173,13 +171,9 @@ export const ChatAttachmentButton = (props: ChatAttachmentButtonProps) => {
 
           // this is local user messages
           if (message.chatType === ChatMessageChatType.PeerChat) {
-            addMessageToPrivateStore(
-              Number(message.to.split('_')[1]),
-              messageData,
-              true,
-            );
+            addMessageToPrivateStore(Number(message.to), messageData, true);
           } else {
-            addMessageToStore(Number(message.from.split('_')[1]), messageData);
+            addMessageToStore(Number(message.from), messageData);
           }
 
           setUploadStatus(UploadStatus.SUCCESS);

package/template/src/subComponents/chat/ChatSendButton.tsx

@@ -80,10 +80,8 @@ const ChatSendButton = (props: ChatSendButtonProps) => {
         : SDKChatType.GROUP_CHAT,
       type: msgType as ChatMessageType,
       msg: msgType === ChatMessageType.TXT ? message : '', // currenlt not supporting combinarion msg (file+txt)
-      from: data.channel + '_' + data.uid.toString(),
-      to: selectedUserId
-        ? data.channel + '_' + selectedUserId.toString()
-        : groupID,
+      from: data.uid.toString(),
+      to: selectedUserId ? selectedUserId.toString() : groupID,
       ext: {
         file_length,
         file_ext,

package/template/src/subComponents/chat/ImagePopup.tsx

@@ -61,7 +61,7 @@ const ImagePopup = (props: ImagePopupProps) => {
     React.useState(false);
   const {privateChatUser} = useChatUIControls();
   const {
-    data: {isHost, chat, channel},
+    data: {isHost, chat},
   } = useRoomInfo();
   const {downloadAttachment, deleteAttachment} = useChatConfigure();
   const {removeMessageFromPrivateStore, removeMessageFromStore} =
@@ -284,13 +284,7 @@ const ImagePopup = (props: ImagePopupProps) => {
           confirmLabel={confirmLabel}
           confirmLabelStyle={{color: $config.SEMANTIC_ERROR}}
           onConfirmClick={() => {
-            deleteAttachment(
-              msgId,
-              privateChatUser
-                ? channel + '_' + recallFromUser
-                : recallFromUser.toString(),
-              chatType,
-            );
+            deleteAttachment(msgId, recallFromUser.toString(), chatType);
             if (chatType === SDKChatType.SINGLE_CHAT) {
               removeMessageFromPrivateStore(msgId, isLocal);
             }