From 53f251c52a1eed36513ae878c1bbbb6063f0ed80 Mon Sep 17 00:00:00 2001
From: Wolfsblvt <wolfsblvt@gmail.com>
Date: Mon, 20 Apr 2026 00:44:33 +0200
Subject: [PATCH] Fix: Prevent "Show More Messages" Button from Triggering
 Message Edit Mode (#5486)

* fix: prevent event bubbling on show more messages button

Replace mouseup/touchend with click event and add stopPropagation/preventDefault to prevent unintended event bubbling when loading more messages.

* Add hover style to "show more messages"

* add button role to show_more_messages

---------

Co-authored-by: Cohee <18619528+Cohee1207@users.noreply.github.com>
---
 public/script.js       | 4 +++-
 public/scripts/a11y.js | 1 +
 public/style.css       | 5 +++++
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/public/script.js b/public/script.js
index aaa2040c1..185431c15 100644
--- a/public/script.js
+++ b/public/script.js
@@ -12490,7 +12490,9 @@ jQuery(async function () {
         $('#avatar-and-name-block').slideToggle();
     });
 
-    $(document).on('mouseup touchend', '#show_more_messages', async function () {
+    $(document).on('click', '#show_more_messages', async function (event) {
+        event.stopPropagation();
+        event.preventDefault();
         await showMoreMessages();
     });
 
diff --git a/public/scripts/a11y.js b/public/scripts/a11y.js
index 78ebf898a..888a857fa 100644
--- a/public/scripts/a11y.js
+++ b/public/scripts/a11y.js
@@ -16,6 +16,7 @@ const buttonSelectors = [
     '.jg-menu .jg-button',
     '.bg_example .mobile-only-menu-toggle',
     '.paginationjs-pages li a',
+    '#show_more_messages',
 ].join(', ');
 
 const listSelectors = [
diff --git a/public/style.css b/public/style.css
index 3f332dbb0..afae0767f 100644
--- a/public/style.css
+++ b/public/style.css
@@ -6067,6 +6067,11 @@ body:not(.movingUI) .drawer-content.maximized {
     width: fit-content;
     border-radius: 10px;
     outline: 1px solid var(--SmartThemeBorderColor);
+    transition: filter var(--animation-duration-2x) ease-in-out;
+}
+
+#show_more_messages:hover {
+    filter: brightness(1.25);
 }
 
 .draggable img {