From 9400508f3e26ac762b807924fb98d10f0bf3b5b7 Mon Sep 17 00:00:00 2001
From: Laan Tungir <laantungir@proton.md>
Date: Wed, 1 Jul 2026 16:50:21 -0400
Subject: [PATCH] Fix notifications: keep interaction bar detached so only
 dropdown menu shows

---
 www/js/version.json    |  6 +++---
 www/notifications.html | 26 +++++++++++++++-----------
 2 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/www/js/version.json b/www/js/version.json
index a160e6f..171c25f 100644
--- a/www/js/version.json
+++ b/www/js/version.json
@@ -1,5 +1,5 @@
 {
-  "VERSION": "v0.7.88",
-  "VERSION_NUMBER": "0.7.88",
-  "BUILD_DATE": "2026-07-01T19:56:16.258Z"
+  "VERSION": "v0.7.89",
+  "VERSION_NUMBER": "0.7.89",
+  "BUILD_DATE": "2026-07-01T20:50:21.925Z"
 }
diff --git a/www/notifications.html b/www/notifications.html
index 4f89753..90fd3b4 100644
--- a/www/notifications.html
+++ b/www/notifications.html
@@ -457,6 +457,7 @@ import { createProfileCache } from './js/profile-cache.mjs';
     const timeElements = new Map();
     const postImageCache = new Map();
     const targetEventCache = new Map();
+    const detachedInteractionBars = new Map();
     let interactions = null;
     let notifInteractionsSubId = null;
     let visibleNotificationsCount = NOTIFICATIONS_PAGE_SIZE;
@@ -1104,21 +1105,22 @@ import { createProfileCache } from './js/profile-cache.mjs';
       // Add interaction menu items (Like, Comment, Quote, Zap, Nutzap) when
       // the notification references a target post.  The actual interaction
       // logic (publishing, zap dialogs, balance checks) is handled by the
-      // post-interactions module via a hidden interaction bar appended to
-      // the row.  Menu items trigger clicks on the corresponding buttons
-      // in that hidden bar.
+      // post-interactions module via a detached interaction bar (kept out of
+      // the DOM so it never shows up in the row).  Menu items trigger clicks
+      // on the corresponding buttons in that detached bar.
       if (item.targetEventId && interactions) {
         const targetPubkey = item.targetPubkey || currentPubkey;
         const targetEventData = { id: item.targetEventId, pubkey: targetPubkey };
 
-        const hiddenBar = interactions.renderInteractionBar(
-          item.targetEventId,
-          targetEventData,
-          { currentPubkey }
-        );
-        hiddenBar.style.display = 'none';
-        hiddenBar.dataset.notifHiddenBar = item.targetEventId;
-        row.appendChild(hiddenBar);
+        let hiddenBar = detachedInteractionBars.get(item.id);
+        if (!hiddenBar) {
+          hiddenBar = interactions.renderInteractionBar(
+            item.targetEventId,
+            targetEventData,
+            { currentPubkey }
+          );
+          detachedInteractionBars.set(item.id, hiddenBar);
+        }
 
         const addMenuBtn = (label, selector) => {
           const btn = document.createElement('button');
@@ -1206,6 +1208,7 @@ import { createProfileCache } from './js/profile-cache.mjs';
 
       divNotifications.innerHTML = '';
       timeElements.clear();
+      detachedInteractionBars.clear();
 
       for (const item of visibleItems) {
         const row = buildNotificationRow(item);
@@ -1502,6 +1505,7 @@ import { createProfileCache } from './js/profile-cache.mjs';
       notificationsReadAt = readAt;
       notificationsById.clear();
       unreadNotificationsById.clear();
+      detachedInteractionBars.clear();
       visibleNotificationsCount = NOTIFICATIONS_PAGE_SIZE;
       renderNotifications();