From 3c227f804882a7b5b0cac1d50e0e88c704f28d1e Mon Sep 17 00:00:00 2001
From: iamsivin <iamsivin@gmail.com>
Date: Mon, 27 Jan 2025 18:55:51 +0530
Subject: [PATCH] chore: Minor fix

---
 .../components-next/message/Message.vue       | 22 ++++---------------
 .../components-next/message/MessageList.vue   | 17 ++++++++++----
 2 files changed, 17 insertions(+), 22 deletions(-)

diff --git a/app/javascript/dashboard/components-next/message/Message.vue b/app/javascript/dashboard/components-next/message/Message.vue
index ece62a3e3..1a5cc47eb 100644
--- a/app/javascript/dashboard/components-next/message/Message.vue
+++ b/app/javascript/dashboard/components-next/message/Message.vue
@@ -97,8 +97,6 @@ import ContextMenu from 'dashboard/modules/conversations/components/MessageConte
 // eslint-disable-next-line vue/define-macros-order
 const props = defineProps({
   id: { type: Number, required: true },
-  messages: { type: Array, default: () => [] },
-  index: { type: Number, required: true },
   messageType: {
     type: Number,
     required: true,
@@ -176,6 +174,10 @@ const variant = computed(() => {
 });
 
 const isMyMessage = computed(() => {
+  if (props.messageType === MESSAGE_TYPES.ACTIVITY) {
+    return false;
+  }
+
   // if an outgoing message is still processing, then it's definitely a
   // message sent by the current user
   if (
@@ -185,10 +187,6 @@ const isMyMessage = computed(() => {
     return true;
   }
 
-  if (props.messageType === MESSAGE_TYPES.ACTIVITY) {
-    return false;
-  }
-
   const senderId = props.senderId ?? props.sender?.id;
   const senderType = props.senderType ?? props.sender?.type;
 
@@ -365,17 +363,6 @@ const shouldRenderMessage = computed(() => {
   );
 });
 
-const messageSpacingClass = computed(() => {
-  // Non-activity messages only need to check groupWithNext
-  if (props.messageType !== MESSAGE_TYPES.ACTIVITY) {
-    return props.groupWithNext ? 'mb-1' : 'mb-6';
-  }
-
-  // For activity messages, check if next message exists and is also an activity
-  const nextMessage = props.messages?.[props.index + 1];
-  return nextMessage?.messageType === MESSAGE_TYPES.ACTIVITY ? 'mb-2' : 'mb-6';
-});
-
 function openContextMenu(e) {
   const shouldSkipContextMenu =
     e.target?.classList.contains('skip-context-menu') ||
@@ -467,7 +454,6 @@ provideMessageContext({
     :data-message-id="props.id"
     :class="[
       flexOrientationClass,
-      messageSpacingClass,
       {
         'group-with-next': shouldGroupWithNext,
         'bg-n-alpha-1': showBackgroundHighlight,
diff --git a/app/javascript/dashboard/components-next/message/MessageList.vue b/app/javascript/dashboard/components-next/message/MessageList.vue
index 7ce080d72..d6cb14e21 100644
--- a/app/javascript/dashboard/components-next/message/MessageList.vue
+++ b/app/javascript/dashboard/components-next/message/MessageList.vue
@@ -107,6 +107,17 @@ const getInReplyToMessage = parentMessage => {
 
   return replyMessage ? useCamelCase(replyMessage) : null;
 };
+
+const getMessageSpacingClass = (message, messages, index) => {
+  // For non-activity messages, use groupWithNext logic
+  if (message.messageType !== MESSAGE_TYPES.ACTIVITY) {
+    return shouldGroupWithNext(index, messages) ? 'mb-1' : 'mb-6';
+  }
+
+  // For activity messages, check next message exists and is also an activity
+  const nextMessage = messages[index + 1];
+  return nextMessage?.messageType === MESSAGE_TYPES.ACTIVITY ? 'mb-2' : 'mb-6';
+};
 </script>
 
 <template>
@@ -115,13 +126,12 @@ const getInReplyToMessage = parentMessage => {
     <template v-for="(message, index) in read" :key="message.id">
       <Message
         v-bind="message"
-        :messages="read"
-        :index="index"
         :is-email-inbox="isAnEmailChannel"
         :in-reply-to="getInReplyToMessage(message)"
         :group-with-next="shouldGroupWithNext(index, read)"
         :inbox-supports-reply-to="inboxSupportsReplyTo"
         :current-user-id="currentUserId"
+        :class="getMessageSpacingClass(message, read, index)"
         data-clarity-mask="True"
       />
     </template>
@@ -129,13 +139,12 @@ const getInReplyToMessage = parentMessage => {
     <template v-for="(message, index) in unread" :key="message.id">
       <Message
         v-bind="message"
-        :messages="unread"
-        :index="index"
         :in-reply-to="getInReplyToMessage(message)"
         :group-with-next="shouldGroupWithNext(index, unread)"
         :inbox-supports-reply-to="inboxSupportsReplyTo"
         :current-user-id="currentUserId"
         :is-email-inbox="isAnEmailChannel"
+        :class="getMessageSpacingClass(message, unread, index)"
         data-clarity-mask="True"
       />
     </template>