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

@@ -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();
     });
 

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 = [

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 {