From 5a9174fda280a87cef83d16a3430aae9e388bc0b Mon Sep 17 00:00:00 2001 From: Iván Ávalos Date: Tue, 11 Apr 2023 13:40:25 -0600 Subject: [wallet] Migrated payment and refund detail to Compose --- .../wallet/payment/TransactionPaymentComposable.kt | 196 +++++++++++++++++++++ .../transactions/TransactionPaymentFragment.kt | 52 ++---- .../wallet/transactions/TransactionPeerFragment.kt | 38 ++++ .../transactions/TransactionRefundFragment.kt | 57 ++---- 4 files changed, 268 insertions(+), 75 deletions(-) create mode 100644 wallet/src/main/java/net/taler/wallet/payment/TransactionPaymentComposable.kt (limited to 'wallet/src/main/java/net/taler/wallet') diff --git a/wallet/src/main/java/net/taler/wallet/payment/TransactionPaymentComposable.kt b/wallet/src/main/java/net/taler/wallet/payment/TransactionPaymentComposable.kt new file mode 100644 index 0000000..d2a88f6 --- /dev/null +++ b/wallet/src/main/java/net/taler/wallet/payment/TransactionPaymentComposable.kt @@ -0,0 +1,196 @@ +/* + * This file is part of GNU Taler + * (C) 2023 Taler Systems S.A. + * + * GNU Taler is free software; you can redistribute it and/or modify it under the + * terms of the GNU General Public License as published by the Free Software + * Foundation; either version 3, or (at your option) any later version. + * + * GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + * A PARTICULAR PURPOSE. See the GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License along with + * GNU Taler; see the file COPYING. If not, see + */ + +package net.taler.wallet.payment + +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.platform.LocalContext +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.ContractMerchant +import net.taler.common.Timestamp +import net.taler.common.toAbsoluteTime +import net.taler.wallet.R +import net.taler.wallet.backend.TalerErrorCode +import net.taler.wallet.backend.TalerErrorInfo +import net.taler.wallet.compose.TalerSurface +import net.taler.wallet.transactions.AmountType +import net.taler.wallet.transactions.DeleteTransactionComposable +import net.taler.wallet.transactions.ErrorTransactionButton +import net.taler.wallet.transactions.ExtendedStatus +import net.taler.wallet.transactions.PaymentStatus +import net.taler.wallet.transactions.Transaction +import net.taler.wallet.transactions.TransactionAmountComposable +import net.taler.wallet.transactions.TransactionInfo +import net.taler.wallet.transactions.TransactionInfoComposable +import net.taler.wallet.transactions.TransactionLinkComposable +import net.taler.wallet.transactions.TransactionPayment +import net.taler.wallet.transactions.TransactionRefund + +@Composable +fun TransactionPaymentComposable( + t: Transaction, + devMode: Boolean?, + onFulfill: (url: String) -> Unit, + onDelete: () -> Unit, +) { + val scrollState = rememberScrollState() + Column( + modifier = Modifier + .fillMaxWidth() + .verticalScroll(scrollState), + horizontalAlignment = Alignment.CenterHorizontally, + ) { + val context = LocalContext.current + Text( + modifier = Modifier.padding(16.dp), + text = t.timestamp.ms.toAbsoluteTime(context).toString(), + style = MaterialTheme.typography.bodyLarge, + ) + TransactionAmountComposable( + label = stringResource(id = when (t) { + is TransactionPayment -> R.string.transaction_paid + else -> R.string.transaction_refund + }), + amount = t.amountEffective, + amountType = when (t) { + is TransactionPayment -> AmountType.Negative + else -> AmountType.Positive + }, + ) + TransactionAmountComposable( + label = stringResource(id = R.string.transaction_order_total), + amount = t.amountRaw, + amountType = AmountType.Neutral, + ) + TransactionAmountComposable( + label = stringResource(id = R.string.withdraw_fees), + amount = when (t) { + is TransactionPayment -> t.amountEffective - t.amountRaw + else -> t.amountRaw - t.amountEffective + }, + amountType = AmountType.Negative, + ) + when (t) { + is TransactionPayment -> t.info + is TransactionRefund -> t.info + else -> null + }?.let { info -> + PurchaseDetails(info = info) { + onFulfill(info.fulfillmentUrl!!) + } + } + DeleteTransactionComposable(onDelete) + if (devMode == true && t.error != null) { + ErrorTransactionButton(error = t.error!!) + } + } +} + +@Composable +fun PurchaseDetails( + info: TransactionInfo, + onClick: () -> Unit, +) { + Column( + horizontalAlignment = Alignment.CenterHorizontally, + ) { + // Summary and fulfillment message + val text = if (info.fulfillmentMessage == null) { + info.summary + } else { + "${info.summary}\n\n${info.fulfillmentMessage}" + } + if (info.fulfillmentUrl != null) { + TransactionLinkComposable( + label = stringResource(id = R.string.transaction_order), + info = text, + ) { onClick() } + } else { + TransactionInfoComposable( + label = stringResource(id = R.string.transaction_order), + info = text, + ) + } + + // Order ID + Text( + stringResource(id = R.string.transaction_order_id, info.orderId), + style = MaterialTheme.typography.bodyMedium, + ) + } +} + +@Preview +@Composable +fun TransactionPaymentComposablePreview() { + val t = TransactionPayment( + transactionId = "transactionId", + timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000), + extendedStatus = ExtendedStatus.Pending, + info = TransactionInfo( + orderId = "123", + merchant = ContractMerchant(name = "Taler"), + summary = "Some Product that was bought and can have quite a long label", + fulfillmentMessage = "This is some fulfillment message", + fulfillmentUrl = "https://bank.demo.taler.net/", + products = listOf(), + ), + status = PaymentStatus.Paid, + amountRaw = Amount.fromDouble("TESTKUDOS", 42.1337), + amountEffective = Amount.fromDouble("TESTKUDOS", 42.23), + error = TalerErrorInfo(code = TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED), + ) + TalerSurface { + TransactionPaymentComposable(t = t, devMode = true, onFulfill = {}) {} + } +} + +@Preview +@Composable +fun TransactionRefundComposablePreview() { + val t = TransactionRefund( + transactionId = "transactionId", + timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000), + extendedStatus = ExtendedStatus.Pending, + info = TransactionInfo( + orderId = "123", + merchant = ContractMerchant(name = "Taler"), + summary = "Some Product that was bought and can have quite a long label", + fulfillmentMessage = "This is some fulfillment message", + fulfillmentUrl = "https://bank.demo.taler.net/", + products = listOf(), + ), + refundedTransactionId = "transactionId", + amountRaw = Amount.fromDouble("TESTKUDOS", 42.23), + amountEffective = Amount.fromDouble("TESTKUDOS", 42.1337), + error = TalerErrorInfo(code = TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED), + ) + TalerSurface { + TransactionPaymentComposable(t = t, devMode = true, onFulfill = {}) {} + } +} \ No newline at end of file diff --git a/wallet/src/main/java/net/taler/wallet/transactions/TransactionPaymentFragment.kt b/wallet/src/main/java/net/taler/wallet/transactions/TransactionPaymentFragment.kt index 068a41e..ac35fe0 100644 --- a/wallet/src/main/java/net/taler/wallet/transactions/TransactionPaymentFragment.kt +++ b/wallet/src/main/java/net/taler/wallet/transactions/TransactionPaymentFragment.kt @@ -19,50 +19,32 @@ package net.taler.wallet.transactions import android.os.Bundle import android.view.LayoutInflater import android.view.View -import android.view.View.VISIBLE import android.view.ViewGroup -import net.taler.common.toAbsoluteTime -import net.taler.wallet.databinding.FragmentTransactionPaymentBinding +import androidx.compose.runtime.livedata.observeAsState +import androidx.compose.ui.platform.ComposeView +import net.taler.wallet.compose.TalerSurface +import net.taler.wallet.launchInAppBrowser +import net.taler.wallet.payment.TransactionPaymentComposable class TransactionPaymentFragment : TransactionDetailFragment() { - private lateinit var ui: FragmentTransactionPaymentBinding - override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?, - ): View { - ui = FragmentTransactionPaymentBinding.inflate(inflater, container, false) - return ui.root - } - - override fun onViewCreated(view: View, savedInstanceState: Bundle?) { - transactionManager.selectedTransaction.observe(viewLifecycleOwner) { t -> - if (t !is TransactionPayment) return@observe - ui.timeView.text = t.timestamp.ms.toAbsoluteTime(requireContext()) - - ui.amountPaidWithFeesView.text = t.amountEffective.toString() - val fee = t.amountEffective - t.amountRaw - bindOrderAndFee( - ui.orderSummaryView, - ui.orderAmountView, - ui.orderIdView, - ui.feeView, - t.info, - t.amountRaw, - fee - ) - ui.deleteButton.setOnClickListener { - onDeleteButtonClicked(t) - } - if (devMode.value == true && t.error != null) { - ui.showErrorButton.visibility = VISIBLE - ui.showErrorButton.setOnClickListener { - onShowErrorButtonClicked(t) - } + ): View = ComposeView(requireContext()).apply { + setContent { + TalerSurface { + val t = transactionManager.selectedTransaction.observeAsState().value + if (t is TransactionPayment) TransactionPaymentComposable(t, devMode.value, + onFulfill = { url -> + launchInAppBrowser(requireContext(), url) + }, + onDelete = { + onDeleteButtonClicked(t) + } + ) } } } - } diff --git a/wallet/src/main/java/net/taler/wallet/transactions/TransactionPeerFragment.kt b/wallet/src/main/java/net/taler/wallet/transactions/TransactionPeerFragment.kt index 297c937..170c719 100644 --- a/wallet/src/main/java/net/taler/wallet/transactions/TransactionPeerFragment.kt +++ b/wallet/src/main/java/net/taler/wallet/transactions/TransactionPeerFragment.kt @@ -24,6 +24,7 @@ import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.text.ClickableText import androidx.compose.foundation.verticalScroll import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text @@ -35,12 +36,18 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.platform.ComposeView import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.colorResource +import androidx.compose.ui.text.SpanStyle +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.buildAnnotatedString +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.text.withStyle import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import net.taler.common.Amount import net.taler.common.toAbsoluteTime import net.taler.wallet.R import net.taler.wallet.compose.TalerSurface +import net.taler.wallet.getAttrColor import net.taler.wallet.peer.TransactionPeerPullCreditComposable import net.taler.wallet.peer.TransactionPeerPullDebitComposable import net.taler.wallet.peer.TransactionPeerPushCreditComposable @@ -125,3 +132,34 @@ fun TransactionInfoComposable(label: String, info: String) { fontSize = 24.sp, ) } + +@Composable +fun TransactionLinkComposable(label: String, info: String, onClick: () -> Unit) { + Text( + modifier = Modifier.padding(top = 16.dp, start = 16.dp, end = 16.dp), + text = label, + style = MaterialTheme.typography.bodyMedium, + ) + val context = LocalContext.current + val linkColor = Color(context.getAttrColor(android.R.attr.textColorLink)) + val annotatedString = buildAnnotatedString { + pushStringAnnotation(tag = "url", annotation = info) + withStyle(style = SpanStyle(color = linkColor)) { + append(info) + } + pop() + } + ClickableText( + modifier = Modifier.padding(top = 8.dp, start = 16.dp, end = 16.dp, bottom = 16.dp), + text = annotatedString, + style = TextStyle(fontSize = 24.sp, textAlign = TextAlign.Center), + ) { offset -> + annotatedString.getStringAnnotations( + tag = "url", + start = offset, + end = offset, + ).firstOrNull()?.let { + onClick() + } + } +} \ No newline at end of file diff --git a/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefundFragment.kt b/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefundFragment.kt index 9c30609..b4a3be8 100644 --- a/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefundFragment.kt +++ b/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefundFragment.kt @@ -19,55 +19,32 @@ package net.taler.wallet.transactions import android.os.Bundle import android.view.LayoutInflater import android.view.View -import android.view.View.VISIBLE import android.view.ViewGroup -import androidx.core.content.ContextCompat.getColor -import net.taler.common.toAbsoluteTime -import net.taler.wallet.R -import net.taler.wallet.databinding.FragmentTransactionPaymentBinding +import androidx.compose.runtime.livedata.observeAsState +import androidx.compose.ui.platform.ComposeView +import net.taler.wallet.compose.TalerSurface +import net.taler.wallet.launchInAppBrowser +import net.taler.wallet.payment.TransactionPaymentComposable class TransactionRefundFragment : TransactionDetailFragment() { - private lateinit var ui: FragmentTransactionPaymentBinding - override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?, - ): View { - ui = FragmentTransactionPaymentBinding.inflate(inflater, container, false) - return ui.root - } - - override fun onViewCreated(view: View, savedInstanceState: Bundle?) { - transactionManager.selectedTransaction.observe(viewLifecycleOwner) { t -> - if (t !is TransactionRefund) return@observe - ui.timeView.text = t.timestamp.ms.toAbsoluteTime(requireContext()) - - ui.amountPaidWithFeesLabel.text = getString(R.string.transaction_refund) - ui.amountPaidWithFeesView.setTextColor(getColor(requireContext(), R.color.green)) - ui.amountPaidWithFeesView.text = - getString(R.string.amount_positive, t.amountEffective.toString()) - val fee = t.amountRaw - t.amountEffective - bindOrderAndFee( - ui.orderSummaryView, - ui.orderAmountView, - ui.orderIdView, - ui.feeView, - t.info, - t.amountRaw, - fee - ) - ui.deleteButton.setOnClickListener { - onDeleteButtonClicked(t) - } - if (devMode.value == true && t.error != null) { - ui.showErrorButton.visibility = VISIBLE - ui.showErrorButton.setOnClickListener { - onShowErrorButtonClicked(t) - } + ): View = ComposeView(requireContext()).apply { + setContent { + TalerSurface { + val t = transactionManager.selectedTransaction.observeAsState().value + if (t is TransactionRefund) TransactionPaymentComposable(t, devMode.value, + onFulfill = { url -> + launchInAppBrowser(requireContext(), url) + }, + onDelete = { + onDeleteButtonClicked(t) + } + ) } } } - } -- cgit v1.2.3