From e82d09e85e5b0624023c2546b9033a0f0e9005e4 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Thu, 30 Apr 2026 10:38:38 +0200
Subject: [PATCH] [mirotalk] - fix: improve participants panel toggle behavior

---
 .env.template              |  2 +-
 app/src/config.template.js |  2 +-
 app/src/server.js          |  2 +-
 package-lock.json          |  4 ++--
 package.json               |  2 +-
 public/js/brand.js         |  2 +-
 public/js/client.js        | 46 +++++++++++++++++++++++++++++++++-----
 7 files changed, 48 insertions(+), 12 deletions(-)

diff --git a/.env.template b/.env.template
index 20c391ab..a4863202 100644
--- a/.env.template
+++ b/.env.template
@@ -1,5 +1,5 @@
 # ====================================================
-# MiroTalk P2P v.1.8.24 - Environment Configuration
+# MiroTalk P2P v.1.8.25 - Environment Configuration
 # ====================================================
 
 # App environment
diff --git a/app/src/config.template.js b/app/src/config.template.js
index 35be21a2..11775d5b 100644
--- a/app/src/config.template.js
+++ b/app/src/config.template.js
@@ -2,7 +2,7 @@
 
 /**
  * ==============================================
- * MiroTalk P2P v.1.8.24 - Configuration File
+ * MiroTalk P2P v.1.8.25 - Configuration File
  * ==============================================
  *
  * This file is the central configuration source.
diff --git a/app/src/server.js b/app/src/server.js
index d1748af4..d829b5c9 100755
--- a/app/src/server.js
+++ b/app/src/server.js
@@ -45,7 +45,7 @@ dependencies: {
  * @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.8.24
+ * @version 1.8.25
  *
  */
 
diff --git a/package-lock.json b/package-lock.json
index 4d4bc9be..c361153f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "mirotalk",
-    "version": "1.8.24",
+    "version": "1.8.25",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "mirotalk",
-            "version": "1.8.24",
+            "version": "1.8.25",
             "license": "AGPL-3.0",
             "dependencies": {
                 "@mattermost/client": "11.6.0",
diff --git a/package.json b/package.json
index 73c0caea..ab7357c1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalk",
-    "version": "1.8.24",
+    "version": "1.8.25",
     "description": "A free WebRTC browser-based video call",
     "main": "server.js",
     "scripts": {
diff --git a/public/js/brand.js b/public/js/brand.js
index cadc7ab8..da033962 100644
--- a/public/js/brand.js
+++ b/public/js/brand.js
@@ -109,7 +109,7 @@ let brand = {
     },
     about: {
         imageUrl: '../images/mirotalk-logo.gif',
-        title: 'WebRTC P2P v1.8.24',
+        title: 'WebRTC P2P v1.8.25',
         html: `
             <button 
                 id="support-button" 
diff --git a/public/js/client.js b/public/js/client.js
index cddfbde3..f18d4fa9 100644
--- a/public/js/client.js
+++ b/public/js/client.js
@@ -15,7 +15,7 @@
  * @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.8.24
+ * @version 1.8.25
  *
  */
 
@@ -685,6 +685,7 @@ let isChatPinned = false;
 let isCaptionPinned = false;
 let isChatRoomVisible = false;
 let isParticipantsVisible = false;
+let isChatOpenedByParticipantsBtn = false;
 let isCaptionBoxVisible = false;
 let isChatEmojiVisible = false;
 let isChatMarkdownOn = false;
@@ -6471,6 +6472,7 @@ function setChatRoomBtn() {
 function setParticipantsBtn() {
     participantsBtn.addEventListener('click', async (e) => {
         e.preventDefault();
+        const openedChatForParticipants = !isChatRoomVisible;
 
         if (!isMobileDevice && canBePinned()) {
             if (isCaptionPinned) {
@@ -6478,12 +6480,28 @@ function setParticipantsBtn() {
                 return;
             }
 
+            if (isChatRoomVisible && isChatPinned && msgerDraggable.classList.contains('msger-pinned-sidebar-open')) {
+                if (isChatOpenedByParticipantsBtn) {
+                    hideChatRoomAndEmojiPicker();
+                    isChatOpenedByParticipantsBtn = false;
+                    return;
+                }
+
+                msgerDraggable.classList.remove('msger-pinned-sidebar-open');
+                msgerCPBtn.classList.remove('active');
+                closeAllMsgerParticipantDropdownMenus();
+                screenReaderAccessibility.announceMessage('Participants list closed');
+                return;
+            }
+
             msgerDraggable.classList.add('msger-pinned-sidebar-open');
 
             if (!isChatRoomVisible) {
                 showChatRoomDraggable();
             }
 
+            isChatOpenedByParticipantsBtn = openedChatForParticipants;
+
             if (!isChatPinned) {
                 chatPin();
             }
@@ -6501,9 +6519,26 @@ function setParticipantsBtn() {
             showChatRoomDraggable();
         }
 
-        syncParticipantsPanelVisibility(true);
-        searchPeerBarName?.focus();
-        screenReaderAccessibility.announceMessage('Participants list opened');
+        const shouldShowParticipants = !isParticipantsVisible;
+        const shouldHideChatWithParticipants = !shouldShowParticipants && isChatOpenedByParticipantsBtn;
+
+        if (shouldHideChatWithParticipants) {
+            hideChatRoomAndEmojiPicker();
+            isChatOpenedByParticipantsBtn = false;
+            return;
+        }
+
+        isChatOpenedByParticipantsBtn = shouldShowParticipants ? openedChatForParticipants : false;
+
+        syncParticipantsPanelVisibility(shouldShowParticipants);
+
+        if (shouldShowParticipants) {
+            searchPeerBarName?.focus();
+            screenReaderAccessibility.announceMessage('Participants list opened');
+            return;
+        }
+
+        screenReaderAccessibility.announceMessage('Participants list closed');
     });
 }
 
@@ -10298,6 +10333,7 @@ function hideChatRoomAndEmojiPicker() {
     chatRoomBtn.className = className.chatOn;
     isChatRoomVisible = false;
     isParticipantsVisible = false;
+    isChatOpenedByParticipantsBtn = false;
     isChatEmojiVisible = false;
     setTippy(chatRoomBtn, 'Open the chat', bottomButtonsPlacement);
     screenReaderAccessibility.announceMessage('Chat closed');
@@ -15645,7 +15681,7 @@ function showAbout() {
     Swal.fire({
         background: swBg,
         position: 'center',
-        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.24',
+        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.25',
         imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
         customClass: { image: 'img-about' },
         html: `