From 08157038e52872fcb018bf68d59bb1c5e639e322 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Tue, 28 Apr 2026 15:00:04 +0200
Subject: [PATCH] [mirotalk] - feat: persist avatar URL across sessions via
 P2P_SETTINGS localStorage

---
 .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        | 19 ++++++++++++++-----
 public/js/localStorage.js  |  1 +
 public/views/client.html   |  2 +-
 9 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/.env.template b/.env.template
index efec5d96..afe4b457 100644
--- a/.env.template
+++ b/.env.template
@@ -1,5 +1,5 @@
 # ====================================================
-# MiroTalk P2P v.1.8.18 - Environment Configuration
+# MiroTalk P2P v.1.8.19 - Environment Configuration
 # ====================================================
 
 # App environment
diff --git a/app/src/config.template.js b/app/src/config.template.js
index 4a5daa77..831d8134 100644
--- a/app/src/config.template.js
+++ b/app/src/config.template.js
@@ -2,7 +2,7 @@
 
 /**
  * ==============================================
- * MiroTalk P2P v.1.8.18 - Configuration File
+ * MiroTalk P2P v.1.8.19 - Configuration File
  * ==============================================
  *
  * This file is the central configuration source.
diff --git a/app/src/server.js b/app/src/server.js
index 55560f46..88766b94 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.18
+ * @version 1.8.19
  *
  */
 
diff --git a/package-lock.json b/package-lock.json
index add605a1..46378b30 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "mirotalk",
-    "version": "1.8.17",
+    "version": "1.8.19",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "mirotalk",
-            "version": "1.8.17",
+            "version": "1.8.19",
             "license": "AGPL-3.0",
             "dependencies": {
                 "@mattermost/client": "11.6.0",
diff --git a/package.json b/package.json
index e0d4deb7..916d2467 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalk",
-    "version": "1.8.18",
+    "version": "1.8.19",
     "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 b946eb31..496fff2d 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.18',
+        title: 'WebRTC P2P v1.8.19',
         html: `
             <button 
                 id="support-button" 
diff --git a/public/js/client.js b/public/js/client.js
index e72df247..bb7e8aa6 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.18
+ * @version 1.8.19
  *
  */
 
@@ -582,7 +582,7 @@ let thisMaxRoomParticipants = 8;
 let swBg = 'rgba(0, 0, 0, 0.7)'; // swAlert background color
 let isDocumentOnFullScreen = false;
 let isToggleExtraBtnClicked = false;
-let hasTemporaryAvatar = false;
+let hasTemporaryAvatar = !!(lsSettings.peer_avatar && isValidAvatarURL(lsSettings.peer_avatar));
 
 // peer
 let myPeerId; // This socket.id
@@ -1289,6 +1289,11 @@ function getPeerAvatar() {
     console.log('Direct join', { avatar: avatar });
 
     if (avatarDisabled || isBase64Avatar || !isValidAvatarURL(avatar)) {
+        const saved = lsSettings.peer_avatar;
+        if (saved && isValidAvatarURL(saved)) {
+            console.log('Restored avatar from localStorage', { avatar: saved });
+            return saved;
+        }
         return false;
     }
     return avatar;
@@ -12305,6 +12310,8 @@ async function updateMyPeerAvatarByUrl() {
     try {
         myPeerAvatar = result.value;
         hasTemporaryAvatar = true;
+        lsSettings.peer_avatar = myPeerAvatar;
+        lS.setSettings(lsSettings);
 
         setPeerAvatarImgName('myVideoAvatarImage', myPeerName, myPeerAvatar);
         setPeerAvatarImgName('myProfileAvatar', myPeerName, myPeerAvatar);
@@ -12313,7 +12320,7 @@ async function updateMyPeerAvatarByUrl() {
 
         emitMyPeerProfile();
 
-        userLog('toast', 'Temporary avatar applied (will reset on refresh)');
+        userLog('toast', 'Avatar saved and will persist across sessions');
     } catch (err) {
         console.error('Failed to set avatar URL', err);
         userLog('error', 'Unable to apply avatar URL');
@@ -12326,6 +12333,8 @@ async function updateMyPeerAvatarByUrl() {
 function resetMyPeerAvatarInMemory() {
     myPeerAvatar = false;
     hasTemporaryAvatar = false;
+    lsSettings.peer_avatar = '';
+    lS.setSettings(lsSettings);
     setPeerAvatarImgName('myVideoAvatarImage', myPeerName, myPeerAvatar);
     setPeerAvatarImgName('myProfileAvatar', myPeerName, myPeerAvatar);
     setPeerChatAvatarImgName('right', myPeerName, myPeerAvatar);
@@ -12333,7 +12342,7 @@ function resetMyPeerAvatarInMemory() {
 
     emitMyPeerProfile();
 
-    userLog('toast', 'Temporary avatar reset');
+    userLog('toast', 'Avatar reset and removed from storage');
 }
 
 /**
@@ -15549,7 +15558,7 @@ function showAbout() {
     Swal.fire({
         background: swBg,
         position: 'center',
-        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.18',
+        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.19',
         imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
         customClass: { image: 'img-about' },
         html: `
diff --git a/public/js/localStorage.js b/public/js/localStorage.js
index 1fce7b62..056b9e3b 100644
--- a/public/js/localStorage.js
+++ b/public/js/localStorage.js
@@ -33,6 +33,7 @@ class LocalStorage {
             theme_custom: false, // keep custom theme
             buttons_bar: 0, // vertical
             pin_grid: 0, // vertical
+            peer_avatar: '', // persisted avatar URL
         };
 
         this.DEVICES_COUNT = {
diff --git a/public/views/client.html b/public/views/client.html
index fb331a39..3b527893 100755
--- a/public/views/client.html
+++ b/public/views/client.html
@@ -1067,7 +1067,7 @@ access to use this app.
                             </div>
                             <div>
                                 <button id="myProfileAvatarUploadBtn">
-                                    <i class="fas fa-image"></i>&nbsp;Set avatar URL
+                                    <i class="fas fa-image"></i>&nbsp;Set avatar
                                 </button>
                                 <button id="myProfileAvatarResetBtn" class="hidden">
                                     <i class="fas fa-rotate-left"></i>&nbsp;Reset avatar