diff --git a/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue b/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
index 61d3cf31d..71d60b28f 100644
--- a/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
+++ b/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
@@ -9,7 +9,7 @@ import { useI18n } from 'vue-i18n';
 import { useMessageContext } from '../provider.js';
 import BaseAttachmentBubble from './BaseAttachment.vue';
 
-const { content, sender, contentAttributes } = useMessageContext();
+const { content, sender, contentAttributes, id } = useMessageContext();
 
 const { t } = useI18n();
 
@@ -28,7 +28,7 @@ const joinTheCall = async () => {
   isLoading.value = true;
   try {
     const { data: { authResponse: { authToken } = {} } = {} } =
-      await DyteAPI.addParticipantToMeeting(meetingData.value.messageId);
+      await DyteAPI.addParticipantToMeeting(id.value);
     dyteAuthToken.value = authToken;
   } catch (err) {
     useAlert(t('INTEGRATION_SETTINGS.DYTE.JOIN_ERROR'));
@@ -53,7 +53,7 @@ const action = computed(() => ({
     sender-translation-key="CONVERSATION.SHARED_ATTACHMENT.MEETING"
     :action="action"
   >
-    <div v-if="!sender" class="text-n-slate-12 text-sm truncate">
+    <div v-if="!sender" class="text-sm truncate text-n-slate-12">
       <!-- Added as a fallback, where the sender is not available (Deleted) -->
       <!-- Will show the content, if senderName in BaseAttachment.vue is empty -->
       {{ content }}
@@ -64,7 +64,7 @@ const action = computed(() => ({
         allow="camera;microphone;fullscreen;display-capture;picture-in-picture;clipboard-write;"
       />
       <button
-        class="bg-n-solid-3 px-4 py-2 rounded-lg text-sm"
+        class="px-4 py-2 text-sm rounded-lg bg-n-solid-3"
         @click="leaveTheRoom"
       >
         {{ $t('INTEGRATION_SETTINGS.DYTE.LEAVE_THE_ROOM') }}