Add beginning of viewmodel, update nav on back gesture

app/build.gradle.kts

@@ -65,4 +65,5 @@ dependencies {
     debugImplementation(libs.androidx.ui.tooling)
     debugImplementation(libs.androidx.ui.test.manifest)
     implementation("androidx.navigation:navigation-compose:$nav_version")
+    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.6.1")
 }

app/src/main/AndroidManifest.xml

@@ -4,6 +4,7 @@
 
     <application
         android:allowBackup="true"
+        android:enableOnBackInvokedCallback="true"
         android:dataExtractionRules="@xml/data_extraction_rules"
         android:fullBackupContent="@xml/backup_rules"
         android:icon="@mipmap/ic_launcher"

app/src/main/java/com/ti/mobpo/MainActivity.kt

@@ -4,6 +4,7 @@ import android.annotation.SuppressLint
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
+import com.ti.mobpo.ui.Navigation
 import com.ti.mobpo.ui.theme.MobileSecurityTheme
 
 class MainActivity : ComponentActivity() {

app/src/main/java/com/ti/mobpo/ui/Compontents.kt

@@ -1,4 +1,4 @@
-package com.ti.mobpo
+package com.ti.mobpo.ui
 
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.text.KeyboardActions

app/src/main/java/com/ti/mobpo/ui/Navigation.kt

@@ -1,4 +1,4 @@
-package com.ti.mobpo
+package com.ti.mobpo.ui
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
@@ -20,16 +20,19 @@ import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
+import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
-import com.ti.mobpo.screens.Favourites
-import com.ti.mobpo.screens.PokeSearch
-import com.ti.mobpo.screens.Profile
+import com.ti.mobpo.ui.screens.Favourites
+import com.ti.mobpo.ui.screens.PokeSearch
+import com.ti.mobpo.ui.screens.PokeSearchScreen
+import com.ti.mobpo.ui.screens.Profile
 
 
 @Composable
@@ -54,10 +57,17 @@ fun Navigation() {
             route = Screen.Profile.route
         ),
     )
+
     var selectedItemIndex by rememberSaveable {
         mutableStateOf(0)
     }
     val navController = rememberNavController()
+
+    val currentBackStackEntry by navController.currentBackStackEntryAsState()
+    val currentRoute = currentBackStackEntry?.destination?.route
+    val updatedSelectedIndex = items.indexOfFirst { it.route == currentRoute }
+    selectedItemIndex = rememberUpdatedState(updatedSelectedIndex).value
+
     Scaffold (
         bottomBar = {
             NavigationBar {
@@ -113,6 +123,6 @@ fun Navigation() {
 @Composable
 fun NavigationPreview() {
     Surface {
-        PokeSearch()
+        PokeSearchScreen()
     }
 }

app/src/main/java/com/ti/mobpo/ui/PokeSearchUiState.kt

@@ -0,0 +1,3 @@
+package com.ti.mobpo.ui
+
+data class PokeSearchUiState(val searchQuery: String = "")

app/src/main/java/com/ti/mobpo/ui/PokeSearchViewModel.kt

@@ -0,0 +1,11 @@
+package com.ti.mobpo.ui
+import androidx.lifecycle.ViewModel
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.asStateFlow
+
+class PokeSearchViewModel : ViewModel() {
+    private val _uiState = MutableStateFlow(PokeSearchUiState())
+    val uiState: StateFlow<PokeSearchUiState> = _uiState.asStateFlow()
+
+}

app/src/main/java/com/ti/mobpo/ui/Screen.kt

@@ -1,4 +1,4 @@
-package com.ti.mobpo
+package com.ti.mobpo.ui
 
 sealed class Screen (val route: String) {
     object PokeSearch : Screen("default_screen")

app/src/main/java/com/ti/mobpo/ui/screens/Favourites.kt

@@ -1,4 +1,4 @@
-package com.ti.mobpo.screens
+package com.ti.mobpo.ui.screens
 
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable

app/src/main/java/com/ti/mobpo/ui/screens/PokeSearch.kt

@@ -1,25 +1,36 @@
-package com.ti.mobpo.screens
+package com.ti.mobpo.ui.screens
 
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.ti.mobpo.R
-import com.ti.mobpo.SearchBar
+import com.ti.mobpo.ui.SearchBar
+import androidx.lifecycle.viewmodel.compose.viewModel
+import com.ti.mobpo.ui.PokeSearchViewModel
 
+@Composable
+fun PokeSearchScreen(pokesearchViewModel: PokeSearchViewModel = viewModel()){
+    val pokesearchUiState by pokesearchViewModel.uiState.collectAsState()
+    PokeSearch()
+}
 
 @Composable
 fun PokeSearch() {
     Column (
         verticalArrangement = Arrangement.Top,
         horizontalAlignment = Alignment.CenterHorizontally,
-        modifier = Modifier.fillMaxSize().padding(20.dp)
+        modifier = Modifier
+            .fillMaxSize()
+            .padding(20.dp)
     ) {
         SearchBar(stringResource(R.string.input_field_label)){ value ->
             run {
@@ -31,5 +42,5 @@ fun PokeSearch() {
 @Preview(showBackground = true)
 @Composable
 fun PokeSearchApp(){
-    PokeSearch()
+    PokeSearchScreen()
 }

app/src/main/java/com/ti/mobpo/ui/screens/Profile.kt

@@ -1,4 +1,4 @@
-package com.ti.mobpo.screens
+package com.ti.mobpo.ui.screens
 
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable