Fix avatar scaling issue when expanding the header in the Avatar tab

homeUi/src/main/kotlin/com/gravatar/app/homeUi/presentation/home/components/AsyncImageWithCachePlaceholder.kt

@@ -20,9 +20,8 @@ import coil.request.ImageRequest
 internal fun AsyncImageWithCachePlaceholder(
     url: String,
     modifier: Modifier = Modifier,
-    onLoadedState: (Boolean) -> Unit = {},
 ) {
-    var oldImage: MemoryCache.Key? by remember {
+    var oldImageKey: MemoryCache.Key? by remember {
         mutableStateOf(null)
     }
 
@@ -31,20 +30,17 @@ internal fun AsyncImageWithCachePlaceholder(
             .data(url)
             .diskCachePolicy(CachePolicy.ENABLED)
             .memoryCachePolicy(CachePolicy.ENABLED)
-            .placeholderMemoryCacheKey(oldImage)
+            .placeholderMemoryCacheKey(oldImageKey)
             .placeholder(Color.LightGray.toArgb().toDrawable())
-            .listener { _, successResult ->
-                oldImage = successResult.memoryCacheKey
-            }
             .build(),
         contentDescription = null,
         contentScale = ContentScale.Crop,
-        onLoading = {
-            onLoadedState.invoke(false)
-        },
-        onSuccess = {
-            onLoadedState.invoke(true)
-        },
-        modifier = modifier
+        modifier = modifier,
+        onSuccess = { state ->
+            val newKey = state.result.memoryCacheKey
+            if (newKey != oldImageKey) {
+                oldImageKey = newKey
+            }
+        }
     )
 }

homeUi/src/main/kotlin/com/gravatar/app/homeUi/presentation/home/components/GravatarAvatarWithShadow.kt

@@ -1,12 +1,10 @@
 package com.gravatar.app.homeUi.presentation.home.components
 
 import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
@@ -29,28 +27,12 @@ internal fun GravatarAvatarWithShadow(
         )
     }
 
-    var loaded by remember {
-        mutableStateOf(false)
-    }
-
-    val finalModifier = remember(loaded, borderShape, modifier) {
-        if (loaded) {
-            modifier
-                .clip(borderShape)
-                .background(Brush.linearGradient(colorStops = colorStops))
-                .padding(1.dp)
-                .shadow(1.dp, borderShape)
-        } else {
-            modifier
-                .padding(1.dp)
-                .clip(borderShape)
-        }
-    }
-    Box(
-        modifier = finalModifier
-    ) {
-        AsyncImageWithCachePlaceholder(url, Modifier.clip(borderShape), onLoadedState = {
-            loaded = it
-        })
-    }
+    AsyncImageWithCachePlaceholder(
+        url = url,
+        modifier = modifier
+            .clip(borderShape)
+            .background(Brush.linearGradient(colorStops = colorStops))
+            .padding(1.dp)
+            .shadow(1.dp, borderShape),
+    )
 }