diff --git a/app/src/main/java/to/bitkit/ui/components/SyncNodeView.kt b/app/src/main/java/to/bitkit/ui/components/SyncNodeView.kt new file mode 100644 index 000000000..0a226f3a1 --- /dev/null +++ b/app/src/main/java/to/bitkit/ui/components/SyncNodeView.kt @@ -0,0 +1,64 @@ +package to.bitkit.ui.components + +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import to.bitkit.R +import to.bitkit.ui.screens.transfer.components.TransferAnimationView +import to.bitkit.ui.shared.util.gradientBackground +import to.bitkit.ui.theme.AppThemeSurface +import to.bitkit.ui.theme.Colors + +@Composable +fun SyncNodeView(modifier: Modifier) { + + Column( + modifier = modifier, + horizontalAlignment = Alignment.CenterHorizontally + ) { + Spacer(Modifier.height(32.dp)) + + BodyM( + text = stringResource(R.string.lightning__wait_text_top), + color = Colors.White64, + modifier = Modifier.padding(horizontal = 16.dp) + ) + + Spacer(modifier = Modifier.weight(1f)) + + TransferAnimationView( + largeCircleRes = R.drawable.ln_sync_large, + smallCircleRes = R.drawable.ln_sync_small, + contentRes = R.drawable.lightning, + rotateContent = false + ) + + Spacer(modifier = Modifier.weight(1f)) + + BodySSB(text = stringResource(R.string.lightning__wait_text_bottom), color = Colors.White32) + + Spacer(modifier = Modifier.height(32.dp)) + } +} + + +@Preview(showBackground = true) +@Composable +private fun Preview() { + AppThemeSurface { + SyncNodeView( + modifier = Modifier + .fillMaxSize() + .padding(horizontal = 16.dp) + .gradientBackground() + ) + } +} diff --git a/app/src/main/java/to/bitkit/ui/screens/transfer/components/TransferAnimationView.kt b/app/src/main/java/to/bitkit/ui/screens/transfer/components/TransferAnimationView.kt index eabc0b7d6..7447371e9 100644 --- a/app/src/main/java/to/bitkit/ui/screens/transfer/components/TransferAnimationView.kt +++ b/app/src/main/java/to/bitkit/ui/screens/transfer/components/TransferAnimationView.kt @@ -27,6 +27,8 @@ import to.bitkit.ui.theme.AppThemeSurface fun TransferAnimationView( @DrawableRes largeCircleRes: Int, @DrawableRes smallCircleRes: Int, + @DrawableRes contentRes: Int = R.drawable.transfer, + rotateContent: Boolean = true ) { Box( contentAlignment = Alignment.Center, @@ -73,12 +75,16 @@ fun TransferAnimationView( .rotate(rotationSmall) ) Image( - painter = painterResource(R.drawable.transfer), + painter = painterResource(contentRes), contentDescription = null, contentScale = ContentScale.Fit, modifier = Modifier .fillMaxWidth() - .rotate(rotationArrows) + .apply { + if (rotateContent) { + rotate(rotationArrows) + } + } ) } } diff --git a/app/src/main/java/to/bitkit/ui/screens/wallets/HomeScreen.kt b/app/src/main/java/to/bitkit/ui/screens/wallets/HomeScreen.kt index 77094c3d9..29c67d9d9 100644 --- a/app/src/main/java/to/bitkit/ui/screens/wallets/HomeScreen.kt +++ b/app/src/main/java/to/bitkit/ui/screens/wallets/HomeScreen.kt @@ -90,6 +90,7 @@ fun HomeScreen( is BottomSheetType.Send -> { SendOptionsView( appViewModel = appViewModel, + walletViewModel = walletViewModel, startDestination = sheet.route, onComplete = { txSheet -> appViewModel.hideSheet() diff --git a/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendAmountScreen.kt b/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendAmountScreen.kt index 93d104dbb..75fbe225f 100644 --- a/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendAmountScreen.kt +++ b/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendAmountScreen.kt @@ -13,8 +13,10 @@ import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource +import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import to.bitkit.R +import to.bitkit.models.NodeLifecycleState import to.bitkit.models.PrimaryDisplay import to.bitkit.ui.LocalBalances import to.bitkit.ui.LocalCurrencies @@ -23,13 +25,15 @@ import to.bitkit.ui.components.Keyboard import to.bitkit.ui.components.MoneySSB import to.bitkit.ui.components.OutlinedColorButton import to.bitkit.ui.components.PrimaryButton +import to.bitkit.ui.components.SyncNodeView import to.bitkit.ui.components.Text13Up import to.bitkit.ui.components.UnitButton import to.bitkit.ui.scaffold.SheetTopBar -import to.bitkit.ui.shared.util.DarkModePreview +import to.bitkit.ui.shared.util.gradientBackground import to.bitkit.ui.theme.AppThemeSurface import to.bitkit.ui.theme.Colors import to.bitkit.viewmodels.CurrencyUiState +import to.bitkit.viewmodels.MainUiState import to.bitkit.viewmodels.SendEvent import to.bitkit.viewmodels.SendMethod import to.bitkit.viewmodels.SendUiState @@ -38,101 +42,132 @@ import to.bitkit.viewmodels.SendUiState @Composable fun SendAmountScreen( uiState: SendUiState, + walletUiState: MainUiState, currencyUiState: CurrencyUiState = LocalCurrencies.current, onBack: () -> Unit, onEvent: (SendEvent) -> Unit, ) { Column( - modifier = Modifier.fillMaxSize() + modifier = Modifier + .fillMaxSize() + .gradientBackground() ) { SheetTopBar(stringResource(R.string.title_send_amount)) { onEvent(SendEvent.AmountReset) onBack() } - Spacer(Modifier.height(16.dp)) + if (walletUiState.nodeLifecycleState is NodeLifecycleState.Running) { + Spacer(Modifier.height(16.dp)) - Column( - modifier = Modifier.padding(horizontal = 16.dp) - ) { - BalanceHeaderView(sats = uiState.amountInput.toLong(), modifier = Modifier.fillMaxWidth()) - - Spacer(modifier = Modifier.height(24.dp)) - - Text13Up( - text = stringResource(R.string.wallet__send_available), - color = Colors.White64, - ) - Spacer(modifier = Modifier.height(4.dp)) - - Row( - verticalAlignment = Alignment.CenterVertically, + Column( + modifier = Modifier.padding(horizontal = 16.dp) ) { - val balances = LocalBalances.current - val availableAmount = when (uiState.payMethod) { - SendMethod.ONCHAIN -> balances.totalOnchainSats.toLong() - SendMethod.LIGHTNING -> balances.totalLightningSats.toLong() - } - MoneySSB(sats = availableAmount.toLong()) + BalanceHeaderView(sats = uiState.amountInput.toLong(), modifier = Modifier.fillMaxWidth()) - Spacer(modifier = Modifier.weight(1f)) + Spacer(modifier = Modifier.height(24.dp)) + + Text13Up( + text = stringResource(R.string.wallet__send_available), + color = Colors.White64, + ) + Spacer(modifier = Modifier.height(4.dp)) - OutlinedColorButton( - onClick = { onEvent(SendEvent.PaymentMethodSwitch) }, - enabled = uiState.isUnified, - color = when (uiState.payMethod) { - SendMethod.ONCHAIN -> Colors.Brand - SendMethod.LIGHTNING -> Colors.Purple - }, - modifier = Modifier.height(28.dp) + Row( + verticalAlignment = Alignment.CenterVertically, ) { - Text13Up( - text = when (uiState.payMethod) { - SendMethod.ONCHAIN -> stringResource(R.string.savings) - SendMethod.LIGHTNING -> stringResource(R.string.spending) - }, + val balances = LocalBalances.current + val availableAmount = when (uiState.payMethod) { + SendMethod.ONCHAIN -> balances.totalOnchainSats.toLong() + SendMethod.LIGHTNING -> balances.totalLightningSats.toLong() + } + MoneySSB(sats = availableAmount.toLong()) + + Spacer(modifier = Modifier.weight(1f)) + + OutlinedColorButton( + onClick = { onEvent(SendEvent.PaymentMethodSwitch) }, + enabled = uiState.isUnified, color = when (uiState.payMethod) { SendMethod.ONCHAIN -> Colors.Brand SendMethod.LIGHTNING -> Colors.Purple - } + }, + modifier = Modifier.height(28.dp) + ) { + Text13Up( + text = when (uiState.payMethod) { + SendMethod.ONCHAIN -> stringResource(R.string.savings) + SendMethod.LIGHTNING -> stringResource(R.string.spending) + }, + color = when (uiState.payMethod) { + SendMethod.ONCHAIN -> Colors.Brand + SendMethod.LIGHTNING -> Colors.Purple + } + ) + } + Spacer(modifier = Modifier.width(8.dp)) + UnitButton( + modifier = Modifier.height(28.dp) ) } - Spacer(modifier = Modifier.width(8.dp)) - UnitButton( - modifier = Modifier.height(28.dp) - ) - } - Spacer(modifier = Modifier.weight(1f)) + Spacer(modifier = Modifier.weight(1f)) - HorizontalDivider(modifier = Modifier.padding(vertical = 24.dp)) + HorizontalDivider(modifier = Modifier.padding(vertical = 24.dp)) - Keyboard( - onClick = { number -> onEvent(SendEvent.AmountChange(number)) }, - isDecimal = currencyUiState.primaryDisplay == PrimaryDisplay.FIAT, - modifier = Modifier.fillMaxWidth(), - ) + Keyboard( + onClick = { number -> onEvent(SendEvent.AmountChange(number)) }, + isDecimal = currencyUiState.primaryDisplay == PrimaryDisplay.FIAT, + modifier = Modifier.fillMaxWidth(), + ) - Spacer(modifier = Modifier.height(41.dp)) + Spacer(modifier = Modifier.height(41.dp)) - PrimaryButton( - text = stringResource(R.string.continue_button), - enabled = uiState.isAmountInputValid, - onClick = { onEvent(SendEvent.AmountContinue(uiState.amountInput)) }, - ) + PrimaryButton( + text = stringResource(R.string.continue_button), + enabled = uiState.isAmountInputValid, + onClick = { onEvent(SendEvent.AmountContinue(uiState.amountInput)) }, + ) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(16.dp)) + } + } else { + SyncNodeView(modifier = Modifier + .fillMaxWidth() + .weight(1f)) } } } -@DarkModePreview +@Preview(showBackground = true) @Composable -private fun SendAmountViewPreview() { +private fun Preview1() { AppThemeSurface { SendAmountScreen( uiState = SendUiState( payMethod = SendMethod.LIGHTNING, + amountInput = "100" + ), + walletUiState = MainUiState( + nodeLifecycleState = NodeLifecycleState.Running + ), + onBack = {}, + onEvent = {}, + ) + } +} + +@Preview(showBackground = true) +@Composable +private fun Preview2() { + AppThemeSurface { + SendAmountScreen( + uiState = SendUiState( + payMethod = SendMethod.LIGHTNING, + amountInput = "100" + ), + walletUiState = MainUiState( + nodeLifecycleState = NodeLifecycleState.Initializing ), onBack = {}, onEvent = {}, diff --git a/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendOptionsView.kt b/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendOptionsView.kt index 9b82a1579..a59650eb5 100644 --- a/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendOptionsView.kt +++ b/app/src/main/java/to/bitkit/ui/screens/wallets/send/SendOptionsView.kt @@ -1,7 +1,6 @@ package to.bitkit.ui.screens.wallets.send import androidx.compose.foundation.Image -import androidx.compose.foundation.background import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight @@ -39,14 +38,15 @@ import to.bitkit.ui.screens.scanner.QrScanningScreen import to.bitkit.ui.shared.util.gradientBackground import to.bitkit.ui.theme.AppThemeSurface import to.bitkit.ui.theme.Colors -import to.bitkit.ui.theme.Colors.Black25 import to.bitkit.viewmodels.AppViewModel import to.bitkit.viewmodels.SendEffect import to.bitkit.viewmodels.SendEvent +import to.bitkit.viewmodels.WalletViewModel @Composable fun SendOptionsView( appViewModel: AppViewModel, + walletViewModel: WalletViewModel, startDestination: SendRoute = SendRoute.Options, onComplete: (NewTransactionSheetDetails?) -> Unit, ) { @@ -88,8 +88,10 @@ fun SendOptionsView( } composable { val uiState by appViewModel.sendUiState.collectAsStateWithLifecycle() + val walletUiState by walletViewModel.uiState.collectAsStateWithLifecycle() SendAmountScreen( uiState = uiState, + walletUiState = walletUiState, onBack = { navController.popBackStack() }, onEvent = { appViewModel.setSendEvent(it) } )