Upgrade Coil to 3.x

README.md

@@ -18,8 +18,8 @@
 <a href="https://github.com/Gurupreet/ComposeCookBook/releases/download/latest-master/app-debug.apk" >
       <img src = "https://img.shields.io/badge/Master-Master?color=7885FF&label=Sample%20App&logo=android&style=for-the-badge" />
     </a>
-    <a href = "https://developer.android.com/jetpack/androidx/versions/all-channel#december_16_2020">
-      <img src = "https://img.shields.io/badge/Jetpack%20Compose-1.0.1-brightgreen" />
+    <a href = "https://developer.android.com/develop/ui/compose/bom/bom-mapping">
+      <img src = "https://img.shields.io/badge/Jetpack%20Compose-BOM%202024.12.01-brightgreen" />
     </a>
   <a href = "https://github.com/Gurupreet/ComposeCookBook/actions/workflows/android.yml">
       <img src = "https://github.com/Gurupreet/ComposeCookBook/actions/workflows/android.yml/badge.svg" />

app/src/main/java/com/guru/composecookbook/ui/animation/AnimationScreen.kt

@@ -10,8 +10,8 @@ import androidx.compose.material3.Divider
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -39,7 +39,7 @@ fun AnimationScreen() {
   Scaffold(
     modifier = Modifier.testTag(TestTags.ANIM_SCREEN_ROOT),
     topBar = {
-      SmallTopAppBar(
+      TopAppBar(
         title = { Text(text = "Animations") },
         navigationIcon = {
           IconButton(onClick = { animateIcon = !animateIcon }) {

app/src/main/java/com/guru/composecookbook/ui/home/advancelists/AdvanceListsActivity.kt

@@ -16,8 +16,8 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -49,7 +49,7 @@ class AdvanceListsActivity : ComponentActivity() {
         // A surface container using the 'background' color from the theme
         Scaffold(
           topBar = {
-            SmallTopAppBar(
+            TopAppBar(
               title = { Text(text = "Advance Lists(In Progress)") },
               navigationIcon = {
                 IconButton(onClick = { onBackPressed() }) {

app/src/main/java/com/guru/composecookbook/ui/home/advancelists/AnimatedLists.kt

@@ -32,7 +32,7 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import coil.compose.rememberImagePainter
+import coil3.compose.rememberAsyncImagePainter
 import com.guru.composecookbook.data.DemoDataProvider
 import com.guru.composecookbook.data.model.Tweet
 import com.guru.composecookbook.theme.typography
@@ -145,8 +145,8 @@ fun AnimatedListItem(tweet: Tweet, itemIndex: Int, animationIndex: Int) {
   Row(modifier = animatedModifier, verticalAlignment = Alignment.CenterVertically) {
     Image(
       painter =
-        rememberImagePainter(
-          data =
+        rememberAsyncImagePainter(
+          model =
             "https://picsum.photos/id/${
                     itemIndex +
                         1

app/src/main/java/com/guru/composecookbook/ui/home/customfling/FlingListActivity.kt

@@ -18,8 +18,8 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.State
 import androidx.compose.runtime.livedata.observeAsState
@@ -139,7 +139,7 @@ fun ListViewContent(
    */
   Scaffold(
     topBar = {
-      SmallTopAppBar(
+      TopAppBar(
         title = {
           Column(modifier = Modifier.padding(4.dp)) {
             /*

app/src/main/java/com/guru/composecookbook/ui/home/dialogs/DialogsActivity.kt

@@ -24,9 +24,9 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.OutlinedButton
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -77,7 +77,7 @@ class DialogsActivity : AppCompatActivity() {
 fun DialogScreen(onBack: () -> Unit) {
   Scaffold(
     topBar = {
-      SmallTopAppBar(
+      TopAppBar(
         title = { Text(text = "Dialogs") },
         navigationIcon = {
           IconButton(onClick = onBack) {

app/src/main/java/com/guru/composecookbook/ui/home/dynamic/DynamicUIActivity.kt

@@ -13,8 +13,8 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
@@ -64,7 +64,7 @@ class DynamicUIActivity : ComponentActivity() {
 fun DynamicUiWrapper(uiType: String, onback: () -> Unit) {
   Scaffold(
     topBar = {
-      SmallTopAppBar(
+      TopAppBar(
         title = { Text(text = uiType) },
         navigationIcon = {
           IconButton(onClick = onback) {

app/src/main/java/com/guru/composecookbook/ui/home/lists/ListViewActivity.kt

@@ -21,8 +21,8 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
@@ -73,7 +73,7 @@ fun BaseView(isDarkTheme: Boolean, content: @Composable () -> Unit) {
 fun ListViewContent(listType: String, onBack: () -> Unit) {
   Scaffold(
     topBar = {
-      SmallTopAppBar(
+      TopAppBar(
         title = {
           Column(modifier = Modifier.padding(4.dp)) {
             Text(text = "ListView")

app/src/main/java/com/guru/composecookbook/ui/learnwidgets/AppBars.kt

@@ -25,8 +25,8 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.SmallTopAppBar
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar as Material3TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
@@ -57,7 +57,7 @@ fun AppBars() {
 fun TopAppBarsDemo() {
   SubtitleText(subtitle = "Top App bar")
 
-  SmallTopAppBar(
+  Material3TopAppBar(
     title = { Text(text = "Home") },
     navigationIcon = {
       IconButton(onClick = {}) {

buildSrc/build.gradle.kts

@@ -39,7 +39,10 @@ dependencies {
     // in order to be able to apply "org.jetbrains.kotlin.plugin.compose" in the common scripts
     implementation("org.jetbrains.kotlin:compose-compiler-gradle-plugin:2.1.20")
 
-    // in order to be able to apply "com.google.devtools.ksp" in the common scripts
+    // in order to be able to apply "org.jetbrains.kotlin.plugin.serialization" in module scripts
+  implementation("org.jetbrains.kotlin:kotlin-serialization:2.1.20")
+
+  // in order to be able to apply "com.google.devtools.ksp" in the common scripts
     // (KSP version must match the Kotlin version above)
     implementation("com.google.devtools.ksp:symbol-processing-gradle-plugin:2.1.20-1.0.31")
 

buildSrc/src/main/kotlin/com/guru/composecookbook/build/dependencies/Dependencies.kt

@@ -17,19 +17,19 @@ object Dependencies {
     // Removed googleMaps = "com.google.android.libraries.maps:maps" as it's not publicly available
     const val playServicesMaps =
         "com.google.android.gms:play-services-maps:${Versions.playServicesMaps}"
-    const val composeUi = "androidx.compose.ui:ui:${Versions.compose}"
-    const val composeUiTooling = "androidx.compose.ui:ui-tooling:${Versions.compose}"
+    // Compose BOM keeps all androidx.compose artifacts below at compatible versions
+    const val composeBom = "androidx.compose:compose-bom:${Versions.composeBom}"
+    const val composeUi = "androidx.compose.ui:ui"
+    const val composeUiTooling = "androidx.compose.ui:ui-tooling"
     // Material Design 1 and 3 dependencies
-    const val composeMaterial = "androidx.compose.material:material:${Versions.compose}"
-    const val composeMaterial3 = "androidx.compose.material3:material3:${Versions.material3}"
-    const val composeMaterial3WindowSizeClass = "androidx.compose.material3:material3-window-size-class:${Versions.material3}"
-    const val composeMaterialIconsExtended =
-        "androidx.compose.material:material-icons-extended:${Versions.compose}"
-
+    const val composeMaterial = "androidx.compose.material:material"
+    const val composeMaterial3 = "androidx.compose.material3:material3"
+    const val composeMaterial3WindowSizeClass = "androidx.compose.material3:material3-window-size-class"
+    const val composeMaterialIconsExtended = "androidx.compose.material:material-icons-extended"
+
     // Runtime and State Management
-    const val composeRuntime = "androidx.compose.runtime:runtime:${Versions.compose}"
-    const val composeRuntimeLivedata =
-        "androidx.compose.runtime:runtime-livedata:${Versions.compose}"
+    const val composeRuntime = "androidx.compose.runtime:runtime"
+    const val composeRuntimeLivedata = "androidx.compose.runtime:runtime-livedata"
 
     // Layout and Navigation
     const val composeConstraintLayout =
@@ -41,8 +41,8 @@ object Dependencies {
     const val composeLottie = "com.airbnb.android:lottie-compose:${Versions.lottie}"
     const val composeNavigation = "androidx.navigation:navigation-compose:${Versions.navCompose}"
 
-    const val composeUiTestJunit4 = "androidx.compose.ui:ui-test-junit4:${Versions.compose}"
-    const val composeUiTestManifest = "androidx.compose.ui:ui-test-manifest:${Versions.compose}"
+    const val composeUiTestJunit4 = "androidx.compose.ui:ui-test-junit4"
+    const val composeUiTestManifest = "androidx.compose.ui:ui-test-manifest"
 
     /**
      * Custom fling behaviour
@@ -52,11 +52,13 @@ object Dependencies {
 
     const val androidPagingRuntime = "androidx.paging:paging-runtime-ktx:${Versions.paging}"
     const val lottie = "com.airbnb.android:lottie:${Versions.lottie}"
-    const val androidExoPlayer = "com.google.android.exoplayer:exoplayer:${Versions.exoplayer}"
+    const val media3Exoplayer = "androidx.media3:media3-exoplayer:${Versions.media3}"
+    const val media3Ui = "androidx.media3:media3-ui:${Versions.media3}"
     const val roomRuntime = "androidx.room:room-runtime:${Versions.room}"
     const val roomKtx = "androidx.room:room-ktx:${Versions.room}"
     const val roomCompiler = "androidx.room:room-compiler:${Versions.room}"
-    const val coilCompose = "io.coil-kt:coil-compose:${Versions.coilCompose}"
+    const val coilCompose = "io.coil-kt.coil3:coil-compose:${Versions.coilCompose}"
+    const val coilNetworkOkHttp = "io.coil-kt.coil3:coil-network-okhttp:${Versions.coilCompose}"
     const val retrofit = "com.squareup.retrofit2:retrofit:${Versions.retrofit}"
     const val okHttpLoggingInterceptor =
         "com.squareup.okhttp3:logging-interceptor:${Versions.loggingInterceptor}"
@@ -67,6 +69,8 @@ object Dependencies {
         "org.jetbrains.kotlinx:kotlinx-coroutines-core:${Versions.coroutines}"
     const val coroutinesAndroid =
         "org.jetbrains.kotlinx:kotlinx-coroutines-android:${Versions.coroutines}"
+    const val kotlinxSerializationJson =
+        "org.jetbrains.kotlinx:kotlinx-serialization-json:${Versions.kotlinxSerializationJson}"
     const val viewModelKtx =
         "androidx.lifecycle:lifecycle-viewmodel-ktx:${Versions.androidLifecycleGrouped}"
     const val liveDataKtx =

buildSrc/src/main/kotlin/com/guru/composecookbook/build/dependencies/DependencyHandlerExtensions.kt

@@ -2,7 +2,13 @@ package com.guru.composecookbook.build.dependencies
 
 import org.gradle.api.artifacts.dsl.DependencyHandler
 
+/** Imports the Compose BOM so the unversioned Compose artifacts resolve consistently. */
+private fun DependencyHandler.addComposeBom(configurationName: String) {
+    add(configurationName, platform(Dependencies.composeBom))
+}
+
 fun DependencyHandler.addComposeOfficialDependencies() {
+    addComposeBom("implementation")
     composeOfficialDependencies.forEach {
         add("implementation", it)
     }
@@ -15,6 +21,7 @@ fun DependencyHandler.addComposeThirdPartyDependencies() {
 }
 
 fun DependencyHandler.addComposeDebugDependencies() {
+    addComposeBom("debugImplementation")
     composeDebugDependencies.forEach {
         add("debugImplementation", it)
     }
@@ -33,6 +40,7 @@ fun DependencyHandler.addKotlinTestDependencies() {
 }
 
 fun DependencyHandler.addDataDependencies() {
+    addComposeBom("implementation")
     add("ksp", Dependencies.roomCompiler)
     dataDependencies.forEach {
         add("implementation", it)
@@ -76,6 +84,7 @@ fun DependencyHandler.addThirdPartyUnitTestsDependencies() {
 }
 
 fun DependencyHandler.addAndroidInstrumentationTestsDependencies() {
+    addComposeBom("androidTestImplementation")
     androidInstrumentationTestsDependencies.forEach {
         add("androidTestImplementation", it)
     }

buildSrc/src/main/kotlin/com/guru/composecookbook/build/dependencies/GroupedDependencies.kt

@@ -30,7 +30,8 @@ internal val composeDebugDependencies = listOf(
 internal val kotlinDependencies = listOf(
     Dependencies.kotlinStandardLibraryJdk8,
     Dependencies.coroutinesCore,
-    Dependencies.coroutinesAndroid
+    Dependencies.coroutinesAndroid,
+    Dependencies.kotlinxSerializationJson
 )
 
 internal val kotlinTestDependencies = listOf(
@@ -62,7 +63,8 @@ internal val coreAndroidUiDependencies = listOf(
 )
 
 internal val googleAndroidLibraries = listOf(
-    Dependencies.androidExoPlayer,
+    Dependencies.media3Exoplayer,
+    Dependencies.media3Ui,
     Dependencies.playServicesAds,
     Dependencies.playServicesMaps
     // Removed Dependencies.googleMaps as it's not available
@@ -93,6 +95,7 @@ internal val androidInstrumentationTestsDependencies = listOf(
 
 internal val thirdPartyUiDependencies = listOf(
     Dependencies.coilCompose,
+    Dependencies.coilNetworkOkHttp,
     Dependencies.lottie,
     Dependencies.composeLottie
 )

buildSrc/src/main/kotlin/com/guru/composecookbook/build/dependencies/Versions.kt

@@ -1,16 +1,17 @@
 package com.guru.composecookbook.build.dependencies
 
 internal object Versions {
-    const val compose = "1.6.1"  // Latest stable Compose UI version
+    const val composeBom = "2024.12.01"  // Compose BOM maps ui/material/runtime etc. versions
     const val activityCompose = "1.8.2"  // Latest stable
     const val pagingCompose = "3.2.1"  // Latest stable
-    const val navCompose = "2.7.7"  // Latest stable navigation
+    const val navCompose = "2.8.9"  // Stable navigation with type-safe routes
     const val constraintLayoutCompose = "1.1.0"  // Latest stable
     const val fontAwesomeCompose = "1.1.0"  // Keeping as is since it's a third-party lib
-    const val coilCompose = "2.5.0"  // Latest stable
+    const val coilCompose = "3.1.0"  // Coil 3.x (multiplatform)
     const val kotlin = "2.1.20"  // Kotlin 2.x with the K2 compiler
     const val coroutines = "1.7.3"  // Latest stable
-    const val androidLifecycleGrouped = "2.7.0"  // Latest stable
+    const val kotlinxSerializationJson = "1.8.0"  // For type-safe navigation routes
+    const val androidLifecycleGrouped = "2.8.7"  // Latest stable 2.8.x
     const val flinger = "1.0.5"  // Keeping as is since it's a third-party lib
     const val paging = "3.2.1"  // Latest stable
     const val lottie = "6.3.0"  // Latest stable
@@ -19,11 +20,10 @@ internal object Versions {
     const val appcompat = "1.6.1"  // Latest stable
     const val paletteKtx = "1.0.0"  // Latest stable
     const val material = "1.11.0"  // Latest stable Material Design 1
-    const val material3 = "1.2.1"  // Latest stable Material 3
     const val playServicesAds = "22.5.0"  // Latest stable
     const val googleMaps = "2.0.1"  // Latest Google Maps version
     const val playServicesMaps = "18.2.0"  // Latest stable
-    const val exoplayer = "2.19.1"  // Latest stable
+    const val media3 = "1.5.1"  // AndroidX Media3 (ExoPlayer successor)
     const val loggingInterceptor = "4.12.0"  // Latest stable
     const val retrofit = "2.9.0"  // Latest stable
     const val gson = "2.10.1"  // Latest stable

data/build.gradle.kts

@@ -6,5 +6,6 @@ plugins {
 android { namespace = "com.guru.composecookbook.data" }
 
 dependencies {
+  implementation(platform(com.guru.composecookbook.build.dependencies.Dependencies.composeBom))
   implementation(com.guru.composecookbook.build.dependencies.Dependencies.composeRuntime)
 }

demos/cryptoapp/app/src/main/java/com/guru/composecookbook/cryptoapp/ui/composewear/AndroidWearActivity.kt

@@ -43,7 +43,7 @@ import androidx.wear.compose.material.rememberScalingLazyListState
 import androidx.wear.compose.navigation.SwipeDismissableNavHost
 import androidx.wear.compose.navigation.composable
 import androidx.wear.compose.navigation.rememberSwipeDismissableNavController
-import coil.compose.rememberImagePainter
+import coil3.compose.rememberAsyncImagePainter
 import com.guru.composecookbook.charts.LineChart
 import com.guru.composecookbook.cryptoapp.data.db.models.Crypto
 import com.guru.composecookbook.cryptoapp.ui.home.CryptoHomeViewModel
@@ -129,7 +129,7 @@ fun WearStockListItem(crypto: Crypto, onItemSelected: (String) -> Unit) {
   Card(onClick = { onItemSelected.invoke(crypto.symbol) }, shape = MaterialTheme.shapes.small) {
     Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
       Image(
-        painter = rememberImagePainter(data = crypto.image),
+        painter = rememberAsyncImagePainter(model = crypto.image),
         modifier = Modifier.size(32.dp).padding(4.dp),
         contentDescription = null,
         contentScale = ContentScale.Crop,
@@ -159,7 +159,7 @@ fun StockDetailScreen(crypto: Crypto) {
   ) {
     Row(verticalAlignment = Alignment.CenterVertically) {
       Image(
-        painter = rememberImagePainter(data = crypto.image),
+        painter = rememberAsyncImagePainter(model = crypto.image),
         modifier = Modifier.size(24.dp).padding(end = 8.dp),
         contentDescription = null,
         contentScale = ContentScale.Crop,

demos/cryptoapp/app/src/main/java/com/guru/composecookbook/cryptoapp/ui/detail/components/CryptoDetailScreen.kt

@@ -48,7 +48,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
-import coil.compose.rememberImagePainter
+import coil3.compose.rememberAsyncImagePainter
 import com.guru.composecookbook.charts.BarCharts
 import com.guru.composecookbook.charts.LineChart
 import com.guru.composecookbook.cryptoapp.R
@@ -102,7 +102,7 @@ fun CryptoTopSection(crypto: Crypto, scrollState: ScrollState) {
     Row(modifier = Modifier.padding(top = 20.dp)) {
       Text(text = crypto.name, style = typography.h6, modifier = Modifier.padding(end = 8.dp))
       Image(
-        painter = rememberImagePainter(data = crypto.image),
+        painter = rememberAsyncImagePainter(model = crypto.image),
         modifier = Modifier.size(28.dp),
         contentDescription = null,
       )