fix(deps): update coil to v3.2.0

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemImageView.kt

@@ -102,7 +102,7 @@ fun TimelineItemImageView(
                             }
                         ),
                     model = content.thumbnailMediaRequestData,
-                    contentScale = ContentScale.Fit,
+                    contentScale = ContentScale.Crop,
                     alignment = Alignment.Center,
                     contentDescription = description,
                     onState = { isLoaded = it is AsyncImagePainter.State.Success },

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemStickerView.kt

@@ -76,7 +76,7 @@ fun TimelineItemStickerView(
                             mimeType = content.mimeType,
                         ),
                     ),
-                    contentScale = ContentScale.Fit,
+                    contentScale = ContentScale.Crop,
                     alignment = Alignment.Center,
                     contentDescription = description,
                     onState = { isLoaded = it is AsyncImagePainter.State.Success },

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemVideoView.kt

@@ -122,7 +122,7 @@ fun TimelineItemVideoView(
                             height = content.thumbnailHeight?.toLong() ?: MAX_THUMBNAIL_HEIGHT,
                         )
                     ),
-                    contentScale = ContentScale.Fit,
+                    contentScale = ContentScale.Crop,
                     alignment = Alignment.Center,
                     contentDescription = description,
                     onState = { isLoaded = it is AsyncImagePainter.State.Success },

features/rageshake/impl/src/main/kotlin/io/element/android/features/rageshake/impl/bugreport/BugReportView.kt

@@ -41,7 +41,6 @@ import io.element.android.libraries.designsystem.components.preferences.Preferen
 import io.element.android.libraries.designsystem.modifiers.onTabOrEnterKeyFocusNext
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
-import io.element.android.libraries.designsystem.preview.debugPlaceholderBackground
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Text
@@ -74,8 +73,8 @@ fun BugReportView(
                 TextField(
                     value = descriptionFieldState,
                     modifier = Modifier
-                            .fillMaxWidth()
-                            .onTabOrEnterKeyFocusNext(LocalFocusManager.current),
+                        .fillMaxWidth()
+                        .onTabOrEnterKeyFocusNext(LocalFocusManager.current),
                     enabled = isFormEnabled,
                     placeholder = stringResource(id = R.string.screen_bug_report_editor_placeholder),
                     supportingText = stringResource(id = R.string.screen_bug_report_editor_description),
@@ -139,7 +138,6 @@ fun BugReportView(
                             modifier = Modifier.fillMaxWidth(fraction = 0.5f),
                             model = model,
                             contentDescription = null,
-                            placeholder = debugPlaceholderBackground(),
                         )
                     }
                 }
@@ -152,8 +150,8 @@ fun BugReportView(
                     enabled = state.submitEnabled,
                     showProgress = state.sending.isLoading(),
                     modifier = Modifier
-                            .fillMaxWidth()
-                            .padding(top = 24.dp, bottom = 16.dp)
+                        .fillMaxWidth()
+                        .padding(top = 24.dp, bottom = 16.dp)
                 )
             }
         }

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/rolesandpermissions/changeroles/ChangeRolesView.kt

@@ -64,6 +64,7 @@ import io.element.android.libraries.designsystem.theme.components.SearchBarResul
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TextButton
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.matrix.api.room.RoomMember
 import io.element.android.libraries.matrix.api.room.RoomMembershipState
@@ -397,7 +398,9 @@ internal fun ChangeRolesViewPreview(@PreviewParameter(ChangeRolesStateProvider::
 @PreviewsDayNight
 @Composable
 internal fun PendingMemberRowWithLongNamePreview() {
-    ElementPreview {
+    ElementPreview(
+        drawableFallbackForImages = CommonDrawables.sample_avatar,
+    ) {
         MemberRow(
             avatarData = AvatarData("userId", "A very long name that should be truncated", "https://example.com/avatar.png", AvatarSize.UserListItem),
             name = "A very long name that should be truncated",

features/verifysession/impl/src/main/kotlin/io/element/android/features/verifysession/impl/ui/VerificationUserProfileContent.kt

@@ -28,6 +28,7 @@ import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.core.UserId
 
 @Composable
@@ -42,7 +43,8 @@ fun VerificationUserProfileContent(
     }
 
     Row(
-        modifier = modifier.fillMaxWidth()
+        modifier = modifier
+            .fillMaxWidth()
             .clip(RoundedCornerShape(8.dp))
             .background(ElementTheme.colors.bgSubtleSecondary)
             .padding(12.dp),
@@ -64,7 +66,9 @@ fun VerificationUserProfileContent(
 
 @PreviewsDayNight
 @Composable
-internal fun VerificationUserProfileContentPreview() = ElementPreview {
+internal fun VerificationUserProfileContentPreview() = ElementPreview(
+    drawableFallbackForImages = CommonDrawables.sample_avatar
+) {
     VerificationUserProfileContent(
         userId = UserId("@alice:example.com"),
         displayName = "Alice",

gradle/libs.versions.toml

@@ -38,7 +38,7 @@ serialization_json = "1.8.1"
 
 #other
 detekt = "1.23.8"
-coil = "3.1.0"
+coil = "3.2.0"
 showkase = "1.0.3"
 appyx = "1.7.1"
 sqldelight = "2.1.0"

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/Bloom.kt

@@ -59,13 +59,11 @@ import androidx.compose.ui.graphics.nativeCanvas
 import androidx.compose.ui.graphics.painter.BitmapPainter
 import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.input.nestedscroll.nestedScroll
-import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalFontFamilyResolver
 import androidx.compose.ui.platform.LocalLayoutDirection
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontStyle
@@ -92,9 +90,10 @@ import com.airbnb.android.showkase.annotation.ShowkaseComposable
 import com.vanniktech.blurhash.BlurHash
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
-import io.element.android.libraries.designsystem.R
 import io.element.android.libraries.designsystem.colors.AvatarColorsProvider
+import io.element.android.libraries.designsystem.components.avatar.Avatar
 import io.element.android.libraries.designsystem.components.avatar.AvatarData
+import io.element.android.libraries.designsystem.components.avatar.AvatarSize
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.preview.PreviewsDayNight
@@ -103,6 +102,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.MediumTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.persistentListOf
 import kotlinx.coroutines.Dispatchers
@@ -465,7 +465,9 @@ internal fun BloomPreview() {
     var topAppBarHeight by remember { mutableIntStateOf(-1) }
     val topAppBarState = rememberTopAppBarState()
     val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(topAppBarState)
-    ElementPreview {
+    ElementPreview(
+        drawableFallbackForImages = CommonDrawables.sample_avatar,
+    ) {
         Scaffold(
             modifier = Modifier
                 .fillMaxSize()
@@ -489,14 +491,13 @@ internal fun BloomPreview() {
                             scrolledContainerColor = Color.Black.copy(alpha = 0.05f),
                         ),
                         navigationIcon = {
-                            Image(
-                                modifier = Modifier
-                                    .padding(start = 8.dp)
-                                    .size(32.dp)
-                                    .clip(CircleShape),
-                                painter = painterResource(id = R.drawable.sample_avatar),
-                                contentScale = ContentScale.Crop,
-                                contentDescription = null
+                            Avatar(
+                                avatarData = AvatarData(
+                                    id = "sample-avatar",
+                                    name = "sample",
+                                    url = "aURL",
+                                    size = AvatarSize.CurrentUserTopBar,
+                                ),
                             )
                         },
                         actions = {

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt

@@ -21,25 +21,23 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.semantics.contentDescription
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import coil3.compose.AsyncImage
 import coil3.compose.AsyncImagePainter
 import coil3.compose.SubcomposeAsyncImage
 import coil3.compose.SubcomposeAsyncImageContent
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.colors.AvatarColorsProvider
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
-import io.element.android.libraries.designsystem.preview.debugPlaceholderAvatar
 import io.element.android.libraries.designsystem.text.toSp
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import timber.log.Timber
 
 @Composable
@@ -79,41 +77,30 @@ private fun ImageAvatar(
     modifier: Modifier = Modifier,
     contentDescription: String? = null,
 ) {
-    if (LocalInspectionMode.current) {
-        // For compose previews, use debugPlaceholderAvatar()
-        // instead of falling back to initials avatar on load failure
-        AsyncImage(
-            model = avatarData,
-            contentDescription = contentDescription,
-            placeholder = debugPlaceholderAvatar(),
-            modifier = modifier
-        )
-    } else {
-        SubcomposeAsyncImage(
-            model = avatarData,
-            contentDescription = contentDescription,
-            contentScale = ContentScale.Crop,
-            modifier = modifier
-        ) {
-            val collectedState by painter.state.collectAsState()
-            when (val state = collectedState) {
-                is AsyncImagePainter.State.Success -> SubcomposeAsyncImageContent()
-                is AsyncImagePainter.State.Error -> {
-                    SideEffect {
-                        Timber.e(state.result.throwable, "Error loading avatar $state\n${state.result}")
-                    }
-                    InitialsAvatar(
-                        avatarData = avatarData,
-                        forcedAvatarSize = forcedAvatarSize,
-                        contentDescription = contentDescription,
-                    )
+    SubcomposeAsyncImage(
+        model = avatarData,
+        contentDescription = contentDescription,
+        contentScale = ContentScale.Crop,
+        modifier = modifier
+    ) {
+        val collectedState by painter.state.collectAsState()
+        when (val state = collectedState) {
+            is AsyncImagePainter.State.Success -> SubcomposeAsyncImageContent()
+            is AsyncImagePainter.State.Error -> {
+                SideEffect {
+                    Timber.e(state.result.throwable, "Error loading avatar $state\n${state.result}")
                 }
-                else -> InitialsAvatar(
+                InitialsAvatar(
                     avatarData = avatarData,
                     forcedAvatarSize = forcedAvatarSize,
                     contentDescription = contentDescription,
                 )
             }
+            else -> InitialsAvatar(
+                avatarData = avatarData,
+                forcedAvatarSize = forcedAvatarSize,
+                contentDescription = contentDescription,
+            )
         }
     }
 }
@@ -151,7 +138,9 @@ private fun InitialsAvatar(
 @Preview(group = PreviewGroup.Avatars)
 @Composable
 internal fun AvatarPreview(@PreviewParameter(AvatarDataProvider::class) avatarData: AvatarData) =
-    ElementThemedPreview {
+    ElementThemedPreview(
+        drawableFallbackForImages = CommonDrawables.sample_avatar,
+    ) {
         Row(
             verticalAlignment = Alignment.CenterVertically,
             horizontalArrangement = Arrangement.spacedBy(16.dp)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/preview/ElementPreview.kt

@@ -7,24 +7,36 @@
 
 package io.element.android.libraries.designsystem.preview
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.ui.platform.LocalContext
+import androidx.core.content.res.ResourcesCompat
 import coil3.annotation.ExperimentalCoilApi
+import coil3.asImage
 import coil3.compose.AsyncImagePreviewHandler
 import coil3.compose.LocalAsyncImagePreviewHandler
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.theme.components.Surface
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @OptIn(ExperimentalCoilApi::class)
 @Composable
 @Suppress("ModifierMissing")
 fun ElementPreview(
     darkTheme: Boolean = isSystemInDarkTheme(),
     showBackground: Boolean = true,
+    @DrawableRes
+    drawableFallbackForImages: Int = CommonDrawables.sample_background,
     content: @Composable () -> Unit
 ) {
-    CompositionLocalProvider(LocalAsyncImagePreviewHandler provides AsyncImagePreviewHandler { null }) {
+    val context = LocalContext.current
+    CompositionLocalProvider(
+        LocalAsyncImagePreviewHandler provides AsyncImagePreviewHandler {
+            ResourcesCompat.getDrawable(context.resources, drawableFallbackForImages, null)!!.asImage()
+        }
+    ) {
         ElementTheme(darkTheme = darkTheme) {
             if (showBackground) {
                 // If we have a proper contentColor applied we need a Surface instead of a Box

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/preview/ElementThemedPreview.kt

@@ -7,6 +7,7 @@
 
 package io.element.android.libraries.designsystem.preview
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -19,12 +20,15 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Composable
 @Suppress("ModifierMissing")
 fun ElementThemedPreview(
     showBackground: Boolean = true,
     vertical: Boolean = true,
+    @DrawableRes
+    drawableFallbackForImages: Int = CommonDrawables.sample_background,
     content: @Composable () -> Unit,
 ) {
     Box(
@@ -37,12 +41,14 @@ fun ElementThemedPreview(
                 ElementPreview(
                     darkTheme = false,
                     showBackground = showBackground,
+                    drawableFallbackForImages = drawableFallbackForImages,
                     content = content,
                 )
                 Spacer(modifier = Modifier.height(4.dp))
                 ElementPreview(
                     darkTheme = true,
                     showBackground = showBackground,
+                    drawableFallbackForImages = drawableFallbackForImages,
                     content = content
                 )
             }
@@ -51,12 +57,14 @@ fun ElementThemedPreview(
                 ElementPreview(
                     darkTheme = false,
                     showBackground = showBackground,
+                    drawableFallbackForImages = drawableFallbackForImages,
                     content = content,
                 )
                 Spacer(modifier = Modifier.width(4.dp))
                 ElementPreview(
                     darkTheme = true,
                     showBackground = showBackground,
+                    drawableFallbackForImages = drawableFallbackForImages,
                     content = content
                 )
             }