basic setup for AddNewUserScreen

hoc081098 · hoc081098 · commit ae71fc982fae · 2022-12-01T12:00:20.000+07:00
diff --git a/app/src/main/java/com/hoc/flowmvi/AppState.kt b/app/src/main/java/com/hoc/flowmvi/AppState.kt
@@ -7,8 +7,10 @@ import androidx.navigation.NavDestination
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
+import com.hoc.flowmvi.Screen.AddNewUser
 import com.hoc.flowmvi.Screen.UsersList
-import com.hoc.flowmvi.ui.main.navigation.usersListNavigationRoute
+import com.hoc.flowmvi.ui.add.navigation.AddNewUserNavigationRoute
+import com.hoc.flowmvi.ui.main.navigation.UsersListNavigationRoute
 
 @Composable
 fun rememberJetpackComposeMVICoroutinesFlowApp(
@@ -24,9 +26,9 @@ enum class Screen {
 
   val route: String
     get() = when (this) {
-      UsersList -> usersListNavigationRoute
+      UsersList -> UsersListNavigationRoute
+      AddNewUser -> AddNewUserNavigationRoute
       SearchUsers -> TODO()
-      AddNewUser -> TODO()
     }
 
   companion object {
@@ -48,11 +50,16 @@ class JetpackComposeMVICoroutinesFlowAppState(
 
   val currentScreen: Screen?
     @Composable get() = when (currentDestination?.route) {
-      usersListNavigationRoute -> UsersList
+      UsersListNavigationRoute -> UsersList
+      AddNewUserNavigationRoute -> AddNewUser
       else -> TODO()
     }
 
   fun onNavigateUp() {
     navController.navigateUp()
   }
+
+  fun onBackClick() {
+    navController.popBackStack()
+  }
 }
diff --git a/app/src/main/java/com/hoc/flowmvi/MainActivity.kt b/app/src/main/java/com/hoc/flowmvi/MainActivity.kt
@@ -4,23 +4,23 @@ import android.os.Bundle
 import androidx.activity.compose.setContent
 import androidx.appcompat.app.AppCompatActivity
 import androidx.compose.foundation.layout.RowScope
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.CenterAlignedTopAppBar
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SnackbarHost
 import androidx.compose.material3.SnackbarHostState
-import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBarColors
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.navigation.compose.NavHost
 import com.hoc.flowmvi.core_ui.AppBarState
 import com.hoc.flowmvi.core_ui.ProvideSnackbarHostState
+import com.hoc.flowmvi.ui.add.navigation.addNewUserScreen
+import com.hoc.flowmvi.ui.add.navigation.navigateToAddNewUser
 import com.hoc.flowmvi.ui.main.navigation.usersListScreen
 import com.hoc.flowmvi.ui.theme.AppTheme
 import dagger.hilt.android.AndroidEntryPoint
@@ -32,12 +32,7 @@ class MainActivity : AppCompatActivity() {
 
     setContent {
       AppTheme {
-        Surface(
-          color = MaterialTheme.colorScheme.background,
-          modifier = Modifier.fillMaxSize(),
-        ) {
-          JetpackComposeMVICoroutinesFlowApp()
-        }
+        JetpackComposeMVICoroutinesFlowApp()
       }
     }
   }
@@ -49,6 +44,7 @@ fun JetpackComposeMVICoroutinesFlowAppBar(
   title: String?,
   navigationIcon: @Composable () -> Unit,
   actions: @Composable RowScope.() -> Unit,
+  colors: TopAppBarColors,
   modifier: Modifier = Modifier
 ) {
   CenterAlignedTopAppBar(
@@ -59,7 +55,8 @@ fun JetpackComposeMVICoroutinesFlowAppBar(
     },
     modifier = modifier,
     navigationIcon = navigationIcon,
-    actions = actions
+    actions = actions,
+    colors = colors
   )
 }
 
@@ -82,6 +79,7 @@ private fun JetpackComposeMVICoroutinesFlowApp(
           title = it.title,
           actions = it.actions,
           navigationIcon = it.navigationIcon,
+          colors = it.colors
         )
       }
     }
@@ -94,6 +92,12 @@ private fun JetpackComposeMVICoroutinesFlowApp(
       ) {
         usersListScreen(
           configAppBar = setAppBarState,
+          navigateToAddUser = { navController.navigateToAddNewUser() }
+        )
+
+        addNewUserScreen(
+          configAppBar = setAppBarState,
+          onBackClick = appState::onBackClick
         )
       }
     }
diff --git a/buildSrc/src/main/kotlin/deps.kt b/buildSrc/src/main/kotlin/deps.kt
@@ -30,7 +30,6 @@ object deps {
   object androidx {
     const val appCompat = "androidx.appcompat:appcompat:1.5.1"
     const val coreKtx = "androidx.core:core-ktx:1.9.0"
-    const val constraintLayout = "androidx.constraintlayout:constraintlayout:2.1.2"
     const val material = "com.google.android.material:material:1.4.0"
     const val activityCompose = "androidx.activity:activity-compose:1.6.1"
 
diff --git a/core-ui/src/main/java/com/hoc/flowmvi/core_ui/AppBarState.kt b/core-ui/src/main/java/com/hoc/flowmvi/core_ui/AppBarState.kt
@@ -1,12 +1,18 @@
 package com.hoc.flowmvi.core_ui
 
 import androidx.compose.foundation.layout.RowScope
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.TopAppBarColors
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.Stable
 
+@OptIn(ExperimentalMaterial3Api::class)
+@Stable
 data class AppBarState(
   val title: String?,
   val actions: @Composable RowScope.() -> Unit,
   val navigationIcon: @Composable () -> Unit,
+  val colors: TopAppBarColors,
 )
 
 typealias ConfigAppBar = (AppBarState) -> Unit
diff --git a/feature-add/build.gradle.kts b/feature-add/build.gradle.kts
@@ -30,21 +30,36 @@ android {
     }
   }
 
-  buildFeatures { viewBinding = true }
+  buildFeatures {
+    compose = true
+  }
+  composeOptions {
+    kotlinCompilerExtensionVersion = deps.compose.androidxComposeCompiler
+  }
+  testOptions {
+    unitTests {
+      isReturnDefaultValues = true
+      isIncludeAndroidResources = true
+    }
+  }
 }
 
 dependencies {
   implementation(domain)
   implementation(core)
   implementation(coreUi)
+  implementation(mviBase)
+  implementation(uiTheme)
+
+  implementationCompose()
+  implementation(deps.immutableCollections)
 
   implementation(deps.androidx.appCompat)
   implementation(deps.androidx.coreKtx)
 
   implementation(deps.lifecycle.viewModelKtx)
   implementation(deps.lifecycle.runtimeKtx)
 
-  implementation(deps.androidx.constraintLayout)
   implementation(deps.androidx.material)
 
   implementation(deps.coroutines.core)
diff --git a/feature-add/src/main/java/com/hoc/flowmvi/ui/add/AddNewUserScreen.kt b/feature-add/src/main/java/com/hoc/flowmvi/ui/add/AddNewUserScreen.kt
@@ -0,0 +1,50 @@
+package com.hoc.flowmvi.ui.add
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.res.stringResource
+import androidx.lifecycle.Lifecycle
+import com.hoc.flowmvi.core_ui.AppBarState
+import com.hoc.flowmvi.core_ui.ConfigAppBar
+import com.hoc.flowmvi.core_ui.OnLifecycleEvent
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun AddNewUserRoute(
+  configAppBar: ConfigAppBar,
+  onBackClick: () -> Unit,
+) {
+  val title = stringResource(id = R.string.add_new_user)
+  val colors = TopAppBarDefaults.centerAlignedTopAppBarColors()
+  val appBarState = remember(colors) {
+    AppBarState(
+      title = title,
+      actions = {},
+      navigationIcon = {
+        IconButton(onClick = onBackClick) {
+          Icon(
+            imageVector = Icons.Filled.ArrowBack,
+            contentDescription = "Back"
+          )
+        }
+      },
+      colors = colors
+    )
+  }
+  OnLifecycleEvent(configAppBar, appBarState) { _, event ->
+    if (event == Lifecycle.Event.ON_START) {
+      configAppBar(appBarState)
+    }
+  }
+
+  Text(
+    text = "ADD NEW USER",
+  )
+}
diff --git a/feature-add/src/main/java/com/hoc/flowmvi/ui/add/navigation/addNewUserNavigation.kt b/feature-add/src/main/java/com/hoc/flowmvi/ui/add/navigation/addNewUserNavigation.kt
@@ -0,0 +1,31 @@
+package com.hoc.flowmvi.ui.add.navigation
+
+import androidx.navigation.NavController
+import androidx.navigation.NavGraphBuilder
+import androidx.navigation.NavOptions
+import androidx.navigation.compose.composable
+import com.hoc.flowmvi.core_ui.ConfigAppBar
+import com.hoc.flowmvi.ui.add.AddNewUserRoute
+
+const val AddNewUserNavigationRoute = "add_new_user_route"
+
+/**
+ * Navigate to add new user screen
+ */
+fun NavController.navigateToAddNewUser(navOptions: NavOptions? = null) =
+  navigate(AddNewUserNavigationRoute, navOptions)
+
+/**
+ * Add the add new user screen to the navigation graph.
+ */
+fun NavGraphBuilder.addNewUserScreen(
+  configAppBar: ConfigAppBar,
+  onBackClick: () -> Unit,
+) {
+  composable(route = AddNewUserNavigationRoute) {
+    AddNewUserRoute(
+      configAppBar = configAppBar,
+      onBackClick = onBackClick,
+    )
+  }
+}
diff --git a/feature-add/src/main/res/values/strings.xml b/feature-add/src/main/res/values/strings.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+  <string name="add_new_user">Add new user</string>
+</resources>
diff --git a/feature-main/build.gradle.kts b/feature-main/build.gradle.kts
@@ -60,7 +60,6 @@ dependencies {
   implementation(deps.lifecycle.viewModelKtx)
   implementation(deps.lifecycle.runtimeKtx)
 
-  implementation(deps.androidx.constraintLayout)
   implementation(deps.androidx.material)
 
   implementation(deps.coroutines.core)
diff --git a/feature-main/src/main/java/com/hoc/flowmvi/ui/main/UsersListScreen.kt b/feature-main/src/main/java/com/hoc/flowmvi/ui/main/UsersListScreen.kt
@@ -8,12 +8,16 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.Delete
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.Divider
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
+import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -45,22 +49,32 @@ import kotlinx.coroutines.flow.consumeAsFlow
 import kotlinx.coroutines.flow.onEach
 import kotlinx.coroutines.launch
 
-@OptIn(ExperimentalLifecycleComposeApi::class)
+@OptIn(ExperimentalLifecycleComposeApi::class, ExperimentalMaterial3Api::class)
 @Composable
-fun UsersListRoute(
+internal fun UsersListRoute(
   configAppBar: ConfigAppBar,
+  navigateToAddUser: () -> Unit,
   modifier: Modifier = Modifier,
   viewModel: MainVM = hiltViewModel(),
 ) {
   val title = stringResource(id = R.string.app_name)
-  val appBarState = remember {
+  val colors = TopAppBarDefaults.centerAlignedTopAppBarColors()
+  val appBarState = remember(colors) {
     AppBarState(
       title = title,
-      actions = {},
+      actions = {
+        IconButton(onClick = navigateToAddUser) {
+          Icon(
+            imageVector = Icons.Default.Add,
+            contentDescription = "Add new user",
+          )
+        }
+      },
       navigationIcon = {},
+      colors = colors,
     )
   }
-  OnLifecycleEvent(configAppBar) { _, event ->
+  OnLifecycleEvent(configAppBar, appBarState) { _, event ->
     if (event == Lifecycle.Event.ON_START) {
       configAppBar(appBarState)
     }
diff --git a/feature-main/src/main/java/com/hoc/flowmvi/ui/main/navigation/usersListNavigation.kt b/feature-main/src/main/java/com/hoc/flowmvi/ui/main/navigation/usersListNavigation.kt
@@ -7,23 +7,25 @@ import androidx.navigation.compose.composable
 import com.hoc.flowmvi.core_ui.ConfigAppBar
 import com.hoc.flowmvi.ui.main.UsersListRoute
 
-const val usersListNavigationRoute = "users_list_route"
+const val UsersListNavigationRoute = "users_list_route"
 
 /**
  * Navigate to users list screen
  */
 fun NavController.navigateUsersList(navOptions: NavOptions? = null) =
-  navigate(usersListNavigationRoute, navOptions)
+  navigate(UsersListNavigationRoute, navOptions)
 
 /**
  * Add the users list screen to the navigation graph.
  */
 fun NavGraphBuilder.usersListScreen(
   configAppBar: ConfigAppBar,
+  navigateToAddUser: () -> Unit,
 ) {
-  composable(route = usersListNavigationRoute) {
+  composable(route = UsersListNavigationRoute) {
     UsersListRoute(
-      configAppBar = configAppBar
+      configAppBar = configAppBar,
+      navigateToAddUser = navigateToAddUser,
     )
   }
 }
