Navigation

Signed-off-by: Mohsen <[email protected]>
mohsenoid · Dec 5, 2023 · 3ef2398 · 3ef2398
1 parent 077ecf9
commit 3ef2398
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 20 deletions.
diff --git a/.idea/artifacts/composeApp_desktop.xml b/.idea/artifacts/composeApp_desktop.xml
diff --git a/composeApp/src/commonMain/kotlin/App.kt b/composeApp/src/commonMain/kotlin/App.kt
@@ -10,7 +10,7 @@ import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -30,26 +30,38 @@ import theme.Theme
 @Composable
 fun App(darkTheme: Boolean) {
     Theme(darkTheme = darkTheme) {
-        Scaffold {
-            val episodesViewModel =
-                getViewModel(
-                    key = Unit,
-                    factory = viewModelFactory {
-                        EpisodesViewModel(
-                            repository = EpisodesRepositoryImpl(remote = EpisodesRemoteDataSource()),
+        // A surface container using the 'background' color from the theme
+        Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) {
+            val navController = rememberNavController()
+
+            NavHost(
+                navController = navController,
+                startDestination = NavRoute.SelectorScreen.route,
+            ) {
+                composable(
+                    route = NavRoute.EpisodesScreen.route,
+                ) {
+                    val episodesViewModel =
+                        getViewModel(
+                            key = Unit,
+                            factory = viewModelFactory {
+                                EpisodesViewModel(
+                                    repository = EpisodesRepositoryImpl(remote = EpisodesRemoteDataSource()),
+                                )
+                            },
                         )
-                    },
-                )
-            val uiState by episodesViewModel.uiState.collectAsState()
-            LaunchedEffect(episodesViewModel) {
-                episodesViewModel.updateEpisodes()
-            }
+                    val uiState by episodesViewModel.uiState.collectAsState()
+                    LaunchedEffect(episodesViewModel) {
+                        episodesViewModel.updateEpisodes()
+                    }
 
-            EpisodesPage(
-                uiState = uiState,
-                modifier = Modifier.fillMaxSize(),
-                onEpisodeClicked = episodesViewModel::onEpisodeClicked,
-            )
+                    EpisodesPage(
+                        uiState = uiState,
+                        modifier = Modifier.fillMaxSize(),
+                        onEpisodeClicked = { navController.navigate(NavRoute.EpisodesScreen.route) },
+                    )
+                }
+            }
         }
     }
 }

diff --git a/composeApp/src/commonMain/kotlin/NavRoute.kt b/composeApp/src/commonMain/kotlin/NavRoute.kt
@@ -0,0 +1,8 @@
+sealed class NavRoute(val route: String) {
+
+    object EpisodesScreen : NavRoute(route = "episodes_screen")
+
+    object EpisodeScreen : NavRoute(route = "episode_screen")
+
+    object CharacterScreen : NavRoute(route = "character_screen")
+}
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -10,6 +10,7 @@ androidx-activityCompose = "1.8.1"
 androidx-core-ktx = "1.12.0"
 androidx-appcompat = "1.6.1"
 androidx-material = "1.10.0"
+androidx-navigation-compose = "2.7.5"
 androidx-constraintlayout = "2.1.4"
 androidx-test-junit = "1.1.5"
 androidx-espresso-core = "3.5.1"
@@ -34,6 +35,7 @@ androidx-test-junit = { group = "androidx.test.ext", name = "junit", version.ref
 androidx-espresso-core = { group = "androidx.test.espresso", name = "espresso-core", version.ref = "androidx-espresso-core" }
 androidx-appcompat = { group = "androidx.appcompat", name = "appcompat", version.ref = "androidx-appcompat" }
 androidx-material3 = { group = "com.google.android.material", name = "material", version.ref = "androidx-material" }
+androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "androidx-navigation-compose" }
 androidx-constraintlayout = { group = "androidx.constraintlayout", name = "constraintlayout", version.ref = "androidx-constraintlayout" }
 androidx-activity-compose = { module = "androidx.activity:activity-compose", version.ref = "androidx-activityCompose" }
 ktor-client-content-negotiation = { module = "io.ktor:ktor-client-content-negotiation", version.ref = "ktor" }