From 22029cd23b4e21df568a87dd9f759e7ccb3880fb Mon Sep 17 00:00:00 2001 From: Iván Ávalos Date: Fri, 5 Jan 2024 12:46:02 -0600 Subject: [wallet] Add UX from now-deleted push/pull result screens into p2p tx details --- .../net/taler/wallet/peer/OutgoingPushFragment.kt | 4 +- .../taler/wallet/peer/TransactionPeerPullCredit.kt | 38 ++++++------ .../taler/wallet/peer/TransactionPeerPushDebit.kt | 71 +++++++++++++++++----- 3 files changed, 77 insertions(+), 36 deletions(-) diff --git a/wallet/src/main/java/net/taler/wallet/peer/OutgoingPushFragment.kt b/wallet/src/main/java/net/taler/wallet/peer/OutgoingPushFragment.kt index e861496..97dbcc2 100644 --- a/wallet/src/main/java/net/taler/wallet/peer/OutgoingPushFragment.kt +++ b/wallet/src/main/java/net/taler/wallet/peer/OutgoingPushFragment.kt @@ -66,7 +66,6 @@ class OutgoingPushFragment : Fragment() { setContent { TalerSurface { val state = peerManager.pushState.collectAsStateLifecycleAware().value - backPressedCallback.isEnabled = false OutgoingPushComposable( amount = amount, state = state, @@ -96,6 +95,9 @@ class OutgoingPushFragment : Fragment() { if (it is OutgoingError && model.devMode.value == true) { showError(it.info) } + + // Disable back navigation when tx is being created + backPressedCallback.isEnabled = it !is OutgoingCreating } } } diff --git a/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPullCredit.kt b/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPullCredit.kt index b04a756..de377fc 100644 --- a/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPullCredit.kt +++ b/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPullCredit.kt @@ -17,21 +17,15 @@ package net.taler.wallet.peer import androidx.compose.foundation.layout.ColumnScope -import androidx.compose.foundation.layout.padding -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface -import androidx.compose.material3.Text import androidx.compose.runtime.Composable -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 net.taler.common.Amount import net.taler.common.Timestamp import net.taler.wallet.R import net.taler.wallet.backend.TalerErrorCode.EXCHANGE_GENERIC_KYC_REQUIRED import net.taler.wallet.backend.TalerErrorInfo -import net.taler.wallet.compose.QrCodeUriComposable import net.taler.wallet.transactions.AmountType import net.taler.wallet.transactions.PeerInfoShort import net.taler.wallet.transactions.TransactionAction.Abort @@ -40,6 +34,7 @@ import net.taler.wallet.transactions.TransactionAction.Suspend import net.taler.wallet.transactions.TransactionAmountComposable import net.taler.wallet.transactions.TransactionInfoComposable import net.taler.wallet.transactions.TransactionMajorState.Pending +import net.taler.wallet.transactions.TransactionMinorState.CreatePurse import net.taler.wallet.transactions.TransactionMinorState.Ready import net.taler.wallet.transactions.TransactionPeerComposable import net.taler.wallet.transactions.TransactionPeerPullCredit @@ -47,16 +42,23 @@ import net.taler.wallet.transactions.TransactionState @Composable fun ColumnScope.TransactionPeerPullCreditComposable(t: TransactionPeerPullCredit) { + if (t.error == null) PeerQrCode( + state = t.txState, + talerUri = t.talerUri, + ) + TransactionAmountComposable( label = stringResource(id = R.string.receive_amount), amount = t.amountEffective, amountType = AmountType.Positive, ) + TransactionAmountComposable( label = stringResource(id = R.string.amount_chosen), amount = t.amountRaw, amountType = AmountType.Neutral, ) + val fee = t.amountRaw - t.amountEffective if (!fee.isZero()) { TransactionAmountComposable( @@ -65,32 +67,20 @@ fun ColumnScope.TransactionPeerPullCreditComposable(t: TransactionPeerPullCredit amountType = AmountType.Negative, ) } + TransactionInfoComposable( label = stringResource(id = R.string.send_peer_purpose), info = t.info.summary ?: "", ) - if (t.txState == TransactionState(Pending, Ready)) { - QrCodeUriComposable( - talerUri = t.talerUri, - clipBoardLabel = "Invoice", - buttonText = stringResource(id = R.string.copy), - ) { - Text( - modifier = Modifier.padding(horizontal = 16.dp), - style = MaterialTheme.typography.bodyLarge, - text = stringResource(id = R.string.receive_peer_invoice_uri), - ) - } - } } @Preview @Composable -fun TransactionPeerPullCreditPreview() { +fun TransactionPeerPullCreditPreview(loading: Boolean = false) { val t = TransactionPeerPullCredit( transactionId = "transactionId", timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000), - txState = TransactionState(Pending), + txState = TransactionState(Pending, if (loading) CreatePurse else Ready), txActions = listOf(Retry, Suspend, Abort), exchangeBaseUrl = "https://exchange.example.org/", amountRaw = Amount.fromString("TESTKUDOS", "42.23"), @@ -106,3 +96,9 @@ fun TransactionPeerPullCreditPreview() { TransactionPeerComposable(t, true) {} } } + +@Preview +@Composable +fun TransactionPeerPullCreditLoadingPreview() { + TransactionPeerPullCreditPreview(loading = true) +} \ No newline at end of file diff --git a/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPushDebit.kt b/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPushDebit.kt index 4c79e5b..d83d8fe 100644 --- a/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPushDebit.kt +++ b/wallet/src/main/java/net/taler/wallet/peer/TransactionPeerPushDebit.kt @@ -18,12 +18,15 @@ package net.taler.wallet.peer import androidx.compose.foundation.layout.ColumnScope import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.material3.CircularProgressIndicator import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment.Companion.CenterHorizontally import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import net.taler.common.Amount @@ -32,6 +35,8 @@ import net.taler.wallet.R import net.taler.wallet.backend.TalerErrorCode.EXCHANGE_GENERIC_KYC_REQUIRED import net.taler.wallet.backend.TalerErrorInfo import net.taler.wallet.compose.QrCodeUriComposable +import net.taler.wallet.compose.TalerSurface +import net.taler.wallet.compose.getQrCodeSize import net.taler.wallet.transactions.AmountType import net.taler.wallet.transactions.PeerInfoShort import net.taler.wallet.transactions.TransactionAction.Abort @@ -40,6 +45,7 @@ import net.taler.wallet.transactions.TransactionAction.Suspend import net.taler.wallet.transactions.TransactionAmountComposable import net.taler.wallet.transactions.TransactionInfoComposable import net.taler.wallet.transactions.TransactionMajorState.Pending +import net.taler.wallet.transactions.TransactionMinorState.CreatePurse import net.taler.wallet.transactions.TransactionMinorState.Ready import net.taler.wallet.transactions.TransactionPeerComposable import net.taler.wallet.transactions.TransactionPeerPushDebit @@ -47,16 +53,23 @@ import net.taler.wallet.transactions.TransactionState @Composable fun ColumnScope.TransactionPeerPushDebitComposable(t: TransactionPeerPushDebit) { + if (t.error == null) PeerQrCode( + state = t.txState, + talerUri = t.talerUri, + ) + TransactionAmountComposable( label = stringResource(id = R.string.transaction_paid), amount = t.amountEffective, amountType = AmountType.Negative, ) + TransactionAmountComposable( label = stringResource(id = R.string.transaction_order_total), amount = t.amountRaw, amountType = AmountType.Neutral, ) + val fee = t.amountEffective - t.amountRaw if (!fee.isZero()) { TransactionAmountComposable( @@ -65,32 +78,55 @@ fun ColumnScope.TransactionPeerPushDebitComposable(t: TransactionPeerPushDebit) amountType = AmountType.Negative, ) } + TransactionInfoComposable( label = stringResource(id = R.string.send_peer_purpose), info = t.info.summary ?: "", ) - if (t.txState == TransactionState(Pending, Ready) && t.talerUri != null) { - QrCodeUriComposable( - talerUri = t.talerUri, - clipBoardLabel = "Push payment", - buttonText = stringResource(id = R.string.copy), - ) { - Text( - modifier = Modifier.padding(horizontal = 16.dp), - style = MaterialTheme.typography.bodyLarge, - text = stringResource(id = R.string.receive_peer_invoice_uri), +} + +@Composable +fun ColumnScope.PeerQrCode(state: TransactionState, talerUri: String?) { + if (state == TransactionState(Pending)) { + Text( + modifier = Modifier.padding(top = 16.dp, start = 16.dp, end = 16.dp), + style = MaterialTheme.typography.titleLarge, + text = stringResource(id = R.string.send_peer_payment_instruction), + textAlign = TextAlign.Center, + ) + + if (state.minor == Ready && talerUri != null) { + QrCodeUriComposable( + talerUri = talerUri, + clipBoardLabel = "Push payment", + buttonText = stringResource(id = R.string.copy), + ) { + Text( + modifier = Modifier.padding(horizontal = 16.dp), + style = MaterialTheme.typography.bodyLarge, + text = stringResource(id = R.string.receive_peer_invoice_uri), + ) + } + } else { + val qrCodeSize = getQrCodeSize() + CircularProgressIndicator( + modifier = Modifier + .padding(32.dp) + .size(qrCodeSize) + .align(CenterHorizontally), ) } } + } @Preview @Composable -fun TransactionPeerPushDebitPreview() { +fun TransactionPeerPushDebitPreview(loading: Boolean = false) { val t = TransactionPeerPushDebit( transactionId = "transactionId", timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000), - txState = TransactionState(Pending), + txState = TransactionState(Pending, if (loading) CreatePurse else Ready), txActions = listOf(Retry, Suspend, Abort), exchangeBaseUrl = "https://exchange.example.org/", amountRaw = Amount.fromString("TESTKUDOS", "42.1337"), @@ -102,7 +138,14 @@ fun TransactionPeerPushDebitPreview() { talerUri = "https://exchange.example.org/peer/pull/credit", error = TalerErrorInfo(code = EXCHANGE_GENERIC_KYC_REQUIRED), ) - Surface { + + TalerSurface { TransactionPeerComposable(t, true) {} } } + +@Preview +@Composable +fun TransactionPeerPushDebitLoadingPreview() { + TransactionPeerPushDebitPreview(loading = true) +} \ No newline at end of file -- cgit v1.2.3