From de2d6c409f97093967419002407a5bb0adf312fb Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Sun, 28 Sep 2025 00:02:57 -0400
Subject: [PATCH] Make modal overflow menu reuse card actions

---
 assets/svg/ellipsis.svg     | 14 ++++++---
 components/video-modal.html | 12 ++++---
 js/app.js                   | 62 ++++++++++++++++++++++++++++---------
 3 files changed, 66 insertions(+), 22 deletions(-)

diff --git a/assets/svg/ellipsis.svg b/assets/svg/ellipsis.svg
index 18556f8c..ca2af607 100644
--- a/assets/svg/ellipsis.svg
+++ b/assets/svg/ellipsis.svg
@@ -1,5 +1,11 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="5" cy="12" r="2" fill="currentColor" />
-  <circle cx="12" cy="12" r="2" fill="currentColor" />
-  <circle cx="19" cy="12" r="2" fill="currentColor" />
+<svg
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <circle cx="5" cy="12" r="2" fill="#ffffff" />
+  <circle cx="12" cy="12" r="2" fill="#ffffff" />
+  <circle cx="19" cy="12" r="2" fill="#ffffff" />
 </svg>
diff --git a/components/video-modal.html b/components/video-modal.html
index 81f5c635..cccfa219 100644
--- a/components/video-modal.html
+++ b/components/video-modal.html
@@ -55,25 +55,29 @@
               <div class="py-1">
                 <button
                   class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="modal-open-channel"
+                  data-action="open-channel"
+                  data-context="modal"
                 >
                   Open channel
                 </button>
                 <button
                   class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="modal-copy-link"
+                  data-action="copy-link"
+                  data-context="modal"
                 >
                   Copy link
                 </button>
                 <button
                   class="block w-full text-left px-4 py-2 text-sm text-red-400 hover:bg-red-700 hover:text-white"
-                  data-action="modal-block-author"
+                  data-action="block-author"
+                  data-context="modal"
                 >
                   Block creator
                 </button>
                 <button
                   class="block w-full text-left px-4 py-2 text-sm text-gray-100 hover:bg-gray-700"
-                  data-action="modal-report"
+                  data-action="report"
+                  data-context="modal"
                 >
                   Report
                 </button>
diff --git a/js/app.js b/js/app.js
index 75a261ac..7509f987 100644
--- a/js/app.js
+++ b/js/app.js
@@ -1068,6 +1068,8 @@ class bitvidApp {
     if (this.playerModal) {
       this.attachMoreMenuHandlers(this.playerModal);
     }
+
+    this.syncModalMoreMenuData();
   }
 
   goToProfile(pubkey) {
@@ -6002,12 +6004,49 @@ class bitvidApp {
     });
   }
 
+  syncModalMoreMenuData() {
+    if (!this.modalMoreMenu) {
+      return;
+    }
+
+    const buttons = this.modalMoreMenu.querySelectorAll("button[data-action]");
+    buttons.forEach((button) => {
+      if (!(button instanceof HTMLElement)) {
+        return;
+      }
+
+      const action = button.dataset.action || "";
+      if (action === "open-channel" || action === "block-author") {
+        if (this.currentVideo && this.currentVideo.pubkey) {
+          button.dataset.author = this.currentVideo.pubkey;
+        } else {
+          delete button.dataset.author;
+        }
+      }
+
+      if (action === "copy-link" || action === "report") {
+        if (this.currentVideo && this.currentVideo.id) {
+          button.dataset.eventId = this.currentVideo.id;
+        } else {
+          delete button.dataset.eventId;
+        }
+      }
+    });
+  }
+
   handleMoreMenuAction(action, dataset = {}) {
     const normalized = typeof action === "string" ? action.trim() : "";
+    const context = dataset.context || "";
 
     switch (normalized) {
       case "open-channel": {
-        const author = dataset.author || "";
+        if (context === "modal") {
+          this.openCreatorChannel();
+          break;
+        }
+
+        const author =
+          dataset.author || (this.currentVideo ? this.currentVideo.pubkey : "");
         if (author) {
           this.goToProfile(author);
         } else {
@@ -6015,17 +6054,10 @@ class bitvidApp {
         }
         break;
       }
-      case "modal-open-channel": {
-        this.openCreatorChannel();
-        break;
-      }
-      case "copy-link":
-      case "modal-copy-link": {
+      case "copy-link": {
         const eventId =
           dataset.eventId ||
-          (normalized === "modal-copy-link" && this.currentVideo
-            ? this.currentVideo.id
-            : "");
+          (context === "modal" && this.currentVideo ? this.currentVideo.id : "");
         if (!eventId) {
           this.showError("Could not generate link.");
           break;
@@ -6041,13 +6073,11 @@ class bitvidApp {
           .catch(() => this.showError("Failed to copy the link."));
         break;
       }
-      case "block-author":
-      case "modal-block-author": {
+      case "block-author": {
         this.showSuccess("Block management coming soon.");
         break;
       }
-      case "report":
-      case "modal-report": {
+      case "report": {
         this.showSuccess("Reporting coming soon.");
         break;
       }
@@ -7136,6 +7166,8 @@ class bitvidApp {
       lightningAddress: null,
     };
 
+    this.syncModalMoreMenuData();
+
     this.currentMagnetUri = sanitizedMagnet || null;
 
     this.setCopyMagnetState(!!sanitizedMagnet);
@@ -7251,6 +7283,8 @@ class bitvidApp {
       lightningAddress: null,
     };
 
+    this.syncModalMoreMenuData();
+
     this.currentMagnetUri = sanitizedMagnet || null;
 
     this.setCopyMagnetState(!!sanitizedMagnet);