MadridSquad · yousef-osama11 · Jul 17, 2025 · Jul 17, 2025
diff --git a/app/src/main/java/com/madrid/movio/MainActivity.kt b/app/src/main/java/com/madrid/movio/MainActivity.kt
@@ -1,25 +1,25 @@
 package com.madrid.movio
 
 import android.os.Bundle
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
 import com.madrid.designsystem.AppTheme
 import com.madrid.presentation.composables.CustomBottomBar
-import com.madrid.presentation.composables.navDestinations
+import com.madrid.presentation.composables.navBarDestinations
+import com.madrid.presentation.navigation.LocalNavController
 import com.madrid.presentation.navigation.MovioNavGraph
-import com.madrid.presentation.navigation.Screen
-import com.madrid.presentation.screens.searchScreen.FilteredScreen
-import com.madrid.presentation.screens.searchScreen.SearchScreen
 
 
 class MainActivity : ComponentActivity() {
@@ -28,7 +28,6 @@ class MainActivity : ComponentActivity() {
         enableEdgeToEdge()
         setContent {
             AppTheme {
-               // FilteredScreen()
                 MainScreen()
             }
         }
@@ -38,21 +37,35 @@ class MainActivity : ComponentActivity() {
 @Composable
 fun MainScreen() {
     val navController = rememberNavController()
-    val navBackStackEntry = navController.currentBackStackEntryAsState().value
+    val navBackStackEntry by navController.currentBackStackEntryAsState()
+
     val currentRoute = navBackStackEntry?.destination?.route
-    Column (Modifier.fillMaxSize()) {
-        Column (
-            modifier = Modifier.fillMaxSize().weight(1f),
-            horizontalAlignment = Alignment.CenterHorizontally,
-            verticalArrangement = Arrangement.Center
-        ) {
-            MovioNavGraph(navController = navController)
+
+    val currentDestination = navBarDestinations.find { destinationItem ->
+        destinationItem.destination::class.qualifiedName == currentRoute
+    } ?: navBarDestinations.first()
+
+    CompositionLocalProvider(LocalNavController provides navController) {
+        Column(Modifier.fillMaxSize()) {
+            Column(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .weight(1f),
+                horizontalAlignment = Alignment.CenterHorizontally,
+                verticalArrangement = Arrangement.Center
+            ) {
+                MovioNavGraph(navController)
+            }
+
+            CustomBottomBar(
+                currentDestination = currentDestination.destination,
+                navItems = navBarDestinations,
+                onNavDestinationClicked = { destination ->
+                    navController.navigate(destination)
+                },
+                modifier = Modifier.navigationBarsPadding()
+            )
         }
-        CustomBottomBar(
-            currentRoute = currentRoute ?: Screen.Home.route,
-            onNavDestinationClicked = { navController.navigate(it) },
-            navItems = navDestinations,
-            modifier = Modifier.navigationBarsPadding()
-        )
     }
-}
+}
+
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -1,5 +1,6 @@
 [versions]
 agp = "8.9.2"
+androidxNavigationCompose = "2.9.2"
 coil = "3.2.0"
 coilNetworkOkhttp = "3.2.0"
 coilTest = "3.2.0"
@@ -16,6 +17,7 @@ junitVersion = "1.2.1"
 espressoCore = "3.6.1"
 kotlinxCoroutinesAndroid = "1.3.9"
 kotlinxDatetime = "0.5.0"
+kotlinxSerializationJson = "1.8.1"
 lifecycleRuntimeKtx = "2.9.1"
 activityCompose = "1.10.1"
 composeBom = "2024.09.00"
@@ -27,6 +29,9 @@ navigationCompose = "2.9.0"
 material3 = "1.3.2"
 material3AdaptiveNavigationSuite = "1.4.0-alpha16"
 material3WindowSizeClass = "1.3.2"
+navigationComposeVersion = "2.7.7"
+navigationDynamicFeaturesFragment = "2.7.7"
+navigationRuntimeKtx = "2.9.2"
 roomCommonJvm = "2.7.2"
 roomRuntimeAndroid = "2.7.2"
 tensorflowLite = "2.17.0"
@@ -38,6 +43,10 @@ androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref =
 androidx-foundation = { module = "androidx.compose.foundation:foundation" }
 androidx-material3-adaptive-navigation-suite = { module = "androidx.compose.material3:material3-adaptive-navigation-suite", version.ref = "material3AdaptiveNavigationSuite" }
 androidx-material3-window-size-class1 = { module = "androidx.compose.material3:material3-window-size-class", version.ref = "material3WindowSizeClass" }
+androidx-navigation-compose-v277 = { module = "androidx.navigation:navigation-compose", version.ref = "navigationComposeVersion" }
+androidx-navigation-compose-v292 = { module = "androidx.navigation:navigation-compose", version.ref = "androidxNavigationCompose" }
+androidx-navigation-dynamic-features-fragment = { module = "androidx.navigation:navigation-dynamic-features-fragment", version.ref = "navigationDynamicFeaturesFragment" }
+androidx-navigation-runtime-ktx = { module = "androidx.navigation:navigation-runtime-ktx", version.ref = "navigationRuntimeKtx" }
 coil = { module = "io.coil-kt.coil3:coil", version.ref = "coil" }
 coil-compose = { module = "io.coil-kt.coil3:coil-compose", version.ref = "coilTest" }
 coil-network-okhttp = { module = "io.coil-kt.coil3:coil-network-okhttp", version.ref = "coilNetworkOkhttp" }
@@ -60,6 +69,7 @@ koin-android = { module = "io.insert-koin:koin-android", version = "4.1.0" }
 koin-annotations = { module = "io.insert-koin:koin-annotations", version.ref = "koinAnnotationsVersion" }
 kotlinx-coroutines-android = { module = "org.jetbrains.kotlinx:kotlinx-coroutines-android", version.ref = "kotlinxCoroutinesAndroid" }
 kotlinx-datetime = { module = "org.jetbrains.kotlinx:kotlinx-datetime", version.ref = "kotlinxDatetime" }
+kotlinx-serialization-json = { module = "org.jetbrains.kotlinx:kotlinx-serialization-json", version.ref = "kotlinxSerializationJson" }
 material = { group = "com.google.android.material", name = "material", version.ref = "material" }
 material3 = { module = "androidx.compose.material3:material3", version.ref = "material3" }
 ui-tooling = { module = "androidx.compose.ui:ui-tooling" }

diff --git a/presentation/build.gradle.kts b/presentation/build.gradle.kts
@@ -2,6 +2,7 @@ plugins {
     alias(libs.plugins.android.library)
     alias(libs.plugins.kotlin.android)
     alias(libs.plugins.kotlin.compose)
+    kotlin("plugin.serialization") version "2.2.0"
 }
 
 android {

diff --git a/presentation/src/main/java/com/madrid/presentation/composables/BottomNavBar.kt b/presentation/src/main/java/com/madrid/presentation/composables/BottomNavBar.kt
@@ -24,16 +24,16 @@ import com.madrid.designsystem.AppTheme
 import com.madrid.designsystem.component.MovioIcon
 import com.madrid.designsystem.component.MovioText
 import com.madrid.presentation.R
-import com.madrid.presentation.navigation.Screen
+import com.madrid.presentation.navigation.Destinations
 
 
 @Preview(showBackground = true)
 @Composable
 fun CustomBottomBarPreview() {
     AppTheme {
         CustomBottomBar(
-            currentRoute = Screen.Search.route,
-            navItems = navDestinations,
+            currentDestination = Destinations.HomeScreen,
+            navItems = navBarDestinations,
             onNavDestinationClicked = {},
             modifier = Modifier
                 .fillMaxWidth()
@@ -44,45 +44,47 @@ fun CustomBottomBarPreview() {
 
 
 data class NavBarItem(
-    val route: String,
+    val destination: Destinations,
     val label: String,
     val contentDescription: String = "none",
     @DrawableRes val selectedIcon: Int,
     @DrawableRes val unSelectedIcon: Int,
 )
 
-val navDestinations = listOf(
+
+val navBarDestinations = listOf(
     NavBarItem(
-        route = Screen.Home.route,
+        destination = Destinations.HomeScreen,
         label = "Home",
         contentDescription = "Home Screen",
         selectedIcon = R.drawable.icon_home_selected,
         unSelectedIcon = R.drawable.icon_home
     ),
     NavBarItem(
-        route = Screen.Search.route,
+        destination = Destinations.SearchScreen,
         label = "Search",
         selectedIcon = R.drawable.icon_search_selected,
         unSelectedIcon = R.drawable.icon_search
     ),
     NavBarItem(
-        route = Screen.Library.route,
+        destination = Destinations.LibraryScreen,
         label = "Library",
         selectedIcon = R.drawable.icon_library_selected,
         unSelectedIcon = R.drawable.icon_library,
     ),
     NavBarItem(
-        route = Screen.More.route,
+        destination = Destinations.MoreScreen,
         label = "More",
         selectedIcon = R.drawable.icon_more_selected,
         unSelectedIcon = R.drawable.icon_more
     )
 )
 
+
 @Composable
 fun CustomBottomBar(
-    currentRoute: String,
-    onNavDestinationClicked: (String) -> Unit,
+    currentDestination: Destinations,
+    onNavDestinationClicked: (Destinations) -> Unit,
     navItems: List<NavBarItem>,
     modifier: Modifier = Modifier,
     backgroundColor: Color = AppTheme.colors.surfaceColor.surface,
@@ -101,7 +103,7 @@ fun CustomBottomBar(
         verticalAlignment = Alignment.CenterVertically
     ) {
         navItems.forEach { item ->
-            val isSelected = currentRoute == item.route
+            val isSelected = currentDestination::class == item.destination::class
             CustomNavBarItem(
                 isSelected = isSelected,
                 onNavDestinationClicked = onNavDestinationClicked,
@@ -115,10 +117,11 @@ fun CustomBottomBar(
     }
 }
 
+
 @Composable
 private fun CustomNavBarItem(
     isSelected: Boolean,
-    onNavDestinationClicked: (String) -> Unit,
+    onNavDestinationClicked: (Destinations) -> Unit,
     item: NavBarItem,
     @DrawableRes iconRes: Int,
     selectedTextStyle: TextStyle,
@@ -133,7 +136,7 @@ private fun CustomNavBarItem(
                 indication = null
             ) {
                 if (!isSelected) {
-                    onNavDestinationClicked(item.route)
+                    onNavDestinationClicked(item.destination)
                 }
             }
     ) {
@@ -150,4 +153,4 @@ private fun CustomNavBarItem(
             modifier = Modifier.padding(top = AppTheme.spacing.extraSmall)
         )
     }
-}
+}
diff --git a/presentation/src/main/java/com/madrid/presentation/navigation/Destinations.kt b/presentation/src/main/java/com/madrid/presentation/navigation/Destinations.kt
@@ -0,0 +1,59 @@
+package com.madrid.presentation.navigation
+
+import kotlinx.serialization.Serializable
+
+sealed interface Destinations {
+
+    @Serializable
+    data object SplashScreen : Destinations
+
+    @Serializable
+    data object OnBoarding : Destinations
+
+    @Serializable
+    data object AuthenticationScreen : Destinations
+
+    @Serializable
+    data object HomeScreen : Destinations
+
+    @Serializable
+    data object SearchScreen : Destinations
+
+    @Serializable
+    data class MovieDetailsScreen(
+        val movieId: Int,
+    ) : Destinations
+
+    @Serializable
+    data class SeriesDetailsScreen(
+        val seriesId: Int,
+    ) : Destinations
+
+    @Serializable
+    data class TopCastScreen(
+        val mediaId: Int,
+        val isMovie: Boolean
+    ) : Destinations
+
+    @Serializable
+    data class ReviewsScreen(
+        val mediaId: Int,
+        val isMovie: Boolean
+    ) : Destinations
+
+    @Serializable
+    data class SeasonsScreen(
+        val seriesId: Int,
+    ) : Destinations
+
+    @Serializable
+    data class EpisodesScreen(
+        val seriesId: Int,
+    ) : Destinations
+
+    @Serializable
+    data object LibraryScreen : Destinations
+
+    @Serializable
+    data object MoreScreen : Destinations
+}
diff --git a/presentation/src/main/java/com/madrid/presentation/navigation/MovioNavGraph.kt b/presentation/src/main/java/com/madrid/presentation/navigation/MovioNavGraph.kt
@@ -1,24 +1,22 @@
 package com.madrid.presentation.navigation
 
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.compositionLocalOf
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.rememberNavController
 import com.madrid.presentation.navigation.route.searchRoute
 import com.madrid.presentation.navigation.route.homeRoute
 import com.madrid.presentation.navigation.route.libraryRoute
 import com.madrid.presentation.navigation.route.moreRoute
 import com.madrid.presentation.navigation.route.onBoardingRoute
 import com.madrid.presentation.navigation.route.splashRoute
 
+val LocalNavController = compositionLocalOf<NavHostController> { error("No Nav Controller Found") }
+
+
 @Composable
 fun MovioNavGraph(navController: NavHostController) {
-    NavHost(navController = navController, startDestination = Screen.Home.route) {
-        splashRoute(navController)
-        onBoardingRoute(navController)
-        authNavGraph(navController)
-        homeRoute(navController)
-        searchRoute(navController)
-        libraryRoute(navController)
-        moreRoute(navController)
-    }
+    MovioNavHost(navController)
 }