Migrate project to use StateFlow and latest guidance (#854)

Author: Manuel Vivo

README.md

@@ -9,7 +9,7 @@ In this branch you'll find:
 *   User Interface built with **[Jetpack Compose](https://developer.android.com/jetpack/compose)** 
 *   A single-activity architecture, using **[Navigation Compose](https://developer.android.com/jetpack/compose/navigation)**.
 *   A presentation layer that contains a Compose screen (View) and a **ViewModel** per screen (or feature).
-*   Reactive UIs using **[LiveData](https://developer.android.com/topic/libraries/architecture/livedata)** and **[coroutines](https://kotlinlang.org/docs/coroutines-overview.html)** for asynchronous operations.
+*   Reactive UIs using **[Flow](https://developer.android.com/kotlin/flow)** and **[coroutines](https://kotlinlang.org/docs/coroutines-overview.html)** for asynchronous operations.
 *   A **data layer** with a repository and two data sources (local using Room and a fake remote).
 *   Two **product flavors**, `mock` and `prod`, [to ease development and testing](https://android-developers.googleblog.com/2015/12/leveraging-product-flavors-in-android.html).
 *   A collection of unit, integration and e2e **tests**, including "shared" tests that can be run on emulator/device or Robolectric.
@@ -24,6 +24,7 @@ This project hosts each sample app in separate repository branches. For more inf
 | ------------- | ------------- |
 | [main](https://github.com/googlesamples/android-architecture/tree/main) | This branch |
 | [hilt](https://github.com/googlesamples/android-architecture/tree/hilt) | A simple Hilt setup that removes the two flavors and service locator (not using Compose yet) |
+| [livedata](https://github.com/googlesamples/android-architecture/tree/livedata) | Uses LiveData instead of StateFlow as the data stream solution |
 | [usecases](https://github.com/googlesamples/android-architecture/tree/usecases) | Adds a new domain layer that uses UseCases for business logic (not using Compose yet) |
 | [views](https://github.com/googlesamples/android-architecture/tree/views) | Uses Views instead of Jetpack Compose to render UI elements on the screen |
 

app/build.gradle

@@ -80,11 +80,6 @@ android {
         compose true
     }
 
-    dataBinding {
-        enabled = true
-        enabledForTests = true
-    }
-
     compileOptions {
         sourceCompatibility = 1.8
         targetCompatibility = 1.8
@@ -111,27 +106,23 @@ android {
                 apiLevel = 30
                 // You can also specify "google" if you require Google Play Services.
                 systemImageSource = "aosp-atd"
-                abi = "x86"
             }
             pixel2api30(com.android.build.api.dsl.ManagedVirtualDevice) {
                 // Use device profiles you typically see in Android Studio
                 device = "Pixel 2"
                 apiLevel = 30
                 // You can also specify "google" if you require Google Play Services.
                 systemImageSource = "aosp"
-                abi = "x86"
             }
             pixel2api27(com.android.build.api.dsl.ManagedVirtualDevice) {
                 device = "Pixel 2"
                 apiLevel = 27
                 systemImageSource = "aosp"
-                abi = "x86"
             }
             nexus9api29(com.android.build.api.dsl.ManagedVirtualDevice) {
                 device = "Nexus 9"
                 apiLevel = 29
                 systemImageSource = "aosp"
-                abi = "x86"
             }
         }
     }
@@ -155,15 +146,14 @@ dependencies {
     implementation "androidx.room:room-runtime:$roomVersion"
     kapt "androidx.room:room-compiler:$roomVersion"
     implementation "androidx.room:room-ktx:$roomVersion"
+    implementation "androidx.lifecycle:lifecycle-runtime-ktx:$archLifecycleVersion"
     implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:$archLifecycleVersion"
-    implementation "androidx.lifecycle:lifecycle-livedata-ktx:$archLifecycleVersion"
 
     // Jetpack Compose
     implementation "androidx.activity:activity-compose:$activityComposeVersion"
     implementation "androidx.compose.material:material:$composeVersion"
     implementation "androidx.compose.animation:animation:$composeVersion"
     implementation "androidx.compose.ui:ui-tooling-preview:$composeVersion"
-    implementation "androidx.compose.runtime:runtime-livedata:$composeVersion"
     implementation "androidx.navigation:navigation-compose:$navigationVersion"
     implementation "androidx.lifecycle:lifecycle-viewmodel-compose:$archLifecycleVersion"
     implementation "com.google.accompanist:accompanist-appcompat-theme:$accompanistVersion"

app/src/androidTestMock/java/com/example/android/architecture/blueprints/todoapp/tasks/TasksScreenTest.kt

@@ -256,6 +256,7 @@ class TasksScreenTest {
                     TasksScreen(
                         viewModel = TasksViewModel(repository, SavedStateHandle()),
                         userMessage = R.string.successfully_added_task_message,
+                        onUserMessageDisplayed = { },
                         onAddTask = { },
                         onTaskClick = { },
                         openDrawer = { }

app/src/main/java/com/example/android/architecture/blueprints/todoapp/TodoNavGraph.kt

@@ -25,6 +25,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Modifier
+import androidx.lifecycle.viewmodel.compose.viewModel
 import androidx.navigation.NavHostController
 import androidx.navigation.NavType
 import androidx.navigation.compose.NavHost
@@ -36,10 +37,13 @@ import com.example.android.architecture.blueprints.todoapp.TodoDestinationsArgs.
 import com.example.android.architecture.blueprints.todoapp.TodoDestinationsArgs.TITLE_ARG
 import com.example.android.architecture.blueprints.todoapp.TodoDestinationsArgs.USER_MESSAGE_ARG
 import com.example.android.architecture.blueprints.todoapp.addedittask.AddEditTaskScreen
+import com.example.android.architecture.blueprints.todoapp.addedittask.AddEditTaskViewModel
 import com.example.android.architecture.blueprints.todoapp.statistics.StatisticsScreen
 import com.example.android.architecture.blueprints.todoapp.taskdetail.TaskDetailScreen
+import com.example.android.architecture.blueprints.todoapp.taskdetail.TaskDetailViewModel
 import com.example.android.architecture.blueprints.todoapp.tasks.TasksScreen
 import com.example.android.architecture.blueprints.todoapp.util.AppModalDrawer
+import com.example.android.architecture.blueprints.todoapp.util.getViewModelFactory
 import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.launch
 
@@ -71,6 +75,7 @@ fun TodoNavGraph(
             AppModalDrawer(drawerState, currentRoute, navActions) {
                 TasksScreen(
                     userMessage = entry.arguments?.getInt(USER_MESSAGE_ARG)!!,
+                    onUserMessageDisplayed = { entry.arguments?.putInt(USER_MESSAGE_ARG, 0) },
                     onAddTask = { navActions.navigateToAddEditTask(R.string.add_task, null) },
                     onTaskClick = { task -> navActions.navigateToTaskDetail(task.id) },
                     openDrawer = { coroutineScope.launch { drawerState.open() } }
@@ -90,9 +95,12 @@ fun TodoNavGraph(
             )
         ) { entry ->
             val taskId = entry.arguments?.getString(TASK_ID_ARG)
+            val viewModel: AddEditTaskViewModel = viewModel(
+                factory = getViewModelFactory(entry.arguments)
+            )
             AddEditTaskScreen(
+                viewModel = viewModel,
                 topBarTitle = entry.arguments?.getInt(TITLE_ARG)!!,
-                taskId = taskId,
                 onTaskUpdate = {
                     navActions.navigateToTasks(
                         if (taskId == null) ADD_EDIT_RESULT_OK else EDIT_RESULT_OK
@@ -102,8 +110,11 @@ fun TodoNavGraph(
             )
         }
         composable(TodoDestinations.TASK_DETAIL_ROUTE) { entry ->
+            val viewModel: TaskDetailViewModel = viewModel(
+                factory = getViewModelFactory(entry.arguments)
+            )
             TaskDetailScreen(
-                taskId = entry.arguments?.getString(TASK_ID_ARG)!!,
+                viewModel = viewModel,
                 onEditTask = { taskId ->
                     navActions.navigateToAddEditTask(R.string.edit_task, taskId)
                 },

app/src/main/java/com/example/android/architecture/blueprints/todoapp/ViewModelFactory.kt

@@ -45,9 +45,9 @@ class ViewModelFactory constructor(
             isAssignableFrom(StatisticsViewModel::class.java) ->
                 StatisticsViewModel(tasksRepository)
             isAssignableFrom(TaskDetailViewModel::class.java) ->
-                TaskDetailViewModel(tasksRepository)
+                TaskDetailViewModel(tasksRepository, handle)
             isAssignableFrom(AddEditTaskViewModel::class.java) ->
-                AddEditTaskViewModel(tasksRepository)
+                AddEditTaskViewModel(tasksRepository, handle)
             isAssignableFrom(TasksViewModel::class.java) ->
                 TasksViewModel(tasksRepository, handle)
             else ->

app/src/main/java/com/example/android/architecture/blueprints/todoapp/addedittask/AddEditTaskScreen.kt

@@ -29,58 +29,72 @@ import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.OutlinedTextField
 import androidx.compose.material.Scaffold
+import androidx.compose.material.ScaffoldState
 import androidx.compose.material.Text
 import androidx.compose.material.TextFieldDefaults
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Done
+import androidx.compose.material.rememberScaffoldState
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
-import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.dimensionResource
 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 com.example.android.architecture.blueprints.todoapp.R
 import com.example.android.architecture.blueprints.todoapp.util.AddEditTaskTopAppBar
-import com.example.android.architecture.blueprints.todoapp.util.getViewModelFactory
+import com.example.android.architecture.blueprints.todoapp.util.collectAsStateWithLifecycle
 import com.google.accompanist.swiperefresh.SwipeRefresh
 import com.google.accompanist.swiperefresh.rememberSwipeRefreshState
 
 @Composable
 fun AddEditTaskScreen(
+    viewModel: AddEditTaskViewModel,
     @StringRes topBarTitle: Int,
-    taskId: String?,
     onTaskUpdate: () -> Unit,
     onBack: () -> Unit,
     modifier: Modifier = Modifier,
-    viewModel: AddEditTaskViewModel = viewModel(factory = getViewModelFactory()),
-    state: AddEditTaskState = rememberAddEditTaskState(taskId, viewModel, onTaskUpdate)
+    scaffoldState: ScaffoldState = rememberScaffoldState()
 ) {
     Scaffold(
         modifier = modifier.fillMaxSize(),
-        scaffoldState = state.scaffoldState,
+        scaffoldState = scaffoldState,
         topBar = { AddEditTaskTopAppBar(topBarTitle, onBack) },
         floatingActionButton = {
-            FloatingActionButton(onClick = state::onFabClick) {
+            FloatingActionButton(onClick = viewModel::saveTask) {
                 Icon(Icons.Filled.Done, stringResource(id = R.string.cd_save_task))
             }
         }
     ) { paddingValues ->
-        val loading by viewModel.dataLoading.observeAsState(initial = false)
-        val title by viewModel.title.observeAsState(initial = "")
-        val description by viewModel.description.observeAsState(initial = "")
+        val uiState by viewModel.uiState.collectAsStateWithLifecycle()
 
         AddEditTaskContent(
-            loading = loading,
-            title = title,
-            description = description,
-            onTitleChanged = state::onTitleChanged,
-            onDescriptionChanged = state::onDescriptionChanged,
+            loading = uiState.isLoading,
+            title = uiState.title,
+            description = uiState.description,
+            onTitleChanged = viewModel::updateTitle,
+            onDescriptionChanged = viewModel::updateDescription,
             modifier = Modifier.padding(paddingValues)
         )
+
+        // Check if the task is saved and call onTaskUpdate event
+        LaunchedEffect(uiState.isTaskSaved) {
+            if (uiState.isTaskSaved) {
+                onTaskUpdate()
+            }
+        }
+
+        // Check for user messages to display on the screen
+        uiState.userMessage?.let { userMessage ->
+            val snackbarText = stringResource(userMessage)
+            LaunchedEffect(scaffoldState, viewModel, userMessage, snackbarText) {
+                scaffoldState.snackbarHostState.showSnackbar(snackbarText)
+                viewModel.snackbarMessageShown()
+            }
+        }
     }
 }