🚀 4단계 - 장바구니(수량)

README.md

@@ -21,6 +21,10 @@
             - [x] 장바구니 아이템 컴포넌트 구현
     - [x] 장바구니 아이콘을 클릭하면 장바구니 뷰로 이동한다.
     - [x] 상품 1개를 클릭하면 해당 상품 상세보기 뷰로 이동한다.
+    - [x] 상품 수량을 조절할 수 있다.
+      - [x] 0개인 아이템의 '+' 아이콘을 누르면 장바구니에 상품이 추가되며 동시에 갯수가 노출된다.
+      - [x] 1개인 아이템의 '-' 아이콘을 누르면 장바구니에 상품이 제거됨과 수량 버튼 노출이 사라진다.
+    - [x] 현재 장바구니에 추가된 아이템 갯수가 상품 목록뷰에 노출된다.
 
 - 상품 상세 뷰
     - [x] 상품 정보를 볼 수 있다.
@@ -36,3 +40,4 @@
         - [x] 수량만큼의 담은 상품 총계를 볼 수 있다.
     - [x] 장바구니에 담긴 모든 상품의 총계를 볼 수 있다.
 
+

app/src/androidTest/java/nextstep/shoppingcart/shoppinglist/shoppingcart/ShoppingCartScreenTest.kt

@@ -205,7 +205,7 @@ class ShoppingCartScreenTest {
 
         // then:
         composeTestRule.onNodeWithContentDescription("ShoppingButton")
-            .assertTextEquals("주문하기(1100)원")
+            .assertTextEquals("주문하기(1,100)원")
     }
 
     @Test
@@ -256,7 +256,7 @@ class ShoppingCartScreenTest {
 
         // then:
         composeTestRule.onNodeWithContentDescription("ShoppingButton")
-            .assertTextEquals("주문하기(1200)원")
+            .assertTextEquals("주문하기(1,200)원")
     }
 
     @Test
@@ -305,7 +305,7 @@ class ShoppingCartScreenTest {
 
         // then:
         composeTestRule.onNodeWithContentDescription("ShoppingButton")
-            .assertTextEquals("주문하기(1000)원")
+            .assertTextEquals("주문하기(1,000)원")
     }
 
     @Test

app/src/androidTest/java/nextstep/shoppingcart/shoppinglist/shoppinglist/ShoppingListScreenTest.kt

@@ -0,0 +1,151 @@
+package nextstep.shoppingcart.shoppinglist.shoppinglist
+
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.test.assertIsDisplayed
+import androidx.compose.ui.test.assertIsNotDisplayed
+import androidx.compose.ui.test.assertTextEquals
+import androidx.compose.ui.test.isDisplayed
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onNodeWithContentDescription
+import androidx.compose.ui.test.onNodeWithText
+import androidx.compose.ui.test.performClick
+import nextstep.shoppingcart.ui.shoppinglist.ShoppingListScreen
+import nextstep.shoppingcart.ui.shoppinglist.model.Product
+import org.junit.Rule
+import org.junit.Test
+
+class ShoppingListScreenTest {
+
+    @get:Rule
+    val composeTestRule = createComposeRule()
+
+    @Test
+    fun 상품의_담기_버튼을_누르면_수량조절_버튼이_노출된다() {
+        // given:
+        var products by mutableStateOf(
+            listOf(
+                Product(
+                    id = 0L,
+                    name = "테스트1",
+                    imageUrl = "",
+                    price = 110L,
+                    containedCount = 0,
+                )
+            )
+        )
+
+        composeTestRule.apply {
+            setContent {
+                ShoppingListScreen(
+                    products = products,
+                    onShoppingCartClick = {},
+                    onItemClick = {},
+                    onPutClick = { selectedProductId ->
+                        products = products.map { product ->
+                            if (selectedProductId == product.id) product.copy(
+                                containedCount = product.containedCount + 1
+                            ) else product
+                        }
+                    },
+                    onAddClick = {},
+                    onSubtractClick = {},
+                )
+            }
+        }
+
+        // when:
+        composeTestRule.onNodeWithContentDescription("shoppingProductAddButtonDescription")
+            .performClick()
+
+        // then:
+        composeTestRule.onNodeWithContentDescription("shoppingCountBarDescription")
+            .assertIsDisplayed()
+    }
+
+    @Test
+    fun 담긴_상품의_수량이_1개_미만일_경우_수량조절_버튼이_사라지고_담기버튼이_노출된다() {
+        // given:
+        var products by mutableStateOf(
+            listOf(
+                Product(
+                    id = 0L,
+                    name = "테스트1",
+                    imageUrl = "",
+                    price = 110L,
+                    containedCount = 1,
+                )
+            )
+        )
+
+        composeTestRule.apply {
+            setContent {
+                ShoppingListScreen(
+                    products = products,
+                    onShoppingCartClick = {},
+                    onItemClick = {},
+                    onPutClick = {},
+                    onAddClick = {},
+                    onSubtractClick = { selectedProductId ->
+                        products = products.map { product ->
+                            if (selectedProductId == product.id) product.copy(
+                                containedCount = product.containedCount - 1
+                            ) else product
+                        }
+                    },
+                )
+            }
+        }
+
+        // when:
+        composeTestRule.onNodeWithContentDescription("ShoppingCountBarSubtractIcon").performClick()
+
+        // then:
+        composeTestRule.onNodeWithContentDescription("ShoppingProductAddButton")
+            .assertIsDisplayed()
+        composeTestRule.onNodeWithContentDescription("shoppingCountBarDescription")
+            .assertIsNotDisplayed()
+    }
+
+    @Test
+    fun 담긴_상품의_수량이_2개일_경우_추가담기_버튼을_누르면_3개가_된다() {
+        // given:
+        var products by mutableStateOf(
+            listOf(
+                Product(
+                    id = 0L,
+                    name = "테스트1",
+                    imageUrl = "",
+                    price = 110L,
+                    containedCount = 2,
+                )
+            )
+        )
+
+        composeTestRule.apply {
+            setContent {
+                ShoppingListScreen(
+                    products = products,
+                    onShoppingCartClick = {},
+                    onItemClick = {},
+                    onPutClick = {},
+                    onAddClick = { selectedProductId ->
+                        products = products.map { product ->
+                            if (selectedProductId == product.id) product.copy(
+                                containedCount = product.containedCount + 1
+                            ) else product
+                        }
+                    },
+                    onSubtractClick = {},
+                )
+            }
+        }
+
+        // when:
+        composeTestRule.onNodeWithContentDescription("ShoppingCountBarAddIcon").performClick()
+
+        // then:
+        composeTestRule.onNodeWithText("3").isDisplayed()
+    }
+}

app/src/androidTest/java/nextstep/shoppingcart/shoppinglist/shoppinglist/component/ShoppingListLazyVerticalGridTest.kt

@@ -34,6 +34,9 @@ class ShoppingListLazyVerticalGridTest {
                         ),
                     ),
                     onItemClick = {},
+                    onPutClick = {},
+                    onAddClick = {},
+                    onSubtractClick = {},
                 )
             }
         }
@@ -73,6 +76,9 @@ class ShoppingListLazyVerticalGridTest {
                         )
                     ),
                     onItemClick = {},
+                    onPutClick = {},
+                    onAddClick = {},
+                    onSubtractClick = {},
                 )
             }
         }

app/src/androidTest/java/nextstep/shoppingcart/shoppinglist/shoppinglist/component/ShoppingProductHeaderTest.kt

@@ -0,0 +1,73 @@
+package nextstep.shoppingcart.shoppinglist.shoppinglist.component
+
+import androidx.compose.ui.test.assertIsDisplayed
+import androidx.compose.ui.test.assertIsNotDisplayed
+import androidx.compose.ui.test.assertTextEquals
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.test.onNodeWithContentDescription
+import nextstep.shoppingcart.ui.shoppinglist.component.ShoppingProductHeader
+import nextstep.shoppingcart.ui.shoppinglist.model.Product
+import org.junit.Rule
+import org.junit.Test
+
+class ShoppingProductHeaderTest {
+
+    @get:Rule
+    val composeTestRule = createComposeRule()
+
+    @Test
+    fun `0번_상품이_장바구니에_1개_이상_담겨있다면_갯수가_노출된다`() {
+        // given:
+        composeTestRule.apply {
+            setContent {
+                ShoppingProductHeader(
+                    product = Product(
+                        id = 0L,
+                        name = "요구르트",
+                        imageUrl = "",
+                        price = 500000000L,
+                        containedCount = 2,
+                    ),
+                    onPutClick = {},
+                    onAddClick = {},
+                    onSubtractClick = {},
+                )
+            }
+        }
+
+        // when:
+        // then:
+        composeTestRule.onNodeWithContentDescription("ShoppingProductAddButton")
+            .assertIsNotDisplayed()
+        composeTestRule.onNodeWithContentDescription("ShoppingCountBarTotalCount")
+            .assertTextEquals("2")
+    }
+
+    @Test
+    fun `0번_상품이_장바구니에_0개_담겨있다면_갯수_추가_버튼이_노출된다`() {
+        // given:
+        composeTestRule.apply {
+            setContent {
+                ShoppingProductHeader(
+                    product = Product(
+                        id = 0L,
+                        name = "요구르트",
+                        imageUrl = "",
+                        price = 500000000L,
+                        containedCount = 0,
+                    ),
+                    onPutClick = {},
+                    onAddClick = {},
+                    onSubtractClick = {},
+                )
+            }
+        }
+
+        // when:
+        // then:
+        composeTestRule.onNodeWithContentDescription("ShoppingProductAddButton")
+            .assertIsDisplayed()
+        composeTestRule.onNodeWithContentDescription("shoppingCountBarDescription")
+            .assertIsNotDisplayed()
+    }
+}

app/src/main/java/nextstep/shoppingcart/data/Cart.kt

@@ -38,6 +38,6 @@ object Cart {
         return items
     }
 
-    fun findProductById(productId: Long) =
-        items.find { it.product.id == productId } ?: throw IllegalArgumentException()
+    fun findCartProductById(cartProductId: Long) =
+        items.find { it.product.id == cartProductId } ?: throw IllegalArgumentException()
 }

app/src/main/java/nextstep/shoppingcart/data/Products.kt

@@ -1,5 +1,6 @@
 package nextstep.shoppingcart.data
 
+import nextstep.shoppingcart.data.Cart.items
 import nextstep.shoppingcart.ui.shoppinglist.model.Product
 
 object Products {
@@ -56,4 +57,9 @@ object Products {
 
     fun findProductById(productId: Long) =
         dummyProducts.find { it.id == productId } ?: throw IllegalArgumentException()
+
+    fun List<Product>.updateProducts(): List<Product> = map { product ->
+        items.find { it.product.id == product.id }
+            ?.let { product.copy(containedCount = it.count) } ?: product
+    }
 }

app/src/main/java/nextstep/shoppingcart/ui/component/ShoppingCountBar.kt

@@ -29,6 +29,7 @@ import nextstep.shoppingcart.R.drawable.ic_add
 import nextstep.shoppingcart.R.drawable.ic_subtract
 import nextstep.shoppingcart.R.string.shopping_count_bar_add_icon
 import nextstep.shoppingcart.R.string.shopping_count_bar_count
+import nextstep.shoppingcart.R.string.shopping_count_bar_description
 import nextstep.shoppingcart.R.string.shopping_count_bar_subtract_icon
 import nextstep.shoppingcart.R.string.shopping_count_bar_total_count
 import nextstep.shoppingcart.ui.theme.RobotoRegular
@@ -43,11 +44,14 @@ fun ShoppingCountBar(
     val shoppingCountBarSubtractIcon = stringResource(id = shopping_count_bar_subtract_icon)
     val shoppingCountBarAddIcon = stringResource(id = shopping_count_bar_add_icon)
     val shoppingCountBarTotalCount = stringResource(id = shopping_count_bar_total_count)
+    val shoppingCountBar = stringResource(shopping_count_bar_description)
 
     Row(
         horizontalArrangement = Arrangement.SpaceEvenly,
         verticalAlignment = Alignment.CenterVertically,
-        modifier = modifier.background(color = Color.White),
+        modifier = modifier
+            .background(color = Color.White)
+            .semantics { contentDescription = shoppingCountBar },
     ) {
         Icon(
             painter = painterResource(id = ic_subtract),

app/src/main/java/nextstep/shoppingcart/ui/shoppingcart/ShoppingCartRoute.kt

@@ -7,7 +7,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import nextstep.shoppingcart.data.Cart.addOne
-import nextstep.shoppingcart.data.Cart.findProductById
+import nextstep.shoppingcart.data.Cart.findCartProductById
 import nextstep.shoppingcart.data.Cart.items
 import nextstep.shoppingcart.data.Cart.removeAll
 import nextstep.shoppingcart.data.Cart.removeOne
@@ -25,17 +25,17 @@ fun ShoppingCartRoute(
         total = total,
         onBackClick = onBackClick,
         onRemoveClick = { cartProductId ->
-            removeAll(findProductById(cartProductId).product)
+            removeAll(findCartProductById(cartProductId).product)
             cartProducts = items
             total = totalPrice
         },
         onAddClick = { cartProductId ->
-            addOne(findProductById(cartProductId).product)
+            addOne(findCartProductById(cartProductId).product)
             cartProducts = items
             total = totalPrice
         },
         onSubtractClick = { cartProductId ->
-            removeOne(findProductById(cartProductId).product)
+            removeOne(findCartProductById(cartProductId).product)
             cartProducts = items
             total = totalPrice
         },

app/src/main/java/nextstep/shoppingcart/ui/shoppingcart/component/ShoppingCartItem.kt

@@ -35,8 +35,6 @@ fun ShoppingCartItem(
 
     Column(
         modifier = modifier
-            .fillMaxWidth()
-            .wrapContentHeight()
             .border(
                 width = 1.dp,
                 color = Color.Gray,
@@ -60,7 +58,7 @@ fun ShoppingCartItem(
     }
 }
 
-@Preview
+@Preview(showBackground = true)
 @Composable
 private fun ShoppingCartItemPreview() {
     ShoppingCartItem(