Add deposit return voucher UI (Apps-1643)

CHANGELOG.md

@@ -3,6 +3,7 @@ All notable changes to this project will be documented in this file.
 
 ## UNRELEASED
 ### Added
+* ui: Add UI for deposit return vouchers (APPS-1643)
 ### Changed
 ### Removed
 * ui/core: Remove everything related to the old deposit return voucher feature

core/src/main/java/io/snabble/sdk/shoppingcart/ShoppingCartUpdater.kt

@@ -149,7 +149,7 @@ internal class ShoppingCartUpdater(
 
             addLineItemsAsCartItems(filter { it.type == LineItemType.COUPON })
             addLineItemsAsCartItems(filter { it.type == LineItemType.DEPOSIT })
-            addLineItemsAsCartItems(filter { it.type == LineItemType.DEPOSIT_RETURN })
+            addDepositReturnsToVoucher(filter { it.type == LineItemType.DEPOSIT_RETURN })
         }
 
         setOnlinePrice(price)
@@ -166,6 +166,15 @@ internal class ShoppingCartUpdater(
         }
     }
 
+    private fun addDepositReturnsToVoucher(depositReturnItems: List<LineItem>) {
+        depositReturnItems
+            .groupBy { it.refersTo }
+            .forEach { (refersTo, items) ->
+                val drv = cart.getByItemId(refersTo)
+                drv?.depositReturnVoucher = drv?.depositReturnVoucher?.copy(lineItems = items)
+            }
+    }
+
     private fun addCartDiscounts(cartDiscountItems: List<LineItem>) {
         val totalCartDiscount = cartDiscountItems.sumOf { it.totalPrice }
         val cartDiscounts = cartDiscountItems.mapNotNull { it.name }

core/src/main/java/io/snabble/sdk/shoppingcart/data/item/DepositReturnVoucher.kt

@@ -1,8 +1,11 @@
 package io.snabble.sdk.shoppingcart.data.item
 
+import io.snabble.sdk.checkout.LineItem
+
 data class DepositReturnVoucher(
     val itemId: String,
     val scannedCode: String,
     val amount: Int = 1,
     val type: ItemType = ItemType.DEPOSIT_RETURN_VOUCHER,
+    val lineItems: List<LineItem> = emptyList()
 )

ui/src/main/java/io/snabble/sdk/ui/cart/shoppingcart/ShoppingCartScreen.kt

@@ -2,7 +2,7 @@ package io.snabble.sdk.ui.cart.shoppingcart
 
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -16,8 +16,10 @@ import io.snabble.sdk.checkout.LineItem
 import io.snabble.sdk.shoppingcart.ShoppingCart
 import io.snabble.sdk.ui.cart.shoppingcart.cartdiscount.CartDiscount
 import io.snabble.sdk.ui.cart.shoppingcart.cartdiscount.model.CartDiscountItem
+import io.snabble.sdk.ui.cart.shoppingcart.depositreturn.DepositReturn
 import io.snabble.sdk.ui.cart.shoppingcart.product.DeletableProduct
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.DepositItem
+import io.snabble.sdk.ui.cart.shoppingcart.product.model.DepositReturnItem
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.DiscountItem
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.ProductItem
 import io.snabble.sdk.ui.utils.ThemeWrapper
@@ -61,7 +63,7 @@ private fun ShoppingCartScreen(
     LazyColumn(
         modifier = modifier.nestedScroll(rememberNestedScrollInteropConnection())
     ) {
-        items(items = uiState.items, key = { it.hashCode() }) { cartItem ->
+        itemsIndexed(items = uiState.items, key = { _, item -> item.hashCode() }) { index, cartItem ->
             when (cartItem) {
                 is ProductItem -> {
                     DeletableProduct(
@@ -72,17 +74,21 @@ private fun ShoppingCartScreen(
                             onQuantityChanged(cartItem.item, quantity)
                         }
                     )
-                    HorizontalDivider()
+                }
+
+                is DepositReturnItem -> {
+                    val showHint = uiState.totalCartPrice != null && uiState.totalCartPrice < 0
+                    DepositReturn(item = cartItem, showHint = showHint, onDeleteClick = onItemDeleted)
                 }
 
                 is CartDiscountItem -> {
                     CartDiscount(
                         modifier = Modifier.fillMaxWidth(),
                         item = cartItem
                     )
-                    HorizontalDivider()
                 }
             }
+            if (index != uiState.items.lastIndex) HorizontalDivider()
         }
     }
 }

ui/src/main/java/io/snabble/sdk/ui/cart/shoppingcart/ShoppingCartViewModel.kt

@@ -9,6 +9,7 @@ import io.snabble.sdk.shoppingcart.data.item.ItemType
 import io.snabble.sdk.shoppingcart.data.listener.SimpleShoppingCartListener
 import io.snabble.sdk.ui.cart.shoppingcart.cartdiscount.model.CartDiscountItem
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.DepositItem
+import io.snabble.sdk.ui.cart.shoppingcart.product.model.DepositReturnItem
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.DiscountItem
 import io.snabble.sdk.ui.cart.shoppingcart.product.model.ProductItem
 import io.snabble.sdk.ui.telemetry.Telemetry
@@ -30,6 +31,7 @@ class ShoppingCartViewModel : ViewModel() {
         }
     }
 
+    // used to update the cart remote -> do not delete it
     fun updateCart() {
         updateUiState(cachedCart)
     }
@@ -68,12 +70,11 @@ class ShoppingCartViewModel : ViewModel() {
     private fun updateUiState(cart: ShoppingCart) {
         cachedCart = cart
 
-        val filteredCart = cart.filterNotNull()
-
         val cartItems: MutableList<CartItem> = mutableListOf()
-
-        with(filteredCart) {
+        with(cart.filterNotNull()) {
             filter { it.type == ItemType.PRODUCT }.let { cartItems.addProducts(it) }
+            filter { it.lineItem?.type == LineItemType.DEPOSIT_RETURN_VOUCHER }
+                .let { cartItems.addDepositReturnItems(it) }
 
             filter { it.lineItem?.type == LineItemType.DEPOSIT }.let { cartItems.addDepositsToProducts(it) }
 
@@ -85,7 +86,21 @@ class ShoppingCartViewModel : ViewModel() {
         cartItems.updatePrices()
         cartItems.sortCartDiscountsToBottom()
 
-        _uiState.update { it.copy(items = cartItems) }
+        _uiState.update { it.copy(items = cartItems, totalCartPrice = cachedCart.totalPrice) }
+    }
+
+    private fun MutableList<CartItem>.addDepositReturnItems(items: List<ShoppingCart.Item>) {
+        items.forEach { item ->
+            val totalDepositReturnPrice =
+                item.depositReturnVoucher?.lineItems?.sumOf { it.totalPrice } ?: return@forEach
+
+            add(
+                DepositReturnItem(
+                    item = item,
+                    totalDeposit = priceFormatter?.format(totalDepositReturnPrice).orEmpty()
+                )
+            )
+        }
     }
 
     private fun MutableList<CartItem>.sortCartDiscountsToBottom() {
@@ -230,6 +245,7 @@ class ShoppingCartViewModel : ViewModel() {
 }
 
 sealed interface Event
+
 internal data class RemoveItem(
     val item: ShoppingCart.Item,
     val onSuccess: (index: Int) -> Unit
@@ -242,4 +258,5 @@ internal data class UpdateQuantity(
 
 data class UiState(
     val items: List<CartItem> = emptyList(),
+    val totalCartPrice: Int? = null
 )

ui/src/main/java/io/snabble/sdk/ui/cart/shoppingcart/cartdiscount/CartDiscount.kt

@@ -3,8 +3,10 @@ package io.snabble.sdk.ui.cart.shoppingcart.cartdiscount
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.material3.Surface
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -13,7 +15,10 @@ import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.PreviewLightDark
 import androidx.compose.ui.unit.dp
+import io.snabble.sdk.checkout.LineItem
+import io.snabble.sdk.shoppingcart.ShoppingCart
 import io.snabble.sdk.ui.cart.shoppingcart.cartdiscount.model.CartDiscountItem
 import io.snabble.sdk.ui.cart.shoppingcart.cartdiscount.widget.DiscountDescription
 
@@ -41,3 +46,18 @@ internal fun CartDiscount(
         )
     }
 }
+
+@PreviewLightDark
+@Composable
+private fun Preview() {
+    Surface {
+        CartDiscount(
+            modifier = Modifier.fillMaxWidth(),
+            item = CartDiscountItem(
+                item = ShoppingCart.Item(ShoppingCart(), LineItem(id = "", amount = 1)),
+                discount = "7.00",
+                name = "SUPER DUPER RABATT"
+            )
+        )
+    }
+}

ui/src/main/java/io/snabble/sdk/ui/cart/shoppingcart/depositreturn/DepositReturn.kt

@@ -0,0 +1,136 @@
+package io.snabble.sdk.ui.cart.shoppingcart.depositreturn
+
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedIconButton
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.font.FontWeight.Companion.Bold
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.PreviewLightDark
+import androidx.compose.ui.unit.dp
+import io.snabble.sdk.shoppingcart.ShoppingCart
+import io.snabble.sdk.shoppingcart.data.item.DepositReturnVoucher
+import io.snabble.sdk.shoppingcart.data.item.ItemType
+import io.snabble.sdk.ui.R
+import io.snabble.sdk.ui.cart.shoppingcart.product.model.DepositReturnItem
+
+@Composable
+fun DepositReturn(
+    modifier: Modifier = Modifier,
+    item: DepositReturnItem,
+    showHint: Boolean = false,
+    onDeleteClick: (ShoppingCart.Item) -> Unit
+) {
+    Column(
+        modifier = modifier
+            .fillMaxWidth()
+            .padding(vertical = 16.dp, horizontal = 16.dp)
+            .heightIn(min = 48.dp),
+        verticalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterVertically)
+    ) {
+
+        Row(
+            modifier = Modifier
+                .fillMaxWidth(),
+            verticalAlignment = Alignment.CenterVertically,
+            horizontalArrangement = Arrangement.spacedBy(16.dp)
+        ) {
+            Column(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .weight(1f),
+                verticalArrangement = Arrangement.spacedBy(4.dp),
+            ) {
+                Text(
+                    text = stringResource(R.string.Snabble_ShoppingCart_DepositReturn_title),
+                    style = MaterialTheme.typography.bodyLarge,
+                    color = MaterialTheme.colorScheme.onSurface
+                )
+                Text(
+                    text = item.totalDeposit,
+                    style = MaterialTheme.typography.bodySmall,
+                    fontWeight = Bold,
+                    color = MaterialTheme.colorScheme.onSurface
+                )
+            }
+            OutlinedIconButton(
+                modifier = Modifier.size(36.dp),
+                border = BorderStroke(
+                    width = 1.dp,
+                    color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.33f)
+                ),
+                onClick = { onDeleteClick(item.item) }
+            ) {
+                Icon(
+                    painter = painterResource(R.drawable.snabble_ic_delete),
+                    contentDescription = stringResource(
+                        id = R.string.Snabble_Shoppingcart_Accessibility_actionDelete
+                    ),
+                    tint = MaterialTheme.colorScheme.onSurface
+                )
+            }
+
+        }
+        if (showHint) {
+            Text(
+                modifier = Modifier.fillMaxWidth(),
+                text = stringResource(R.string.Snabble_ShoppingCart_DepositReturn_message),
+                style = MaterialTheme.typography.bodySmall,
+                fontWeight = Bold,
+                color = MaterialTheme.colorScheme.error,
+                textAlign = TextAlign.Center
+            )
+        }
+
+    }
+}
+
+@PreviewLightDark
+@Composable
+private fun PreviewWithHint() {
+    Surface {
+        DepositReturn(
+            item = DepositReturnItem(
+                item = ShoppingCart.Item(
+                    ShoppingCart(),
+                    DepositReturnVoucher("", "", 1, ItemType.DEPOSIT_RETURN_VOUCHER)
+                ),
+                totalDeposit = "-0.75€"
+            ),
+            showHint = true,
+            onDeleteClick = {}
+        )
+    }
+}
+
+@PreviewLightDark
+@Composable
+private fun PreviewWithoutHint() {
+    Surface {
+        DepositReturn(
+            item = DepositReturnItem(
+                item = ShoppingCart.Item(
+                    ShoppingCart(),
+                    DepositReturnVoucher("", "", 1, ItemType.DEPOSIT_RETURN_VOUCHER)
+                ),
+                totalDeposit = "-0.75€"
+            ),
+            showHint = false,
+            onDeleteClick = {}
+        )
+    }
+}

ui/src/main/java/io/snabble/sdk/ui/cart/shoppingcart/product/model/DepositReturnItem.kt

@@ -0,0 +1,9 @@
+package io.snabble.sdk.ui.cart.shoppingcart.product.model
+
+import io.snabble.sdk.shoppingcart.ShoppingCart
+import io.snabble.sdk.ui.cart.shoppingcart.CartItem
+
+data class DepositReturnItem(
+    override val item: ShoppingCart.Item,
+    val totalDeposit: String
+) : CartItem

ui/src/main/res/values-de/strings.xml

@@ -341,6 +341,8 @@
   <string name="Snabble.Shop.List.Expand.accessibility">aufklappen</string>
   <string name="Snabble.Shop.List.ShowDetails.accessibility">Shop-Details anzeigen</string>
   <string name="Snabble.Shopping.title">Einkaufen</string>
+  <string name="Snabble.ShoppingCart.DepositReturn.message">Damit der Leergutbon eingelöst werden kann, fülle deinen Warenkorb mit deinen Wunschprodukten.</string>
+  <string name="Snabble.ShoppingCart.DepositReturn.title">Leergutbon</string>
   <string name="Snabble.ShoppingCart.title">Warenkorb</string>
   <string name="Snabble.ShoppingList.AddItem.viaScan">Produkte scannen</string>
   <string name="Snabble.ShoppingList.AddItem.viaVoice">Produkte diktieren</string>

ui/src/main/res/values/strings.xml

@@ -341,6 +341,8 @@
   <string name="Snabble.Shop.List.Expand.accessibility">expand</string>
   <string name="Snabble.Shop.List.ShowDetails.accessibility">Show shop details</string>
   <string name="Snabble.Shopping.title">Shopping</string>
+  <string name="Snabble.ShoppingCart.DepositReturn.message">To redeem your voucher, fill your shopping basket with the products you wish to purchase.</string>
+  <string name="Snabble.ShoppingCart.DepositReturn.title">Deposit voucher</string>
   <string name="Snabble.ShoppingCart.title">Shopping Cart</string>
   <string name="Snabble.ShoppingList.AddItem.viaScan">Scan products</string>
   <string name="Snabble.ShoppingList.AddItem.viaVoice">Tell products</string>