💣
Compose Landmines
Find the bugs in each code snippet
←→NavigateAShow remainingRReset
🎯Bug Formula: What's wrong → What breaks for the user → The fix → The trade-off
Find the bugs in each code snippet
1@Composable2fun HotelListScreen(viewModel: HotelListViewModel) {3 val hotels by viewModel.hotels.collectAsState()45 LazyColumn {6 items(hotels) { hotel ->7 HotelCard(8 hotel = hotel,9 amenities = hotel.amenities.toList(),10 onFavorite = { viewModel.toggleFavorite(hotel.id) },11 onClick = { viewModel.navigate(hotel.id) }12 )13 }14 }15}1617@Composable18fun HotelCard(19 hotel: Hotel,20 amenities: List<String>,21 onFavorite: () -> Unit,22 onClick: () -> Unit23) {24 Card(onClick = onClick) {25 Text(hotel.name)26 Text("${hotel.price}/night")27 Row {28 amenities.forEach { Text(it) }29 }30 IconButton(onClick = onFavorite) {31 Icon(Icons.Default.Favorite, null)32 }33 }34}Find the bugs in each code snippet
1@Composable2fun HotelListScreen(viewModel: HotelListViewModel) {3 val hotels by viewModel.hotels.collectAsState()45 LazyColumn {6 items(hotels) { hotel ->7 HotelCard(8 hotel = hotel,9 amenities = hotel.amenities.toList(),10 onFavorite = { viewModel.toggleFavorite(hotel.id) },11 onClick = { viewModel.navigate(hotel.id) }12 )13 }14 }15}1617@Composable18fun HotelCard(19 hotel: Hotel,20 amenities: List<String>,21 onFavorite: () -> Unit,22 onClick: () -> Unit23) {24 Card(onClick = onClick) {25 Text(hotel.name)26 Text("${hotel.price}/night")27 Row {28 amenities.forEach { Text(it) }29 }30 IconButton(onClick = onFavorite) {31 Icon(Icons.Default.Favorite, null)32 }33 }34}