From a31f183b7b498432ba37f42a529432a6d1f537ee Mon Sep 17 00:00:00 2001
From: Usman Baig <mubaig@pm.me>
Date: Thu, 19 Mar 2026 00:48:46 +0100
Subject: [PATCH] fix: recalculate notification dropdown position after content
 loads

The dropdown position was only clamped on initial render when the panel
was empty. After async notifications loaded and the panel grew taller,
the position was never recalculated. Add an effect that re-clamps when
notifications or loading state changes.
---
 components/notifications/NotificationCenter.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/components/notifications/NotificationCenter.tsx b/components/notifications/NotificationCenter.tsx
index 8c50045..cbbb0b3 100644
--- a/components/notifications/NotificationCenter.tsx
+++ b/components/notifications/NotificationCenter.tsx
@@ -104,6 +104,13 @@ export default function NotificationCenter({ anchor = 'bottom', variant = 'defau
     }
   }, [open, updatePosition])
 
+  // Recalculate position after content changes (notifications load, loading state)
+  useEffect(() => {
+    if (open && anchor === 'right') {
+      requestAnimationFrame(() => updatePosition())
+    }
+  }, [notifications, loading, open, anchor, updatePosition])
+
   // * Poll unread count in background (when authenticated)
   useEffect(() => {
     fetchUnreadCount()