Merge pull request #258 from Somyajain2004/favorites

Solved Issue #238 : Favorite Button

app/src/main/java/com/yuvrajsinghgmx/shopsmart/screens/home/FavoriteScreen.kt

@@ -46,15 +46,17 @@ import androidx.navigation.NavController
 import com.yuvrajsinghgmx.shopsmart.R
 import com.yuvrajsinghgmx.shopsmart.viewmodel.HomeScreenViewModel
 import com.yuvrajsinghgmx.shopsmart.viewmodel.ItemsData
-
+import androidx.lifecycle.viewmodel.compose.viewModel
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun FavoriteScreen(
-    viewModel: HomeScreenViewModel = HomeScreenViewModel(),
-    navController: NavController? = null
+
+    navController: NavController? = null ,
+    viewModel: HomeScreenViewModel = viewModel()
 ) {
-    val favorite = viewModel.itemsList.collectAsState().value
+    val itemsList = viewModel.itemsList.collectAsState().value
+    val favoriteItems = itemsList.filter { it.favorite }
 
     Box(
         modifier = Modifier
@@ -107,10 +109,11 @@ fun FavoriteScreen(
                     .padding(horizontal = 8.dp),
                 contentPadding = PaddingValues(bottom = 80.dp)
             ) {
-                items(favorite.size) { item ->
+                items(favoriteItems.size) { index ->
+                    val item = favoriteItems[index]
                     FavoriteCardLayout(
-                        itemsData = favorite[item],
-                        onClick = { /* Handle click */ }
+                        itemsData = item,
+                        onClick = {/*TODO*/}
                     )
                 }
             }

app/src/main/java/com/yuvrajsinghgmx/shopsmart/screens/orders/ProductDetail.kt

@@ -20,20 +20,27 @@ import com.yuvrajsinghgmx.shopsmart.R
 import com.yuvrajsinghgmx.shopsmart.viewmodel.HomeScreenViewModel
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.lifecycle.viewmodel.compose.viewModel
 import androidx.navigation.NavController
 import androidx.navigation.compose.rememberNavController
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun ProductDetails(
     index: Int,
-    navController: NavController
+    navController: NavController,
+
 ) {
-    val itemsData = HomeScreenViewModel().itemsList.collectAsState().value[index]
+    val viewModel: HomeScreenViewModel = viewModel()
+    val itemsData = viewModel.itemsList.collectAsState().value[index]
     val listedSites = itemsData.listedSites
     val features = itemsData.features
     val scrollState = rememberLazyListState()
 
+    val favoriteState = remember { mutableStateOf(itemsData.favorite) }
+
     // Outer Box to hold the scrollable content and fixed bottom buttons
     Box(modifier = Modifier.fillMaxSize()) {
         // Scrollable Column content inside LazyColumn
@@ -61,9 +68,18 @@ fun ProductDetails(
                         }
                     },
                     actions = {
-                        IconButton(onClick = { /*ToDo*/ }) {
+                        IconButton(onClick = {
+                            val newFavoriteState = !favoriteState.value
+                            favoriteState.value = newFavoriteState        
+                            viewModel.changeFavorite(index, newFavoriteState)  
+                        }) {
+                            val favoriteIcon = if (favoriteState.value) {
+                                painterResource(R.drawable.favorite_filled_24px)
+                            } else {
+                                painterResource(R.drawable.favorite_border_24px)
+                            }
                             Icon(
-                                painter = painterResource(R.drawable.favorite_border_24px),
+                                painter = favoriteIcon,
                                 contentDescription = "Favorite"
                             )
                         }

app/src/main/java/com/yuvrajsinghgmx/shopsmart/viewmodel/HomeScreenViewModel.kt

@@ -1,15 +1,9 @@
 package com.yuvrajsinghgmx.shopsmart.viewmodel
-
-import androidx.compose.runtime.mutableStateListOf
-import androidx.compose.runtime.snapshotFlow
 import androidx.lifecycle.ViewModel
-import androidx.lifecycle.viewModelScope
 import com.yuvrajsinghgmx.shopsmart.R
 import kotlinx.coroutines.flow.MutableStateFlow
-import kotlinx.coroutines.flow.SharingStarted
 import kotlinx.coroutines.flow.StateFlow
-import kotlinx.coroutines.flow.asStateFlow
-import kotlinx.coroutines.flow.stateIn
+import kotlinx.coroutines.flow.update
 
 
 data class ListedSite(
@@ -29,55 +23,57 @@ data class ItemsData(
     val listedSites : List<ListedSite>,
     val features : List<String> ,
     val description: String,
-    var favorite: Boolean = false
+    val favorite: Boolean
 )
 
 
 class HomeScreenViewModel: ViewModel(){
 
     // Demo data
-    private val _itemsList = MutableStateFlow<List<ItemsData>>(listOf(
+    //NOTE :fetch and use realtime user data instead of dummy data to keep the changes saved!
+    private val _itemsList = MutableStateFlow(listOf(
         ItemsData(R.drawable.shopinterior, "Phone1", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            false
         ),
         ItemsData(R.drawable.shopinterior, "Phone2", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            true
         ),
         ItemsData(R.drawable.shopinterior, "Phone3", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            true
         ),
         ItemsData(R.drawable.shopinterior, "Phone4", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            false
         ) ,
         ItemsData(R.drawable.shopinterior, "Phone5", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            false
         ),
         ItemsData(R.drawable.shopinterior, "Phone6", "flipkart", 4.5f, 10, 500, 480,
             listOf(ListedSite("Amazon", 150.0f), ListedSite("Flipkart", 300.0f)), listOf("Dimensions: 12x8x4 inches", "Material: Mesh, Synthetic"),
-            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability.."
+            "The Nike Air Max 270 features a sleek design with a large Air unit in the heel for maximum cushioning. The upper is made from a combination of mesh and synthetic materials, providing, breathability..",
+            false
         )
     )
     )
 
-    val itemsList: StateFlow<List<ItemsData>> = _itemsList.asStateFlow()
-
-    val favorite = emptyList<ItemsData>()
-
+    val itemsList: StateFlow<List<ItemsData>> = _itemsList
 
-
-    fun changeFavorite(index: Int) {
-        favorite + _itemsList.value[index]
-//        _itemsList.value = _itemsList.value.mapIndexed { it, data->
-//            when(it){
-//                index-> data.copy(favorite = true)
-//                else->data
-//            }
-//        }
+    fun changeFavorite(index: Int, newFavoriteState : Boolean) {
+        _itemsList.update { list ->
+            list.mapIndexed { i, item ->
+                if (i == index) item.copy(favorite = newFavoriteState) else item
+            }
+        }
     }
+
 }