From cd80bd07ca9454ce3ff9e009e376c9ac13f50994 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 12 Feb 2025 12:31:54 +0530
Subject: [PATCH] fix: TypeError - Cannot read properties of null (reading
 'name') (#10887)

---
 .../components-next/message/bubbles/BaseAttachment.vue     | 2 +-
 .../dashboard/components-next/message/bubbles/Dyte.vue     | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/app/javascript/dashboard/components-next/message/bubbles/BaseAttachment.vue b/app/javascript/dashboard/components-next/message/bubbles/BaseAttachment.vue
index 8beceee26..e10d68d64 100644
--- a/app/javascript/dashboard/components-next/message/bubbles/BaseAttachment.vue
+++ b/app/javascript/dashboard/components-next/message/bubbles/BaseAttachment.vue
@@ -24,7 +24,7 @@ const { sender } = useMessageContext();
 const { t } = useI18n();
 
 const senderName = computed(() => {
-  return sender?.value.name;
+  return sender?.value?.name || '';
 });
 </script>
 
diff --git a/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue b/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
index d1fa326b4..61d3cf31d 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 { contentAttributes } = useMessageContext();
+const { content, sender, contentAttributes } = useMessageContext();
 
 const { t } = useI18n();
 
@@ -53,6 +53,11 @@ const action = computed(() => ({
     sender-translation-key="CONVERSATION.SHARED_ATTACHMENT.MEETING"
     :action="action"
   >
+    <div v-if="!sender" class="text-n-slate-12 text-sm truncate">
+      <!-- Added as a fallback, where the sender is not available (Deleted) -->
+      <!-- Will show the content, if senderName in BaseAttachment.vue is empty -->
+      {{ content }}
+    </div>
     <div v-if="dyteAuthToken" class="video-call--container">
       <iframe
         :src="meetingLink"