diff --git a/stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContent.kt b/stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContent.kt index 135faa3694b..8fff197138b 100644 --- a/stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContent.kt +++ b/stream-chat-android-compose/src/main/java/io/getstream/chat/android/compose/ui/attachments/content/GiphyAttachmentContent.kt @@ -31,12 +31,16 @@ import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider +import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.derivedStateOf import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.geometry.isSpecified import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.toArgb import androidx.compose.ui.layout.ContentScale @@ -52,6 +56,7 @@ import coil3.compose.LocalAsyncImagePreviewHandler import io.getstream.chat.android.client.utils.attachment.isGiphy import io.getstream.chat.android.compose.R import io.getstream.chat.android.compose.state.messages.attachments.AttachmentState +import io.getstream.chat.android.compose.ui.components.ShimmerProgressIndicator import io.getstream.chat.android.compose.ui.theme.ChatTheme import io.getstream.chat.android.compose.ui.theme.StreamDimens import io.getstream.chat.android.compose.ui.util.AsyncImagePreviewHandler @@ -178,6 +183,8 @@ public fun GiphyAttachmentContent( val width = ChatTheme.dimens.attachmentsContentGiphyWidth val height = ChatTheme.dimens.attachmentsContentGiphyHeight + var downloadedRatio by remember(previewUrl) { mutableStateOf(null) } + val giphyDimensions: DpSize by remember(key1 = giphyInfo) { derivedStateOf { if (giphyInfo != null) { @@ -208,7 +215,18 @@ public fun GiphyAttachmentContent( } } } else { - DpSize(maxWidth, maxHeight) + val ratio = downloadedRatio + if (ratio == null) { + val side = minOf(maxWidth, maxHeight) + DpSize(side, side) + } else { + calculateResultingDimensions( + maxWidth = maxWidth, + maxHeight = maxHeight, + giphyWidth = ratio.dp, + giphyHeight = 1.dp, + ) + } } } } @@ -233,12 +251,38 @@ public fun GiphyAttachmentContent( onLongClick = { onLongItemClick(message) }, ), ) { - StreamAsyncImage( - data = giphyInfo?.url ?: attachment.giphyFallbackPreviewUrl, - modifier = Modifier.fillMaxSize(), - contentDescription = null, - contentScale = contentScale, - ) + if (giphyInfo == null) { + StreamAsyncImage( + data = attachment.giphyFallbackPreviewUrl, + modifier = Modifier.fillMaxSize(), + contentScale = contentScale, + ) { imageState -> + val painter = imageState.painter + val intrinsicSize = painter?.intrinsicSize + LaunchedEffect(intrinsicSize) { + if (intrinsicSize != null && intrinsicSize.isSpecified && intrinsicSize.height > 0f) { + downloadedRatio = intrinsicSize.width / intrinsicSize.height + } + } + if (painter == null) { + ShimmerProgressIndicator(modifier = Modifier.matchParentSize()) + } else { + Image( + painter = painter, + contentDescription = null, + modifier = Modifier.matchParentSize(), + contentScale = contentScale, + ) + } + } + } else { + StreamAsyncImage( + data = giphyInfo.url, + modifier = Modifier.fillMaxSize(), + contentDescription = null, + contentScale = contentScale, + ) + } Image( modifier = Modifier diff --git a/stream-chat-android-compose/src/test/snapshots/images/io.getstream.chat.android.compose.ui.attachments.content_AttachmentsContentTest_giphy_attachment_content.png b/stream-chat-android-compose/src/test/snapshots/images/io.getstream.chat.android.compose.ui.attachments.content_AttachmentsContentTest_giphy_attachment_content.png index b7868d54ce1..54eb58c74da 100644 Binary files a/stream-chat-android-compose/src/test/snapshots/images/io.getstream.chat.android.compose.ui.attachments.content_AttachmentsContentTest_giphy_attachment_content.png and b/stream-chat-android-compose/src/test/snapshots/images/io.getstream.chat.android.compose.ui.attachments.content_AttachmentsContentTest_giphy_attachment_content.png differ