fix(MessagesSystemGroup): Correct collapsed property. Adjust system m…

…essage type to be dependent on the length of messages in the group. If it is only one, it is forcibly and always not collapsed ( it is a normal system messages without combined header)

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>

src/components/MessagesList/MessagesGroup/MessagesSystemGroup.vue

@@ -42,7 +42,7 @@
 					:key="message.id"
 					v-bind="message"
 					:token="token"
-					is-collapsed-system-message
+					:is-collapsed-system-message="messagesCollapsed.messages?.length > 1"
 					:last-collapsed-message-id="messagesCollapsed.lastId"
 					:next-message-id="getNextMessageId(message)"
 					:previous-message-id="getPrevMessageId(message)" />
@@ -205,9 +205,16 @@ export default {
 			for (const message of messages) {
 				const groupingType = this.messagesShouldBeGrouped(message, lastMessage)
 				if (!groupingType || forceNextGroup) {
-					groups.push({ id: message.id, lastId: message.id, messages: [message], type: '', collapsed: this.groupIsCollapsed[message.id] ?? true })
+					// Update the previous group collapsed state to be equal to the length of messages if it's not defined yet
+					if (groups.at(-1) && groups.at(-1).collapsed === undefined) {
+						groups.at(-1).collapsed = groups.at(-1).messages.length > 1
+					}
+					// Adding a new group
+					groups.push({ id: message.id, lastId: message.id, messages: [message], type: '', collapsed: this.groupIsCollapsed[message.id] })
 					forceNextGroup = false
 				} else {
+					// Adding a message to the existing group
+
 					if (groupingType === 'call_reconnected') {
 						groups.push({ id: message.id, lastId: message.id, messages: [groups.at(-1).messages.pop()], type: '', collapsed: this.groupIsCollapsed[message.id] ?? true })
 						groups.at(-1).lastId = groups.at(-1).messages.at(-1).id
@@ -223,6 +230,11 @@ export default {
 					if (isLastReadInsideGroup) {
 						groups.at(-1).collapsed = false
 					}
+
+					// Update collapsed state for the last group if it's not defined yet
+					if (JSON.stringify(message) === JSON.stringify(messages.at(-1)) && groups.at(-1).collapsed === undefined) {
+						groups.at(-1).collapsed = groups.at(-1).messages.length > 1
+					}
 				}
 				lastMessage = message
 			}
@@ -232,7 +244,7 @@ export default {
 
 		toggleCollapsed(messages) {
 			this.$set(messages, 'collapsed', !messages.collapsed)
-			this.groupIsCollapsed[messages.id] = !this.groupIsCollapsed[messages.id]
+			this.groupIsCollapsed[messages.id] = messages.collapsed
 		},
 
 		getNextMessageId(message) {