refactor: Migrate to coil3

MateriiApps · Jan 5, 2025 · d45e8d0 · d45e8d0
1 parent ec2245b
commit d45e8d0
Show file tree

Hide file tree

Showing 14 changed files with 76 additions and 132 deletions.
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -8,7 +8,7 @@ androidx-lifecycle-runtime-ktx = "2.8.7"
 
 # Compose
 androidx-activity-compose = "1.9.3"
-compose-multiplatform = "1.7.0-alpha03"
+compose-multiplatform = "1.7.3"
 
 # KotlinX
 kotlinx-coroutines-core = "1.9.0"
@@ -24,6 +24,7 @@ aboutlibraries = "11.4.0"
 apollo = "4.1.0"
 apollo-adapters = "0.0.4"
 buildkonfig = "0.15.2"
+coil = "3.0.4"
 compose-pdf = "1.0.0"
 compose-webview-multiplatform = "1.9.40"
 highlights = "0.7.1"
@@ -49,6 +50,11 @@ apollo-adapters-datetime = { group = "com.apollographql.adapters", name = "apoll
 apollo-normalized-cache = { group = "com.apollographql.apollo", name = "apollo-normalized-cache", version.ref = "apollo" }
 apollo-runtime = { group = "com.apollographql.apollo", name = "apollo-runtime", version.ref = "apollo" }
 
+# Coil
+coil-compose = { group = "io.coil-kt.coil3", name = "coil-compose", version.ref = "coil" }
+coil-gif = { group = "io.coil-kt.coil3", name = "coil-gif", version.ref = "coil" }
+coil-network-ktor3 = { group = "io.coil-kt.coil3", name = "coil-network-ktor3", version.ref = "coil" }
+
 # Compose
 androidx-activity-compose = { group = "androidx.activity", name = "activity-compose", version.ref = "androidx-activity-compose" }
 
@@ -82,7 +88,6 @@ voyager-transitions = { group = "cafe.adriel.voyager", name = "voyager-transitio
 
 # Misc
 aboutlibraries-core = { group = "com.mikepenz", name = "aboutlibraries-core", version.ref = "aboutlibraries" }
-compose-imageloader = { group = "io.github.qdsfdhvh", name = "image-loader", version = "1.6.4" }
 compose-pdf = { group = "dev.zt64", name = "compose-pdf", version.ref = "compose-pdf" }
 compose-webview-multiplatform = { group = "io.github.kevinnzou", name = "compose-webview-multiplatform", version.ref = "compose-webview-multiplatform" }
 highlights = { group = "dev.snipme", name = "highlights", version.ref = "highlights" }

diff --git a/ui/build.gradle.kts b/ui/build.gradle.kts
@@ -1,6 +1,3 @@
-import org.jetbrains.kotlin.gradle.ExperimentalKotlinGradlePluginApi
-
-@Suppress("DSL_SCOPE_VIOLATION") // TODO: Remove once KTIJ-19369 is fixed
 plugins {
     alias(libs.plugins.android.library)
     alias(libs.plugins.compose)
@@ -30,7 +27,6 @@ kotlin {
 
     jvmToolchain(17)
 
-    @OptIn(ExperimentalKotlinGradlePluginApi::class)
     compilerOptions {
         freeCompilerArgs.add("-Xexpect-actual-classes")
     }
@@ -48,12 +44,14 @@ kotlin {
                 implementation(compose.materialIconsExtended)
                 implementation(compose.runtime)
 
-                implementation(libs.compose.imageloader)
+                implementation(libs.coil.compose)
+                implementation(libs.coil.network.ktor3)
                 implementation(libs.compose.pdf)
                 implementation(libs.compose.webview.multiplatform)
                 implementation(libs.highlights)
                 implementation(libs.koin.core)
                 implementation(libs.koin.compose)
+                implementation(libs.ktor.client.core)
                 implementation(libs.multiplatform.paging)
                 implementation(libs.multiplatform.paging.compose)
                 implementation(libs.zoomable)
@@ -66,6 +64,7 @@ kotlin {
         val androidMain by getting {
             dependencies {
                 implementation(libs.androidx.core.ktx)
+                implementation(libs.coil.gif)
                 implementation(libs.koin.android)
             }
         }

diff --git a/.../androidMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/component/PdfPage.android.kt b/.../androidMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/component/PdfPage.android.kt
diff --git a/...idMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/viewers/ImageFileViewer.android.kt b/...idMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/viewers/ImageFileViewer.android.kt
@@ -1,15 +1,14 @@
 package com.materiiapps.gloom.ui.screen.explorer.viewers
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.gql.fragment.RepoFile
-import com.seiko.imageloader.rememberImagePainter
 import net.engawapg.lib.zoomable.rememberZoomState
 import net.engawapg.lib.zoomable.zoomable
 
@@ -20,8 +19,8 @@ actual fun ImageFileViewer(
     imageFile.url?.let { imageUrl ->
         val zoomState = rememberZoomState()
 
-        Image(
-            painter = rememberImagePainter(imageUrl),
+        AsyncImage(
+            model = imageUrl,
             contentDescription = null,
             contentScale = ContentScale.Fit,
             alignment = Alignment.Center,

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/component/Avatar.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/component/Avatar.kt
@@ -4,10 +4,10 @@ import androidx.compose.foundation.Image
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.api.dto.user.User
 import com.materiiapps.gloom.domain.manager.PreferenceManager
 import com.materiiapps.gloom.ui.util.getShapeForPref
-import com.seiko.imageloader.rememberImagePainter
 import org.koin.compose.koinInject
 
 /**
@@ -26,14 +26,13 @@ fun Avatar(
     modifier: Modifier = Modifier
 ) {
     val prefs: PreferenceManager = koinInject()
-    val painter = rememberImagePainter(url ?: "")
     val shape = when (type) {
         User.Type.ORG -> getShapeForPref(prefs.orgAvatarShape, prefs.orgAvatarRadius)
         User.Type.USER -> getShapeForPref(prefs.userAvatarShape, prefs.userAvatarRadius)
     }
 
-    Image(
-        painter = painter,
+    AsyncImage(
+        model = url,
         contentDescription = contentDescription,
         modifier = Modifier
             .clip(shape)

diff --git a/...c/commonMain/kotlin/com/materiiapps/gloom/ui/screen/explore/component/TrendingRepoItem.kt b/...c/commonMain/kotlin/com/materiiapps/gloom/ui/screen/explore/component/TrendingRepoItem.kt
@@ -28,6 +28,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.unit.dp
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.Res
 import com.materiiapps.gloom.api.dto.user.User
 import com.materiiapps.gloom.domain.manager.TrendingPeriodPreference
@@ -37,7 +38,6 @@ import com.materiiapps.gloom.ui.component.LabeledIcon
 import com.materiiapps.gloom.ui.theme.gloomColorScheme
 import com.materiiapps.gloom.ui.util.NumberFormatter
 import com.materiiapps.gloom.ui.util.parsedColor
-import com.seiko.imageloader.rememberImagePainter
 import dev.icerock.moko.resources.compose.stringResource
 
 @Composable
@@ -60,8 +60,8 @@ fun TrendingRepoItem(
             onClick = onClick
         ) {
             if (trendingRepository.usesCustomOpenGraphImage) {
-                Image(
-                    painter = rememberImagePainter(trendingRepository.openGraphImageUrl),
+                AsyncImage(
+                    model = trendingRepository.openGraphImageUrl,
                     contentDescription = null,
                     contentScale = ContentScale.Crop,
                     modifier = Modifier

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/component/PdfPage.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/explorer/component/PdfPage.kt
@@ -1,10 +1,46 @@
 package com.materiiapps.gloom.ui.screen.explorer.component
 
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import com.materiiapps.gloom.Res
+import com.materiiapps.gloom.ui.component.ErrorMessage
+import dev.icerock.moko.resources.compose.stringResource
 import dev.zt64.compose.pdf.RemotePdfState
+import net.engawapg.lib.zoomable.rememberZoomState
+import net.engawapg.lib.zoomable.zoomable
 
 @Composable
-expect fun PdfPage(
+fun PdfPage(
     pdfState: RemotePdfState,
     page: Int
-)
+) {
+    val zoomState = rememberZoomState()
+
+    Box(
+        modifier = Modifier.fillMaxSize()
+    ) {
+        dev.zt64.compose.pdf.component.PdfPage(
+            state = pdfState,
+            index = page,
+            errorIndicator = {
+                ErrorMessage(
+                    message = stringResource(Res.strings.msg_file_load_error),
+                    onRetryClick = { pdfState.loadPdf() },
+                    modifier = Modifier.align(Alignment.Center)
+                )
+            },
+            loadingIndicator = {
+                CircularProgressIndicator(
+                    modifier = Modifier.align(Alignment.Center)
+                )
+            },
+            modifier = Modifier
+                .align(Alignment.Center)
+                .zoomable(zoomState)
+        )
+    }
+}
diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/home/component/FeedActor.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/home/component/FeedActor.kt
@@ -19,9 +19,9 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.unit.dp
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.ui.component.BadgedItem
 import com.materiiapps.gloom.ui.util.thenIf
-import com.seiko.imageloader.rememberImagePainter
 
 @Composable
 fun FeedActor(
@@ -49,8 +49,8 @@ fun FeedActor(
             )
         } else null) {
             if (iconUrl != null)
-                Image(
-                    painter = rememberImagePainter(iconUrl),
+                AsyncImage(
+                    model = iconUrl,
                     contentDescription = iconDescription,
                     modifier = Modifier
                         .size(33.dp)

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/home/component/FeedRepoCard.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/home/component/FeedRepoCard.kt
@@ -33,6 +33,7 @@ import androidx.compose.ui.text.withStyle
 import androidx.compose.ui.unit.dp
 import cafe.adriel.voyager.navigator.LocalNavigator
 import cafe.adriel.voyager.navigator.currentOrThrow
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.Res
 import com.materiiapps.gloom.api.dto.user.User
 import com.materiiapps.gloom.gql.fragment.FeedRepository
@@ -44,7 +45,6 @@ import com.materiiapps.gloom.ui.util.NumberFormatter
 import com.materiiapps.gloom.ui.util.navigate
 import com.materiiapps.gloom.ui.util.parsedColor
 import com.materiiapps.gloom.ui.util.pluralStringResource
-import com.seiko.imageloader.rememberImagePainter
 import dev.icerock.moko.resources.compose.stringResource
 
 @Composable
@@ -69,8 +69,8 @@ fun FeedRepoCard(
             .fillMaxWidth()
     ) {
         if (repo.openGraphImageUrl.startsWith("https://repository-images.githubusercontent.com")) {
-            Image(
-                painter = rememberImagePainter(repo.openGraphImageUrl),
+            AsyncImage(
+                model = repo.openGraphImageUrl,
                 null,
                 contentScale = ContentScale.Crop,
                 modifier = Modifier

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/profile/ProfileScreen.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/profile/ProfileScreen.kt
@@ -74,6 +74,7 @@ import cafe.adriel.voyager.core.screen.Screen
 import cafe.adriel.voyager.core.screen.ScreenKey
 import cafe.adriel.voyager.koin.koinScreenModel
 import cafe.adriel.voyager.navigator.LocalNavigator
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.Res
 import com.materiiapps.gloom.api.dto.user.User
 import com.materiiapps.gloom.api.model.ModelRepo
@@ -111,7 +112,6 @@ import com.materiiapps.gloom.ui.util.navigate
 import com.materiiapps.gloom.ui.widget.ReadMeCard
 import com.materiiapps.gloom.ui.widget.alert.LocalAlertController
 import com.materiiapps.gloom.util.Constants
-import com.seiko.imageloader.rememberImagePainter
 import dev.icerock.moko.resources.compose.painterResource
 import dev.icerock.moko.resources.compose.pluralStringResource
 import dev.icerock.moko.resources.compose.stringResource
@@ -458,13 +458,8 @@ open class ProfileScreen(
                     .padding(5.dp)
             ) {
                 if (status.emoji != null)
-                    Image(
-                        painter = rememberImagePainter(
-                            EmojiUtil.emojis[status.emoji!!.replace(
-                                ":",
-                                ""
-                            )] ?: ""
-                        ),
+                    AsyncImage(
+                        model = EmojiUtil.emojis[status.emoji!!.replace(":", "")],
                         contentDescription = status.emoji,
                         modifier = Modifier
                             .clip(CircleShape)

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/repo/component/ContributorsRow.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/repo/component/ContributorsRow.kt
@@ -1,6 +1,5 @@
 package com.materiiapps.gloom.ui.screen.repo.component
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
@@ -24,11 +23,11 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import cafe.adriel.voyager.navigator.LocalNavigator
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.Res
 import com.materiiapps.gloom.gql.fragment.RepoDetails
 import com.materiiapps.gloom.ui.screen.profile.ProfileScreen
 import com.materiiapps.gloom.ui.util.navigate
-import com.seiko.imageloader.rememberImagePainter
 import dev.icerock.moko.resources.compose.stringResource
 
 @Composable
@@ -70,8 +69,8 @@ fun ContributorsRow(
             contributors.nodes?.let {
                 items(it) { contributor ->
                     if (contributor != null)
-                        Image(
-                            painter = rememberImagePainter(contributor.contributorAvatar.avatarUrl),
+                        AsyncImage(
+                            model = contributor.contributorAvatar.avatarUrl,
                             contentDescription = stringResource(
                                 Res.strings.noun_users_avatar,
                                 contributor.contributorAvatar.login

diff --git a/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/repo/component/IssueOrPRItem.kt b/ui/src/commonMain/kotlin/com/materiiapps/gloom/ui/screen/repo/component/IssueOrPRItem.kt
@@ -36,14 +36,14 @@ import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import coil3.compose.AsyncImage
 import com.materiiapps.gloom.Res
 import com.materiiapps.gloom.gql.type.PullRequestReviewDecision
 import com.materiiapps.gloom.gql.type.StatusState
 import com.materiiapps.gloom.ui.component.Label
 import com.materiiapps.gloom.ui.theme.gloomColorScheme
 import com.materiiapps.gloom.ui.util.TimeUtils.getTimeSince
 import com.materiiapps.gloom.ui.util.parsedColor
-import com.seiko.imageloader.rememberImagePainter
 import dev.icerock.moko.resources.StringResource
 import dev.icerock.moko.resources.compose.stringResource
 import kotlinx.datetime.Instant
@@ -150,8 +150,8 @@ fun IssueOrPRItem(
                             .clip(CircleShape)
                             .background(MaterialTheme.colorScheme.secondaryContainer)
                     ) {
-                        Image(
-                            painter = rememberImagePainter(avatarUrl),
+                        AsyncImage(
+                            model = avatarUrl,
                             contentDescription = null,
                             modifier = Modifier
                                 .size(23.dp)