From 716a5b0dc3b13a835208410c3808db42d8e7b269 Mon Sep 17 00:00:00 2001
From: iamsivin <iamsivin@gmail.com>
Date: Thu, 15 Jan 2026 13:40:05 +0530
Subject: [PATCH] fix: TypeError: can't access property "emitsOptions", r is
 null

---
 .../dashboard/components-next/Inbox/InboxCard.vue      |  7 ++++++-
 app/javascript/dashboard/components/ui/ContextMenu.vue | 10 +++++++++-
 .../dashboard/routes/dashboard/inbox/InboxList.vue     |  3 ++-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/components-next/Inbox/InboxCard.vue b/app/javascript/dashboard/components-next/Inbox/InboxCard.vue
index 958f25048..5c6d3fb9a 100644
--- a/app/javascript/dashboard/components-next/Inbox/InboxCard.vue
+++ b/app/javascript/dashboard/components-next/Inbox/InboxCard.vue
@@ -148,7 +148,12 @@ const contextMenuActions = {
   },
 };
 
-onBeforeMount(contextMenuActions.close);
+// Reset context menu state on mount without emitting events
+// to prevent event storm when multiple cards mount simultaneously
+onBeforeMount(() => {
+  isContextMenuOpen.value = false;
+  contextMenuPosition.value = { x: null, y: null };
+});
 </script>
 
 <template>
diff --git a/app/javascript/dashboard/components/ui/ContextMenu.vue b/app/javascript/dashboard/components/ui/ContextMenu.vue
index 0773e4fd2..2db8d7710 100644
--- a/app/javascript/dashboard/components/ui/ContextMenu.vue
+++ b/app/javascript/dashboard/components/ui/ContextMenu.vue
@@ -7,7 +7,12 @@ import {
   useTemplateRef,
   inject,
 } from 'vue';
-import { useWindowSize, useElementBounding, useScrollLock } from '@vueuse/core';
+import {
+  useWindowSize,
+  useElementBounding,
+  useScrollLock,
+  onClickOutside,
+} from '@vueuse/core';
 
 import TeleportWithDirection from 'dashboard/components-next/TeleportWithDirection.vue';
 
@@ -77,6 +82,9 @@ const handleClose = () => {
   emit('close');
 };
 
+// Close menu when clicking outside
+onClickOutside(menuRef, handleClose);
+
 onUnmounted(() => {
   isLocked.value = false;
 });
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue b/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
index 9828f9e17..7c0cd0218 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
+++ b/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
@@ -234,7 +234,8 @@ onMounted(() => {
       />
       <div
         ref="notificationList"
-        class="flex flex-col gap-0.5 w-full h-[calc(100%-56px)] pb-4 overflow-x-hidden px-2 overflow-y-auto divide-y divide-n-weak [&>*:hover]:!border-y-transparent [&>*.active]:!border-y-transparent [&>*:hover+*]:!border-t-transparent [&>*.active+*]:!border-t-transparent"
+        class="flex flex-col gap-0.5 w-full h-[calc(100%-56px)] pb-4 overflow-x-hidden px-2 divide-y divide-n-weak [&>*:hover]:!border-y-transparent [&>*.active]:!border-y-transparent [&>*:hover+*]:!border-t-transparent [&>*.active+*]:!border-t-transparent"
+        :class="isInboxContextMenuOpen ? 'overflow-hidden' : 'overflow-y-auto'"
       >
         <InboxCard
           v-for="notificationItem in notifications"