feat(transfer): use numpad for receiving capacity amount

ovitrif · ovitrif · commit b6c64900c447 · 2025-09-17T13:44:40.000+02:00
diff --git a/app/src/main/java/to/bitkit/ui/screens/transfer/SpendingAdvancedScreen.kt b/app/src/main/java/to/bitkit/ui/screens/transfer/SpendingAdvancedScreen.kt
@@ -3,14 +3,10 @@ package to.bitkit.ui.screens.transfer
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.imePadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredHeight
-import androidx.compose.foundation.layout.width
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -26,88 +22,117 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Devices.NEXUS_5
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import to.bitkit.R
 import to.bitkit.ext.mockOrder
+import to.bitkit.models.Toast
+import to.bitkit.repositories.CurrencyState
 import to.bitkit.ui.LocalCurrencies
 import to.bitkit.ui.appViewModel
-import to.bitkit.ui.components.AmountInput
 import to.bitkit.ui.components.Caption13Up
 import to.bitkit.ui.components.Display
+import to.bitkit.ui.components.FillHeight
+import to.bitkit.ui.components.HorizontalSpacer
 import to.bitkit.ui.components.MoneySSB
+import to.bitkit.ui.components.NumberPad
 import to.bitkit.ui.components.NumberPadActionButton
+import to.bitkit.ui.components.NumberPadTextField
 import to.bitkit.ui.components.PrimaryButton
+import to.bitkit.ui.components.VerticalSpacer
 import to.bitkit.ui.scaffold.AppTopBar
 import to.bitkit.ui.scaffold.CloseNavIcon
 import to.bitkit.ui.scaffold.ScreenColumn
 import to.bitkit.ui.theme.AppThemeSurface
 import to.bitkit.ui.theme.Colors
 import to.bitkit.ui.utils.withAccent
+import to.bitkit.viewmodels.AmountInputViewModel
 import to.bitkit.viewmodels.TransferEffect
 import to.bitkit.viewmodels.TransferToSpendingUiState
 import to.bitkit.viewmodels.TransferValues
 import to.bitkit.viewmodels.TransferViewModel
+import to.bitkit.viewmodels.previewAmountInputViewModel
 
+@Suppress("ViewModelForwarding")
 @Composable
 fun SpendingAdvancedScreen(
     viewModel: TransferViewModel,
     onBackClick: () -> Unit = {},
     onCloseClick: () -> Unit = {},
     onOrderCreated: () -> Unit = {},
+    currencies: CurrencyState = LocalCurrencies.current,
+    amountInputViewModel: AmountInputViewModel = hiltViewModel(),
 ) {
     val app = appViewModel ?: return
     val state by viewModel.spendingUiState.collectAsStateWithLifecycle()
     val order = state.order ?: return
     val transferValues by viewModel.transferValues.collectAsState()
+    val amountUiState by amountInputViewModel.uiState.collectAsStateWithLifecycle()
+    var isLoading by remember { mutableStateOf(false) }
 
     LaunchedEffect(order.clientBalanceSat) {
         viewModel.updateTransferValues(order.clientBalanceSat)
     }
 
+    LaunchedEffect(amountUiState.sats) {
+        viewModel.onReceivingAmountChange(amountUiState.sats)
+    }
+
     LaunchedEffect(Unit) {
         viewModel.transferEffects.collect { effect ->
             when (effect) {
                 TransferEffect.OnOrderCreated -> onOrderCreated()
-                is TransferEffect.ToastException -> app.toast(effect.e)
-                is TransferEffect.ToastError -> app.toast(
-                    type = to.bitkit.models.Toast.ToastType.ERROR,
-                    title = effect.title,
-                    description = effect.description,
-                )
+                is TransferEffect.ToastException -> {
+                    isLoading = false
+                    app.toast(effect.e)
+                }
+
+                is TransferEffect.ToastError -> {
+                    isLoading = false
+                    app.toast(
+                        type = Toast.ToastType.ERROR,
+                        title = effect.title,
+                        description = effect.description,
+                    )
+                }
             }
         }
     }
 
     val isValid = transferValues.let {
-        val isAboveMin = state.receivingAmount.toULong() >= it.minLspBalance
-        val isBelowMax = state.receivingAmount.toULong() <= it.maxLspBalance
-        state.receivingAmount > 0 && isAboveMin && isBelowMax
+        val amount = amountUiState.sats.toULong()
+        amount > 0u && amount in it.minLspBalance..it.maxLspBalance
     }
 
     Content(
         uiState = state,
         transferValues = transferValues,
         isValid = isValid,
+        isLoading = isLoading,
+        amountInputViewModel = amountInputViewModel,
+        currencies = currencies,
         onBack = onBackClick,
         onClose = onCloseClick,
-        onAmountChange = viewModel::onReceivingAmountChange,
-        onContinue = viewModel::onSpendingAdvancedContinue,
+        onContinue = {
+            isLoading = true
+            viewModel.onSpendingAdvancedContinue(amountUiState.sats)
+        },
     )
 }
 
+@Suppress("ViewModelForwarding")
 @Composable
 private fun Content(
     uiState: TransferToSpendingUiState,
     transferValues: TransferValues,
     isValid: Boolean,
+    isLoading: Boolean,
+    amountInputViewModel: AmountInputViewModel,
     onBack: () -> Unit,
     onClose: () -> Unit,
-    onAmountChange: (Long) -> Unit,
     onContinue: () -> Unit,
+    currencies: CurrencyState = LocalCurrencies.current,
 ) {
-    val currencies = LocalCurrencies.current
-    uiState.order ?: return
-
     ScreenColumn {
         AppTopBar(
             titleText = stringResource(R.string.lightning__transfer__nav_title),
@@ -118,31 +143,28 @@ private fun Content(
             modifier = Modifier
                 .padding(horizontal = 16.dp)
                 .fillMaxSize()
-                .imePadding()
                 .testTag("SpendingAdvanced")
         ) {
-            var overrideSats: Long? by remember { mutableStateOf(null) }
-            var isLoading by remember { mutableStateOf(false) }
+            VerticalSpacer(minHeight = 16.dp, maxHeight = 32.dp)
 
-            Spacer(modifier = Modifier.height(32.dp))
             Display(
                 text = stringResource(R.string.lightning__spending_advanced__title)
                     .withAccent(accentColor = Colors.Purple)
             )
-            Spacer(modifier = Modifier.height(32.dp))
 
-            AmountInput(
-                defaultValue = uiState.receivingAmount,
-                primaryDisplay = currencies.primaryDisplay,
-                overrideSats = overrideSats,
-                onSatsChange = { sats ->
-                    onAmountChange(sats)
-                    overrideSats = null
-                },
-                modifier = Modifier.testTag("SpendingAdvancedNumberField")
+            FillHeight()
+
+            NumberPadTextField(
+                viewModel = amountInputViewModel,
+                currencies = currencies,
+                showSecondaryField = false,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .testTag("SpendingAdvancedNumberField")
             )
 
-            Spacer(modifier = Modifier.height(10.dp))
+            VerticalSpacer(height = 16.dp)
+
             Row(
                 verticalAlignment = Alignment.CenterVertically,
                 modifier = Modifier.requiredHeight(20.dp),
@@ -151,72 +173,67 @@ private fun Content(
                     text = stringResource(R.string.lightning__spending_advanced__fee),
                     color = Colors.White64,
                 )
-                Spacer(modifier = Modifier.width(4.dp))
+                HorizontalSpacer(8.dp)
                 uiState.feeEstimate?.let {
-                    MoneySSB(it)
+                    MoneySSB(it, showSymbol = true)
                 } ?: run {
                     Caption13Up(text = "—", color = Colors.White64)
                 }
             }
 
-            Spacer(modifier = Modifier.weight(1f))
+            FillHeight()
 
-            // Actions Row
             Row(
                 verticalAlignment = Alignment.Bottom,
                 horizontalArrangement = Arrangement.SpaceBetween,
                 modifier = Modifier
                     .fillMaxWidth()
                     .padding(vertical = 8.dp)
             ) {
-                // Min Button
                 NumberPadActionButton(
                     text = stringResource(R.string.common__min),
                     color = Colors.Purple,
-                    onClick = {
-                        overrideSats = transferValues.minLspBalance.toLong()
-                    },
+                    onClick = { amountInputViewModel.setSats(transferValues.minLspBalance.toLong(), currencies) },
                     modifier = Modifier.testTag("SpendingAdvancedMin")
                 )
-                // Default Button
                 NumberPadActionButton(
                     text = stringResource(R.string.common__default),
                     color = Colors.Purple,
-                    onClick = {
-                        overrideSats = transferValues.defaultLspBalance.toLong()
-                    },
+                    onClick = { amountInputViewModel.setSats(transferValues.defaultLspBalance.toLong(), currencies) },
                     modifier = Modifier.testTag("SpendingAdvancedDefault")
                 )
-                // Max Button
                 NumberPadActionButton(
                     text = stringResource(R.string.common__max),
                     color = Colors.Purple,
-                    onClick = {
-                        overrideSats = transferValues.maxLspBalance.toLong()
-                    },
+                    onClick = { amountInputViewModel.setSats(transferValues.maxLspBalance.toLong(), currencies) },
                     modifier = Modifier.testTag("SpendingAdvancedMax")
                 )
             }
+
             HorizontalDivider()
-            Spacer(modifier = Modifier.height(16.dp))
+            VerticalSpacer(16.dp)
+
+            NumberPad(
+                viewModel = amountInputViewModel,
+                currencies = currencies,
+            )
 
             PrimaryButton(
                 text = stringResource(R.string.common__continue),
-                onClick = {
-                    isLoading = true
-                    onContinue()
-                },
+                onClick = onContinue,
                 enabled = !isLoading && isValid,
                 isLoading = isLoading,
                 modifier = Modifier.testTag("SpendingAdvancedContinue")
             )
 
-            Spacer(modifier = Modifier.height(16.dp))
+            VerticalSpacer(16.dp)
         }
     }
 }
 
 @Preview(showSystemUi = true)
+@Preview(showSystemUi = true, device = "id:pixel_9_pro_xl", name = "Large")
+@Preview(showSystemUi = true, device = NEXUS_5, name = "Small")
 @Composable
 private fun Preview() {
     AppThemeSurface {
@@ -232,33 +249,10 @@ private fun Preview() {
                 maxLspBalance = 90_000u,
             ),
             isValid = true,
+            amountInputViewModel = previewAmountInputViewModel(),
+            isLoading = false,
             onBack = {},
             onClose = {},
-            onAmountChange = {},
-            onContinue = {},
-        )
-    }
-}
-
-@Preview(showSystemUi = true, device = NEXUS_5)
-@Composable
-private fun PreviewSmall() {
-    AppThemeSurface {
-        Content(
-            uiState = TransferToSpendingUiState(
-                order = mockOrder().copy(clientBalanceSat = 50_000u),
-                receivingAmount = 120_521L,
-                feeEstimate = 12_461L,
-            ),
-            transferValues = TransferValues(
-                defaultLspBalance = 50_000u,
-                minLspBalance = 10_000u,
-                maxLspBalance = 90_000u,
-            ),
-            isValid = true,
-            onBack = {},
-            onClose = {},
-            onAmountChange = {},
             onContinue = {},
         )
     }
@@ -281,9 +275,10 @@ private fun PreviewLoading() {
                 maxLspBalance = 40_000u,
             ),
             isValid = true,
+            amountInputViewModel = previewAmountInputViewModel(),
+            isLoading = true,
             onBack = {},
             onClose = {},
-            onAmountChange = {},
             onContinue = {},
         )
     }
diff --git a/app/src/main/java/to/bitkit/ui/screens/transfer/SpendingAmountScreen.kt b/app/src/main/java/to/bitkit/ui/screens/transfer/SpendingAmountScreen.kt
@@ -225,7 +225,10 @@ private fun SpendingAmountNodeRunning(
         HorizontalDivider()
         VerticalSpacer(16.dp)
 
-        NumberPad(viewModel = amountInputViewModel)
+        NumberPad(
+            viewModel = amountInputViewModel,
+            currencies = currencies,
+        )
 
         PrimaryButton(
             text = stringResource(R.string.common__continue),
@@ -240,6 +243,8 @@ private fun SpendingAmountNodeRunning(
 }
 
 @Preview(showSystemUi = true)
+@Preview(showSystemUi = true, device = "id:pixel_9_pro_xl", name = "Large")
+@Preview(showSystemUi = true, device = NEXUS_5, name = "Small")
 @Composable
 private fun Preview() {
     AppThemeSurface {
@@ -257,25 +262,7 @@ private fun Preview() {
     }
 }
 
-@Preview(showSystemUi = true, device = NEXUS_5)
-@Composable
-private fun PreviewSmall() {
-    AppThemeSurface {
-        Content(
-            isNodeRunning = true,
-            uiState = TransferToSpendingUiState(maxAllowedToSend = 158_234, balanceAfterFee = 158_234),
-            amountInputViewModel = previewAmountInputViewModel(),
-            currencies = CurrencyState(),
-            onBackClick = {},
-            onCloseClick = {},
-            onClickQuarter = {},
-            onClickMaxAmount = {},
-            onConfirmAmount = {},
-        )
-    }
-}
-
-@Preview(showSystemUi = true, device = NEXUS_5)
+@Preview(showSystemUi = true)
 @Composable
 private fun PreviewInitializing() {
     AppThemeSurface {
diff --git a/app/src/main/java/to/bitkit/viewmodels/AmountInputViewModel.kt b/app/src/main/java/to/bitkit/viewmodels/AmountInputViewModel.kt
@@ -1,5 +1,6 @@
 package to.bitkit.viewmodels
 
+import android.annotation.SuppressLint
 import androidx.compose.runtime.Composable
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
@@ -411,6 +412,7 @@ data class AmountInputUiState(
     val errorKey: String? = null,
 )
 
+@SuppressLint("ViewModelConstructorInComposable")
 @Composable
 fun previewAmountInputViewModel(
     sats: Long = 4_567,
diff --git a/app/src/main/java/to/bitkit/viewmodels/TransferViewModel.kt b/app/src/main/java/to/bitkit/viewmodels/TransferViewModel.kt
