From a6bd33fdf8c81d304e7a473b4540b5f3e59e6407 Mon Sep 17 00:00:00 2001
From: Noah Petherbridge <root@kirsle.net>
Date: Wed, 7 Aug 2024 23:30:19 -0700
Subject: [PATCH] Fix mute notification links on unread notifications

---
 web/templates/account/dashboard.html | 37 +++++++++++++++++++++-------
 1 file changed, 28 insertions(+), 9 deletions(-)

diff --git a/web/templates/account/dashboard.html b/web/templates/account/dashboard.html
index 84ffee1..2cec78c 100644
--- a/web/templates/account/dashboard.html
+++ b/web/templates/account/dashboard.html
@@ -666,19 +666,21 @@
                                                     <!-- Contextual "Unsubscribe" buttons -->
                                                     {{if or (eq .Type "also_posted") (eq .Type "also_comment")}}
                                                     <small>
-                                                        <a href="/comments/subscription?table_name={{.TableName}}&table_id={{.TableID}}&next={{UrlEncode $Root.Request.URL.String}}&subscribe=false"
-                                                            class="has-text-warning is-small"
-                                                            title="Turn off notifications about this thread"
-                                                            onclick="return confirm('Do you want to TURN OFF notifications about this comment thread?')">
+                                                        <a href="#"
+                                                            data-link="/comments/subscription?table_name={{.TableName}}&table_id={{.TableID}}&next={{UrlEncode $Root.Request.URL.String}}&subscribe=false"
+                                                            data-confirm="Do you want to TURN OFF notifications about this comment thread?"
+                                                            class="has-text-warning is-small nonshy-mute-notification-link"
+                                                            title="Turn off notifications about this thread">
                                                             <i class="fa fa-microphone-slash mr-1"></i> Mute this thread
                                                         </a>
                                                     </small>
                                                     {{else if eq .Type "new_photo"}}
                                                     <small>
-                                                        <a href="/comments/subscription?table_name=friend.photos&table_id={{.AboutUser.Username}}&next={{UrlEncode $Root.Request.URL.String}}&subscribe=false"
-                                                            class="has-text-warning is-small"
-                                                            title="Turn off notifications about @{{.AboutUser.Username}}'s new photo uploads"
-                                                            onclick="return confirm('Do you want to TURN OFF notifications about @{{.AboutUser.Username}}\'s new photo uploads?\n\nNote: to re-subscribe to their new photo notifications, see the link at the top of @{{.AboutUser.Username}}\'s Photo Gallery page.')">
+                                                        <a href="#"
+                                                            data-link="/comments/subscription?table_name=friend.photos&table_id={{.AboutUser.Username}}&next={{UrlEncode $Root.Request.URL.String}}&subscribe=false"
+                                                            data-confirm="Do you want to TURN OFF notifications about @{{.AboutUser.Username}}\'s new photo uploads?\n\nNote: to re-subscribe to their new photo notifications, see the link at the top of @{{.AboutUser.Username}}\'s Photo Gallery page."
+                                                            class="has-text-warning is-small nonshy-mute-notification-link"
+                                                            title="Turn off notifications about @{{.AboutUser.Username}}'s new photo uploads">
                                                             <i class="fa fa-microphone-slash mr-1"></i> Mute these notifications
                                                         </a>
                                                     </small>
@@ -854,13 +856,30 @@ document.addEventListener('DOMContentLoaded', () => {
                     window.alert(resp);
                 }).finally(() => {
                     busy = false;
-                    if (href !== undefined) {
+                    if (href !== undefined && href !== "#") {
                         window.location.href = href;
                     }
                 });
             })
         });
     });
+
+    // "Mute notification" links.
+    // NOTE: to avoid conflict with the "mark notification as read, then follow href" code
+    // above, the mute buttons href is made safer and this function will get its follow-thru
+    // URL from a data attribute.
+    (document.querySelectorAll(".nonshy-mute-notification-link") || []).forEach(node => {
+        node.addEventListener("click", (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+
+            const link = node.dataset.link,
+                prompt = node.dataset.confirm;
+            if (!window.confirm(prompt)) return;
+
+            window.location = link;
+        });
+    });
 });
 </script>
 {{end}}