From 3d5b5b221477580f39a0217554d14c48d1c11107a5bb74eeff373392c9302d0e Mon Sep 17 00:00:00 2001
From: AidarKC <i@aidarkc.ru>
Date: Sun, 26 Apr 2026 09:31:56 +0300
Subject: [PATCH] =?UTF-8?q?fix(ui):=20=D0=B2=D0=BE=D1=81=D1=81=D1=82=D0=B0?=
 =?UTF-8?q?=D0=BD=D0=BE=D0=B2=D0=B8=D1=82=D1=8C=20=D0=BF=D0=BE=D0=BA=D0=B0?=
 =?UTF-8?q?=D0=B7=20=D0=B0=D0=B2=D0=B0=D1=82=D0=B0=D1=80=D0=BE=D0=B2=20?=
 =?UTF-8?q?=D0=B8=20=D0=BA=D0=BE=D1=80=D1=80=D0=B5=D0=BA=D1=82=D0=BD=D1=8B?=
 =?UTF-8?q?=D0=B9=20fallback?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 VERSION.properties                     |  4 ++--
 shine-UI/js/components/avatar-image.js | 24 +++++++++++++-----------
 shine-UI/styles/components.css         | 18 +++++++++++++-----
 3 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/VERSION.properties b/VERSION.properties
index 2b9f94d..1e48527 100644
--- a/VERSION.properties
+++ b/VERSION.properties
@@ -1,2 +1,2 @@
-client.version=1.2.9
-server.version=1.2.9
+client.version=1.2.10
+server.version=1.2.10
diff --git a/shine-UI/js/components/avatar-image.js b/shine-UI/js/components/avatar-image.js
index c9e8f9e..229cdee 100644
--- a/shine-UI/js/components/avatar-image.js
+++ b/shine-UI/js/components/avatar-image.js
@@ -57,9 +57,13 @@ export function renderUserAvatar({
   img.alt = 'Аватар';
   img.loading = 'lazy';
   img.decoding = 'async';
-  img.hidden = true;
   wrap.append(img);
 
+  const setLoadedState = (loaded) => {
+    wrap.classList.toggle('has-image', Boolean(loaded));
+  };
+  setLoadedState(false);
+
   const gateway = state?.entrySettings?.arweaveServer;
   void getCachedAvatarObjectUrl({ gateway, txId })
     .then((objectUrl) => {
@@ -74,8 +78,7 @@ export function renderUserAvatar({
         }
       };
       img.onload = () => {
-        fallback.hidden = true;
-        img.hidden = false;
+        setLoadedState(true);
         releaseObjectUrl();
       };
       img.onerror = () => {
@@ -86,8 +89,8 @@ export function renderUserAvatar({
           return;
         }
         releaseObjectUrl();
-        img.hidden = true;
-        fallback.hidden = false;
+        img.removeAttribute('src');
+        setLoadedState(false);
       };
       img.src = objectUrl;
     })
@@ -99,17 +102,16 @@ export function renderUserAvatar({
         directUrl = '';
       }
       if (!directUrl) {
-        img.hidden = true;
-        fallback.hidden = false;
+        img.removeAttribute('src');
+        setLoadedState(false);
         return;
       }
       img.onload = () => {
-        fallback.hidden = true;
-        img.hidden = false;
+        setLoadedState(true);
       };
       img.onerror = () => {
-        img.hidden = true;
-        fallback.hidden = false;
+        img.removeAttribute('src');
+        setLoadedState(false);
       };
       img.src = directUrl;
     });
diff --git a/shine-UI/styles/components.css b/shine-UI/styles/components.css
index f8e49ba..9fe84af 100644
--- a/shine-UI/styles/components.css
+++ b/shine-UI/styles/components.css
@@ -656,11 +656,8 @@
   height: 100%;
   display: grid;
   place-items: center;
-}
-
-.avatar-fallback[hidden],
-.avatar-image img[hidden] {
-  display: none !important;
+  opacity: 1;
+  transition: opacity 120ms ease;
 }
 
 .avatar-image img,
@@ -672,6 +669,17 @@
   object-position: center;
   border-radius: 50%;
   display: block;
+  opacity: 0;
+  transition: opacity 120ms ease;
+}
+
+.avatar-image.has-image img {
+  opacity: 1;
+}
+
+.avatar-image.has-image .avatar-fallback {
+  opacity: 0;
+  visibility: hidden;
 }
 
 .meta-muted {