From b43b2fae677f0a6112ed529afb792459a46cebda Mon Sep 17 00:00:00 2001 From: Mathews Date: Wed, 21 Aug 2024 19:07:13 +0530 Subject: [PATCH] v4.3.18 --- package.json | 2 +- .../CometChatAddMembers.tsx | 3 +- .../CometChatBannedMembers.tsx | 3 + .../CometChatConversations.tsx | 142 +++++++++++------- .../ConversationsConfiguration.ts | 14 ++ .../CometChatConversationsWithMessages.tsx | 1 + .../CometChatGroupMembers.tsx | 10 ++ .../CometChatMessageList.tsx | 117 ++++++++++----- .../MessageListConfiguration.ts | 26 +++- src/shared/utils/CommonUtils.ts | 10 +- src/shared/utils/MessageUtils.tsx | 8 +- .../CometChatMessageBubble.tsx | 12 +- .../MessageBubbleStyle.ts | 4 + 13 files changed, 249 insertions(+), 103 deletions(-) diff --git a/package.json b/package.json index 6da021a..0a4f1ea 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@cometchat/chat-uikit-react-native", - "version": "4.3.17", + "version": "4.3.18", "description": "Ready-to-use Chat UI Components for React Native", "main": "src/index", "module": "src/index", diff --git a/src/CometChatAddMembers/CometChatAddMembers.tsx b/src/CometChatAddMembers/CometChatAddMembers.tsx index ce46e4f..b9be9c5 100644 --- a/src/CometChatAddMembers/CometChatAddMembers.tsx +++ b/src/CometChatAddMembers/CometChatAddMembers.tsx @@ -8,7 +8,7 @@ import { CometChatUsersInterface, CometChatUsersActionsInterface, } from '../CometChatUsers'; -import { CometChatListStylesInterface, localize } from '../shared'; +import { CometChatListStylesInterface, CometChatUiKitConstants, localize } from '../shared'; import { CometChatGroupsEvents } from '../shared/events'; import { CometChatUIEventHandler } from '../shared/events/CometChatUIEventHandler/CometChatUIEventHandler'; import { MessageTypeConstants } from '../shared/constants/UIKitConstants'; @@ -54,6 +54,7 @@ export const CometChatAddMembers = (props: CometChatAddMembersInterface) => { CometChat.RECEIVER_TYPE.GROUP, CometChat.CATEGORY_ACTION as CometChat.MessageCategory ); + action.setAction(CometChatUiKitConstants.groupMemberAction.ADDED); action.setConversationId((group as any)['conversationId']) action.setActionBy(loggedInUser.current); action.setActionFor(group); diff --git a/src/CometChatBannedMembers/CometChatBannedMembers.tsx b/src/CometChatBannedMembers/CometChatBannedMembers.tsx index ba5e1aa..3fa6087 100644 --- a/src/CometChatBannedMembers/CometChatBannedMembers.tsx +++ b/src/CometChatBannedMembers/CometChatBannedMembers.tsx @@ -11,6 +11,7 @@ import { CometChatListProps, CometChatListStylesInterface, CometChatOptions, + CometChatUiKitConstants, } from '../shared'; import { localize, ImageType } from '../shared'; import { CometChatGroupsEvents } from '../shared/events'; @@ -69,9 +70,11 @@ export const CometChatBannedMembers = ( CometChat.RECEIVER_TYPE.GROUP, CometChat.CATEGORY_ACTION as CometChat.MessageCategory ); + action.setAction(CometChatUiKitConstants.groupMemberAction.UNBANNED) action.setActionBy(loggedUserRef.current); action.setMessage(`${loggedUserRef.current['name']} unbanned ${user['name']}}`) action.setActionFor(group); + action.setActionOn(user) action.setSender(loggedUserRef.current); CometChatUIEventHandler.emitGroupEvent( diff --git a/src/CometChatConversations/CometChatConversations.tsx b/src/CometChatConversations/CometChatConversations.tsx index c20b8a9..83ba0bc 100644 --- a/src/CometChatConversations/CometChatConversations.tsx +++ b/src/CometChatConversations/CometChatConversations.tsx @@ -57,13 +57,12 @@ export interface ConversationInterface { */ disableUsersPresence?: boolean, /** - * toggle react receipt view - */ - disableReadReceipt?: boolean, - /** - * disable message receipts - */ + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ disableReceipt?: boolean, + hideReceipt?: boolean, /** * toggle typing indicator */ @@ -250,8 +249,8 @@ export const CometChatConversations = (props: ConversationInterface) => { */ const { disableUsersPresence = false, - disableReadReceipt = false, disableReceipt = false, + hideReceipt = false, disableTyping = false, disableSoundForMessages = false, customSoundForMessages, @@ -432,48 +431,74 @@ export const CometChatConversations = (props: ConversationInterface) => { } - /** - * Check if last message/unread count should be updated - * - * @param newMessage message object - */ - const shouldUpdateLastMessageAndUnreadCount = (message: CometChat.BaseMessage) => { - - /****Start: Should Threaded Messages Update Conversation? */ - if (message.getParentMessageId() && !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnMessageReplies()) { - return false; - } - /****END: Should Threaded Messages Update Conversation? */ - - /****Start: Should Custom Message Update Conversation? */ - if (message.getCategory() == CometChatUiKitConstants.MessageCategoryConstants.custom) { - let customMessage = message as CometChat.CustomMessage; - if (!customMessage.willUpdateConversation() && - !(customMessage.getMetadata() && (customMessage.getMetadata() as any)["incrementUnreadCount"]) && - !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnCustomMessages()) { - return false; - } - } - /****End: Should Custom Message Update Conversation? */ - - /****Start: Should Group Actions sent update conversation? */ - if (message.getCategory() == CometChatUiKitConstants.MessageCategoryConstants.action - && message.getReceiverType() == CometChatUiKitConstants.ReceiverTypeConstants.group - ) { - return CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnGroupActions(); - } - /****End: Should Group Actions sent update conversation? */ - - /****Start: Should Call Actions sent Update Conversation? */ - if (message.getCategory() == CometChatUiKitConstants.MessageCategoryConstants.call - && !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnCallActivities() - ) { - return false; - } - /****End: Should Call Actions sent Update Conversation */ - - return true; + /** + * Check if last message/unread count should be updated + * + * @param newMessage message object + */ + const shouldUpdateLastMessageAndUnreadCount = ( + message: CometChat.BaseMessage + ) => { + const messageReceiverType = message.getReceiverType(); + if ( + conversationsRequestBuilder && + conversationsRequestBuilder.build().getConversationType() && + conversationsRequestBuilder.build().getConversationType() != + messageReceiverType + ) { + return false; + } + /****Start: Should Threaded Messages Update Conversation? */ + if ( + message.getParentMessageId() && + !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnMessageReplies() + ) { + return false; + } + /****END: Should Threaded Messages Update Conversation? */ + + /****Start: Should Custom Message Update Conversation? */ + if ( + message.getCategory() == + CometChatUiKitConstants.MessageCategoryConstants.custom + ) { + let customMessage = message as CometChat.CustomMessage; + if ( + !customMessage.willUpdateConversation() && + !( + customMessage.getMetadata() && + (customMessage.getMetadata() as any)['incrementUnreadCount'] + ) && + !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnCustomMessages() + ) { + return false; + } } + /****End: Should Custom Message Update Conversation? */ + + /****Start: Should Group Actions sent update conversation? */ + if ( + message.getCategory() == + CometChatUiKitConstants.MessageCategoryConstants.action && + message.getReceiverType() == + CometChatUiKitConstants.ReceiverTypeConstants.group + ) { + return CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnGroupActions(); + } + /****End: Should Group Actions sent update conversation? */ + + /****Start: Should Call Actions sent Update Conversation? */ + if ( + message.getCategory() == + CometChatUiKitConstants.MessageCategoryConstants.call && + !CometChatUIKit.getConversationUpdateSettings().shouldUpdateOnCallActivities() + ) { + return false; + } + /****End: Should Call Actions sent Update Conversation */ + + return true; + }; /** * Find conversation from state and udpate its last message object. @@ -582,7 +607,7 @@ export const CometChatConversations = (props: ConversationInterface) => { */ const messageEventHandler = (...args: any[]) => { let message = args[0]; - !disableReadReceipt && markMessageAsDelivered(message); + !disableReceipt && markMessageAsDelivered(message); updateLastMessage(message); } @@ -591,6 +616,14 @@ export const CometChatConversations = (props: ConversationInterface) => { * @param {obj} message */ const groupHandler = (message: any, otherDetails: {action?: string, actionOn?: CometChat.User, actionBy?: CometChat.User, group?: CometChat.Group} = {}) => { + if ( + conversationsRequestBuilder && + conversationsRequestBuilder.build().getConversationType() && + conversationsRequestBuilder.build().getConversationType() != + CometChatUiKitConstants.ReceiverTypeConstants.group + ) { + return; + } let conversation : CometChat.Conversation = (conversationListRef.current?.getListItem(message['conversationId']) as unknown as CometChat.Conversation); let {action, actionOn, actionBy, group} = otherDetails; if (conversation) { @@ -763,7 +796,7 @@ export const CometChatConversations = (props: ConversationInterface) => { } - if (lastMessage && !disableReadReceipt && lastMessage['sender']['uid'] == loggedInUser.current?.uid && !lastMessage.getDeletedAt()) { + if (lastMessage && lastMessage['sender']['uid'] == loggedInUser.current?.uid && !lastMessage.getDeletedAt()) { let status: MessageReceipt = "ERROR"; if (lastMessage?.hasOwnProperty('readAt')) status = "READ"; @@ -771,7 +804,7 @@ export const CometChatConversations = (props: ConversationInterface) => { status = "DELIVERED"; else if (lastMessage?.hasOwnProperty("sentAt")) status = "SENT"; - readReceipt = disableReceipt ? null : { checkAndUpdateLastMessage(editedMessage) }, onMessagesRead: (messageReceipt: any) => { - messageEventHandler(messageReceipt); + updateMessageReceipt(messageReceipt); }, onMessagesDelivered: (messageReceipt: any) => { - messageEventHandler(messageReceipt); + updateMessageReceipt(messageReceipt); }, onMessagesDeliveredToAll: (messageReceipt: CometChat.MessageReceipt) => { updateMessageReceipt(messageReceipt); @@ -1184,6 +1217,9 @@ export const CometChatConversations = (props: ConversationInterface) => { userListenerId, { ccUserBlocked: ({ user }: any) => { + if(conversationsRequestBuilder && conversationsRequestBuilder.build().isIncludeBlockedUsers()) { + return; + } conversationListRef?.current?.removeItemFromList(user['conversationId']); removeItemFromSelectionList(user['conversationId']); } diff --git a/src/CometChatConversations/ConversationsConfiguration.ts b/src/CometChatConversations/ConversationsConfiguration.ts index 3ba590a..c5f3c82 100644 --- a/src/CometChatConversations/ConversationsConfiguration.ts +++ b/src/CometChatConversations/ConversationsConfiguration.ts @@ -12,7 +12,13 @@ import { BadgeStyleInterface } from "../shared/views/CometChatBadge"; export interface ConversationsConfigurationInterface { disableUsersPresence?: boolean, + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ disableReceipt?: boolean, + hideReceipt?: boolean, disableTyping?: boolean, disableSoundForMessages?: boolean, customSoundForMessages?: string, @@ -66,7 +72,13 @@ export interface ConversationsConfigurationInterface { */ export class ConversationsConfiguration implements ConversationsConfigurationInterface { disableUsersPresence?: boolean; + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ disableReceipt?: boolean; + hideReceipt?: boolean; disableTyping?: boolean; disableSoundForMessages?: boolean; customSoundForMessages?: string; @@ -117,6 +129,7 @@ export class ConversationsConfiguration implements ConversationsConfigurationInt constructor({ disableUsersPresence = false, disableReceipt = false, + hideReceipt=false, disableTyping = false, disableSoundForMessages = false, customSoundForMessages = undefined, @@ -159,6 +172,7 @@ export class ConversationsConfiguration implements ConversationsConfigurationInt }: ConversationsConfigurationInterface) { this.disableUsersPresence = disableUsersPresence; this.disableReceipt = disableReceipt; + this.hideReceipt=hideReceipt; this.disableTyping = disableTyping; this.disableSoundForMessages = disableSoundForMessages; this.customSoundForMessages = customSoundForMessages; diff --git a/src/CometChatConversationsWithMessages/CometChatConversationsWithMessages.tsx b/src/CometChatConversationsWithMessages/CometChatConversationsWithMessages.tsx index af0a3be..96261be 100644 --- a/src/CometChatConversationsWithMessages/CometChatConversationsWithMessages.tsx +++ b/src/CometChatConversationsWithMessages/CometChatConversationsWithMessages.tsx @@ -222,6 +222,7 @@ export const CometChatConversationsWithMessages = (props: CometChatConversations undefined } {..._messagesConfig} + threadedMessagesConfiguration={_messagesConfig.threadedMessageConfiguration ? _messagesConfig.threadedMessageConfiguration : {}} /> } diff --git a/src/CometChatGroupMembers/CometChatGroupMembers.tsx b/src/CometChatGroupMembers/CometChatGroupMembers.tsx index 8b90eef..995f854 100644 --- a/src/CometChatGroupMembers/CometChatGroupMembers.tsx +++ b/src/CometChatGroupMembers/CometChatGroupMembers.tsx @@ -246,6 +246,7 @@ export const CometChatGroupsMembers = (props: CometChatGroupsMembersInterface) = groupRef.current && groupRef.current?.removeItemFromList(user.uid); removeMemerFromSelectionList(user['uid']); let action: CometChat.Action = new CometChat.Action(group['guid'], MessageTypeConstants.groupMember, CometChat.RECEIVER_TYPE.GROUP, CometChat.CATEGORY_ACTION as CometChat.MessageCategory); + action.setAction(CometChatUiKitConstants.groupMemberAction.BANNED) action.setActionBy(loggedInUser.current); action.setActionOn(user); action.setActionFor(group); @@ -276,6 +277,7 @@ export const CometChatGroupsMembers = (props: CometChatGroupsMembersInterface) = group.setMembersCount(group.getMembersCount() - 1); let action: CometChat.Action = new CometChat.Action(group['guid'], MessageTypeConstants.groupMember, CometChat.RECEIVER_TYPE.GROUP, CometChat.CATEGORY_ACTION as CometChat.MessageCategory); + action.setAction(CometChatUiKitConstants.groupMemberAction.KICKED) action.setActionBy(loggedInUser.current); action.setActionOn(user); action.setActionFor(group); @@ -416,6 +418,7 @@ export const CometChatGroupsMembers = (props: CometChatGroupsMembersInterface) = groupRef.current?.updateList(updatedMember); setShowChangeScope(false); let action: CometChat.Action = new CometChat.Action(group['guid'], "groupMember", CometChat.RECEIVER_TYPE.GROUP, CometChat.CATEGORY_ACTION as CometChat.MessageCategory); + action.setAction(CometChatUiKitConstants.groupMemberAction.SCOPE_CHANGE) action.setActionBy(loggedInUser.current); action.setActionOn(member); action.setActionFor(group); @@ -424,6 +427,13 @@ export const CometChatGroupsMembers = (props: CometChatGroupsMembersInterface) = action.setMuid(String(getUnixTimestampInMilliseconds())); action.setSender(loggedInUser.current); action.setReceiver(group); + action.setData({ + extras: { + scope: { + new: newScope, + }, + }, + }) CometChatUIEventHandler.emitGroupEvent(CometChatGroupsEvents.ccGroupMemberScopeChanged, { action, updatedUser: updatedMember, scopeChangedTo: newScope, scopeChangedFrom: member.scope, group }); }) .catch((err: any) => { diff --git a/src/CometChatMessageList/CometChatMessageList.tsx b/src/CometChatMessageList/CometChatMessageList.tsx index efc4a29..94daa56 100644 --- a/src/CometChatMessageList/CometChatMessageList.tsx +++ b/src/CometChatMessageList/CometChatMessageList.tsx @@ -3,7 +3,7 @@ import { View, FlatList, Text, Image, TouchableOpacity, ActivityIndicator, Modal //@ts-ignore import { CometChat } from "@cometchat/chat-sdk-react-native"; import { LeftArrowCurve, RightArrowCurve } from "./resources"; -import { BaseStyle, BaseStyleInterface, CometChatContext, CometChatMentionsFormatter, CometChatTextFormatter, CometChatUIKit, CometChatUrlsFormatter, ImageType, SuggestionItem } from "../shared"; +import { CometChatContext, CometChatMentionsFormatter, CometChatTextFormatter, CometChatUIKit, CometChatUiKitConstants, CometChatUrlsFormatter, ImageType, SuggestionItem } from "../shared"; import { MessageBubbleStyle, MessageBubbleStyleInterface } from "../shared/views/CometChatMessageBubble/MessageBubbleStyle"; import { AvatarStyle, AvatarStyleInterface } from "../shared"; import { CometChatAvatar, CometChatDate, CometChatReceipt, DateStyle } from "../shared"; @@ -52,7 +52,13 @@ export interface CometChatMessageListProps { errorStateText?: String, hideError?: boolean, LoadingStateView?: () => JSX.Element, + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ disableReceipt?: boolean, + hideReceipt?: boolean, disableSoundForMessages?: boolean, customSoundForMessages?: string, readIcon?: ImageType, @@ -146,6 +152,7 @@ export const CometChatMessageList = memo(forwardRef< hideError, LoadingStateView, disableReceipt = false, + hideReceipt= false, disableSoundForMessages, customSoundForMessages, readIcon, @@ -290,7 +297,7 @@ export const CometChatMessageList = memo(forwardRef< })).current; // refs - const currentScrollPosition = useRef({ y: null, scrollViewHeight: 0, layoutHeight: 0 }); + const currentScrollPosition = useRef({ y: null, scrollViewHeight: 0, layoutHeight: 0, contentHeight: 0 }); const previousScrollPosition = useRef({ y: 0, scrollViewHeight: 0 }); const messagesLength = useRef(0); const prevMessagesLength = useRef(0); @@ -326,6 +333,16 @@ export const CometChatMessageList = memo(forwardRef< let lastID = useRef(0); const scrollHandler = (event: any) => { + /******************************************************************************** + * layoutMeasurement.height: The height of the visible area within the ScrollView. + * contentOffset.y: The current vertical scroll position (distance from the top of the content). + The y value in contentOffset indicates how far the top edge of the visible area is from the top of the scrollable content. + The x value (if applicable) indicates how far the left edge of the visible area is from the left of the scrollable content. + For example: + If contentOffset.y is 0, the top of the visible area is aligned with the top of the content. + If contentOffset.y is 50, the top of the visible area is 50 units (pixels) below the top of the content. + * contentSize.height: The total height of the scrollable content. + *********************************************************************************/ const { layoutMeasurement, contentOffset, contentSize } = event.nativeEvent; const screenHeight = Dimensions.get('window').height; @@ -334,6 +351,7 @@ export const CometChatMessageList = memo(forwardRef< const scrollEndPosition = contentSize.height - screenHeight; currentScrollPosition.current.y = contentOffset.y; + currentScrollPosition.current.contentHeight = contentSize.height; if (currentScrollPosition.current.layoutHeight != layoutMeasurement.height) { currentScrollPosition.current.layoutHeight = layoutMeasurement.height; @@ -465,9 +483,7 @@ export const CometChatMessageList = memo(forwardRef< .fetchNext() .then((newMessages: any[]) => { let cleanUpdatedList = [...updatedList]; - - let finalOutput = CommonUtils.mergeArrays(cleanUpdatedList, newMessages, "muid"); - + let finalOutput = CommonUtils.mergeArrays(cleanUpdatedList, newMessages, "id"); let tmpList = [...finalOutput]; tmpList = tmpList.map((item: CometChat.BaseMessage, index) => { if (item.getCategory() === MessageCategoryConstants.interactive) { @@ -485,7 +501,12 @@ export const CometChatMessageList = memo(forwardRef< } messagesContentListRef.current = tmpList; setMessagesList(tmpList); - bottomHandler(tmpList[tmpList.length - 1], true); + for(let i = newMessages.length - 1; i >= 0; i--) { + if(newMessages[i].getSender().getUid() !== loggedInUser.current.getUid()) { + bottomHandler(newMessages[i], true); + break; + } + } if (newMessages.length === 30) { getNewMessages(tmpList); } @@ -649,7 +670,8 @@ export const CometChatMessageList = memo(forwardRef< group?.getGuid() == message.getReceiverId() || false); } function checkSameConversation(message: CometChat.BaseMessage): boolean { - return message.getConversationId() == conversationId.current || message.getSender()?.['uid'] === user?.getUid(); + return message.getConversationId() == conversationId.current || + (message.getSender()?.['uid'] === user?.getUid() && message.getReceiverType() == CometChatUiKitConstants.ReceiverTypeConstants.user); } function isNearBottom() { @@ -671,12 +693,14 @@ export const CometChatMessageList = memo(forwardRef< newMessage = InteractiveMessageUtils.convertInteractiveMessage(baseMessage); } if (checkSameConversation(baseMessage) || checkMessageInSameConversation(baseMessage) || messageToSameConversation(baseMessage)) { + if(!disableReceipt) { + CometChat.markAsDelivered(newMessage); + } //need to add if (newMessage.getParentMessageId()) { if (parentMessageId && newMessage.getParentMessageId() == parseInt(parentMessageId)) { // add to list messagesContentListRef.current = [...messagesContentListRef.current, newMessage]; - inProgressMessages.current = [...inProgressMessages.current, newMessage] setMessagesList(prev => [...prev, newMessage]); } else { //increase count @@ -690,11 +714,10 @@ export const CometChatMessageList = memo(forwardRef< tmpList[index] = oldMsg; messagesContentListRef.current = tmpList; setMessagesList(tmpList); - inProgressMessages.current = [...inProgressMessages.current, newMessage] + return; } } else if (parentMessageId == undefined) { messagesContentListRef.current = [...messagesContentListRef.current, newMessage]; - inProgressMessages.current = [...inProgressMessages.current, newMessage] setMessagesList(prev => [...prev, newMessage]); } bottomHandler(newMessage, isReceived); @@ -703,32 +726,45 @@ export const CometChatMessageList = memo(forwardRef< playNotificationSound(newMessage); } - const bottomHandler = (newMessage: CometChat.BaseMessage | any, isReceived?: boolean) => { + const isAtBottom = () => { + if( + [null, undefined].includes(currentScrollPosition.current.y) + || !currentScrollPosition.current.layoutHeight + || !currentScrollPosition.current.contentHeight + ) { + return true; + } + else if (currentScrollPosition.current.layoutHeight + currentScrollPosition.current.y! >= currentScrollPosition.current.contentHeight) { + return true; + } - // if scroll is not at bottom - if (!scrollToBottomOnNewMessages && currentScrollPosition.current.y && (Math.round(currentScrollPosition.current.y) <= currentScrollPosition.current.scrollViewHeight)) { - if ((parentMessageId && newMessage.getParentMessageId() == parseInt(parentMessageId)) || (!parentMessageId && !newMessage.getParentMessageId() && (newMessage.getSender()?.getUid() || newMessage?.['sender']?.['uid']) == loggedInUser.current?.['uid'])) { - scrollToBottom(); - return; - } - CometChat.markAsDelivered(newMessage); - if (newMessage?.getReceiverType() == ReceiverTypeConstants.user) { - CometChatUIEventHandler.emitMessageEvent(MessageEvents.ccMessageDelivered, { message: newMessage }); - } - if (isNearBottom()) { - scrollToBottom(); - if (isReceived) { - markMessageAsRead(newMessage); - CometChatUIEventHandler.emitMessageEvent(MessageEvents.ccMessageRead, { message: newMessage }); - } - } else if ((!parentMessageId && !(newMessage.getParentMessageId())) || (parentMessageId && newMessage.getParentMessageId() == parseInt(parentMessageId))) { - setUnreadCount(unreadCount + 1); - } - } else { + return false; + } + + const bottomHandler = (newMessage: CometChat.BaseMessage | any, isReceived?: boolean) => { + if ((newMessage.getSender()?.getUid() || newMessage?.['sender']?.['uid']) == loggedInUser.current?.['uid']) { scrollToBottom(); - if (isReceived) { + return; + } + if(!isReceived) { + return; + } + if ( + (!parentMessageId && newMessage.getParentMessageId()) + || (parentMessageId && !newMessage.getParentMessageId()) + || (parentMessageId && newMessage.getParentMessageId() && parentMessageId != newMessage.getParentMessageId()) + ) { + return; + } + if (isAtBottom() || isNearBottom()) { + scrollToBottom(); + markMessageAsRead(newMessage) + } else { + if(scrollToBottomOnNewMessages) { + scrollToBottom(); markMessageAsRead(newMessage); - CometChatUIEventHandler.emitMessageEvent(MessageEvents.ccMessageRead, { message: newMessage }); + } else { + setUnreadCount(unreadCount + 1); } } } @@ -913,6 +949,7 @@ export const CometChatMessageList = memo(forwardRef< newMessage(message); }, onGroupMemberUnbanned: (message: any) => { + newMessage(message); }, onMemberAddedToGroup: (message: any) => { newMessage(message); @@ -928,6 +965,7 @@ export const CometChatMessageList = memo(forwardRef< { ccMessageSent: ({ message, status }: any) => { if (status == MessageStatusConstants.inprogress) { + inProgressMessages.current = [...inProgressMessages.current, message] newMessage(message, false); } @@ -1022,6 +1060,7 @@ export const CometChatMessageList = memo(forwardRef< message['message'] = `${loggedInUser.current?.getName()} added ${user.name}`; message['muid'] = String(getUnixTimestamp()); message['sentAt'] = getUnixTimestamp(); + message['actionOn'] = user; newMessage(message, false); }) }, @@ -1093,7 +1132,9 @@ export const CometChatMessageList = memo(forwardRef< connectionListenerId, new CometChat.ConnectionListener({ onConnected: () => { - getUpdatedPreviousMessages(); + if(lastID.current) { + getUpdatedPreviousMessages(); + } }, inConnecting: () => { }, @@ -1300,7 +1341,7 @@ export const CometChatMessageList = memo(forwardRef< dateAlignment="center" /> { - (!disableReceipt && alignment !== "leftAligned") && isSender ? + (!(disableReceipt || hideReceipt) && alignment !== "leftAligned") && isSender ? { - let _style = new BaseStyle({ + const getStyle = useCallback((item: CometChat.BaseMessage | any): MessageBubbleStyleInterface => { + let _style = new MessageBubbleStyle({ ..._messageBubbleStyle, backgroundColor: theme?.palette.getAccent50() }); @@ -1485,6 +1526,8 @@ export const CometChatMessageList = memo(forwardRef< if (item.getType() === MessageTypeConstants.form || item.getType() === MessageTypeConstants.card) { _style.width = "100%" } + } else { + _style.alignSelf = getAlignment(item) === "left" ? "flex-start" : "flex-end"; } if ((item.getSender()?.getUid() || item?.['sender']?.['uid']) == loggedInUser.current?.['uid']) diff --git a/src/CometChatMessageList/MessageListConfiguration.ts b/src/CometChatMessageList/MessageListConfiguration.ts index b0f79d4..fd35975 100644 --- a/src/CometChatMessageList/MessageListConfiguration.ts +++ b/src/CometChatMessageList/MessageListConfiguration.ts @@ -29,7 +29,13 @@ export interface MessageListConfigurationInterface { EmptyStateView?: () => JSX.Element; emptyStateText?: String; LoadingStateView?: () => JSX.Element; + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ disableReceipt?: boolean; + hideReceipt?: boolean; readIcon?: ImageType; deliveredIcon?: ImageType; sentIcon?: ImageType; @@ -47,7 +53,13 @@ export interface MessageListConfigurationInterface { timestampAlignment?: MessageTimeAlignmentType; templates?: CometChatMessageTemplate[]; messageRequestBuilder?: CometChat.MessagesRequestBuilder; + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'scrollToBottomOnNewMessages'. It will be removed in subsequent versions. + */ scrollToBottomOnNewMessage?: boolean; + scrollToBottomOnNewMessages?: boolean; onThreadRepliesPress?: ( messageObject: CometChat.BaseMessage, messageBubbleView: () => JSX.Element | null @@ -132,7 +144,13 @@ export class MessageListConfiguration timestampAlignment!: MessageTimeAlignmentType; templates!: CometChatMessageTemplate[]; messageRequestBuilder!: CometChat.MessagesRequestBuilder; + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'scrollToBottomOnNewMessages'. It will be removed in subsequent versions. + */ scrollToBottomOnNewMessage!: boolean; + scrollToBottomOnNewMessages!: boolean; onThreadRepliesPress?: ( messageObject: CometChat.BaseMessage, messageBubbleView: () => JSX.Element | null @@ -160,7 +178,13 @@ export class MessageListConfiguration wrapperMessageBubbleStyle!: MessageStyleInterface; actionSheetStyle!: ActionSheetStylesInterface; messageListStyle!: MessageListStyleInterface; - disableReceipt!: boolean; + /** + * @deprecated + * + * This property is deprecated as of version 4.3.18 due to newer property 'hideReceipt'. It will be removed in subsequent versions. + */ + disableReceipt?: boolean; + hideReceipt?: boolean; dateSeparatorPattern!: (item: number) => DatePattern; /** * Hides the header of the action sheet diff --git a/src/shared/utils/CommonUtils.ts b/src/shared/utils/CommonUtils.ts index 05c0edd..d73eb14 100644 --- a/src/shared/utils/CommonUtils.ts +++ b/src/shared/utils/CommonUtils.ts @@ -66,14 +66,22 @@ export class CommonUtils { let map = new Map(); arr1.forEach(obj => { + if(!obj[key]) { + map.set(Date.now(), obj); + return; + } map.set(obj[key], obj); }); arr2.forEach(obj => { - if (map.has(obj[key])) { + if (map.has(obj[key]) && obj[key]) { let mergedObj = this.mergeObjects(map.get(obj[key]), obj); map.set(obj[key], mergedObj); } else { + if(!obj[key]) { + map.set(Date.now(), obj); + return; + } map.set(obj[key], obj); } }); diff --git a/src/shared/utils/MessageUtils.tsx b/src/shared/utils/MessageUtils.tsx index e9d6ee6..37034f0 100644 --- a/src/shared/utils/MessageUtils.tsx +++ b/src/shared/utils/MessageUtils.tsx @@ -8,6 +8,7 @@ import { ChatConfigurator } from "../framework"; import { CometChatMessageTemplate } from "../modals"; import { BaseStyle, MessageBubbleAlignmentType } from "../base"; import { CometChatUiKitConstants } from ".."; +import { MessageBubbleStyle } from "../views/CometChatMessageBubble/MessageBubbleStyle"; type MessageViewType = { message: CometChat.BaseMessage, @@ -49,10 +50,11 @@ export const MessageUtils = { } = params const getStyle = (item: CometChat.BaseMessage) => { - let _style: BaseStyle = {}; - + let _style: MessageBubbleStyle = {}; + if(!(item instanceof CometChat.InteractiveMessage)) { + _style.alignSelf = alignment === "left" ? "flex-start" : "flex-end"; + } _style.backgroundColor = (alignment !== "left" && (item.getType() === MessageTypeConstants.text || item.getType() === MessageTypeConstants.meeting)) ? theme?.palette.getPrimary() : theme?.palette.getAccent50(); - return _style; }; diff --git a/src/shared/views/CometChatMessageBubble/CometChatMessageBubble.tsx b/src/shared/views/CometChatMessageBubble/CometChatMessageBubble.tsx index 64b83a3..069f858 100644 --- a/src/shared/views/CometChatMessageBubble/CometChatMessageBubble.tsx +++ b/src/shared/views/CometChatMessageBubble/CometChatMessageBubble.tsx @@ -2,7 +2,7 @@ import React, { useContext } from "react"; import { View, ViewProps } from "react-native"; import { CometChatContext } from "../../CometChatContext"; import { CometChatContextType, BaseStyleInterface } from "../../base"; -import { MessageBubbleStyle } from "./MessageBubbleStyle"; +import { MessageBubbleStyle, MessageBubbleStyleInterface } from "./MessageBubbleStyle"; import { memo } from "react"; import { MessageBubbleAlignmentType } from "../../base/Types"; @@ -61,7 +61,7 @@ export interface CometChatMessageBubbleInterface { * The style of the message bubble. * @type BaseStyleInterface */ - style?: BaseStyleInterface, + style?: MessageBubbleStyleInterface, } export const CometChatMessageBubble = memo(({ @@ -90,7 +90,8 @@ export const CometChatMessageBubble = memo(({ border, borderRadius, height, - width + width, + alignSelf } = _style; return ( @@ -119,9 +120,8 @@ export const CometChatMessageBubble = memo(({ ...border, borderRadius, backgroundColor, - ...(alignment === "left" && { alignSelf: "flex-start" }), - ...(alignment === "right" && { alignSelf: "flex-end" }) - }}> + ...(alignSelf && { alignSelf }) + } as ViewProps} > { ContentView && } diff --git a/src/shared/views/CometChatMessageBubble/MessageBubbleStyle.ts b/src/shared/views/CometChatMessageBubble/MessageBubbleStyle.ts index d5f3ee6..041dac2 100644 --- a/src/shared/views/CometChatMessageBubble/MessageBubbleStyle.ts +++ b/src/shared/views/CometChatMessageBubble/MessageBubbleStyle.ts @@ -1,15 +1,18 @@ import { BaseStyle, BaseStyleInterface, BorderStyle } from "../../base"; export interface MessageBubbleStyleInterface extends BaseStyleInterface { + alignSelf?: string; } export class MessageBubbleStyle extends BaseStyle { + alignSelf?: string; constructor({ backgroundColor = "rgba(20,20,20,0.4)", border = new BorderStyle({}), borderRadius = 8, height = "auto", width = "auto", + alignSelf = null }: MessageBubbleStyleInterface) { super({ backgroundColor, @@ -18,5 +21,6 @@ export class MessageBubbleStyle extends BaseStyle { height, width }) + this.alignSelf = alignSelf; } } \ No newline at end of file