[wallet] Migrated withdrawal and refresh detail to Compose

6 files changed, 348 insertions, 300 deletions

diff --git a/wallet/src/main/java/net/taler/wallet/transactions/ActionButtonComposable.kt b/wallet/src/main/java/net/taler/wallet/transactions/ActionButtonComposable.kt
new file mode 100644
index 0000000..2e2b4ac
--- /dev/null
+++ b/wallet/src/main/java/net/taler/wallet/transactions/ActionButtonComposable.kt
@@ -0,0 +1,136 @@
+/*
+ * 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 <http://www.gnu.org/licenses/>
+ */
+
+package net.taler.wallet.transactions
+
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.defaultMinSize
+import androidx.compose.foundation.layout.size
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.AccountBalance
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Icon
+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.unit.dp
+import net.taler.wallet.R
+import net.taler.wallet.backend.TalerErrorCode
+import net.taler.wallet.transactions.WithdrawalDetails.TalerBankIntegrationApi
+import net.taler.wallet.transactions.WithdrawalDetails.ManualTransfer
+
+interface ActionListener {
+    enum class Type {
+        COMPLETE_KYC,
+        CONFIRM_WITH_BANK,
+        CONFIRM_MANUAL
+    }
+
+    fun onActionButtonClicked(tx: Transaction, type: Type)
+}
+
+@Composable
+fun ActionButton(
+    modifier: Modifier = Modifier,
+    tx: Transaction,
+    listener: ActionListener,
+    isSmall: Boolean = false,
+) {
+    if (tx.error != null) {
+        // There is an error!
+        when (tx.error!!.code) {
+            TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED -> {
+                KycButton(modifier, tx, listener, isSmall)
+            }
+            else -> {}
+        }
+    } else if (tx is TransactionWithdrawal && !tx.confirmed) {
+        // There is a transaction!
+        if (tx.withdrawalDetails is TalerBankIntegrationApi &&
+            tx.withdrawalDetails.bankConfirmationUrl != null
+        ) {
+            // The transaction can be completed with a link!
+            ConfirmBankButton(modifier, tx, listener, isSmall)
+        } else if (tx.withdrawalDetails is ManualTransfer) {
+            // The transaction must be completed manually!
+            ConfirmManualButton(modifier, tx, listener, isSmall)
+        }
+    }
+}
+
+@Composable
+private fun KycButton(
+    modifier: Modifier = Modifier,
+    tx: Transaction,
+    listener: ActionListener,
+    isSmall: Boolean = false,
+) {
+    val minSize = if (isSmall) 1.dp else 0.dp
+    Button(
+        onClick = { listener.onActionButtonClicked(tx, ActionListener.Type.COMPLETE_KYC) },
+        modifier = modifier.defaultMinSize(minSize, minSize),
+    ) {
+        Text(stringResource(R.string.transaction_action_kyc))
+    }
+}
+
+@Composable
+private fun ConfirmBankButton(
+    modifier: Modifier = Modifier,
+    tx: TransactionWithdrawal,
+    listener: ActionListener,
+    isSmall: Boolean = false,
+) {
+    val minSize = if (isSmall) 1.dp else 0.dp
+    Button(
+        onClick = { listener.onActionButtonClicked(tx, ActionListener.Type.CONFIRM_WITH_BANK) },
+        modifier = modifier.defaultMinSize(minSize, minSize),
+    ) {
+        val label = stringResource(R.string.withdraw_button_confirm_bank)
+        Icon(
+            Icons.Default.AccountBalance,
+            label,
+            modifier = Modifier.size(ButtonDefaults.IconSize)
+        )
+        Spacer(Modifier.size(ButtonDefaults.IconSpacing))
+        Text(label)
+    }
+}
+
+@Composable
+private fun ConfirmManualButton(
+    modifier: Modifier = Modifier,
+    tx: TransactionWithdrawal,
+    listener: ActionListener,
+    isSmall: Boolean = false,
+) {
+    val minSize = if (isSmall) 1.dp else 0.dp
+    Button(
+        onClick = { listener.onActionButtonClicked(tx, ActionListener.Type.CONFIRM_MANUAL) },
+        modifier = modifier.defaultMinSize(minSize, minSize),
+    ) {
+        val label = stringResource(R.string.withdraw_manual_ready_details_intro)
+        Icon(
+            Icons.Default.AccountBalance,
+            label,
+            modifier = Modifier.size(ButtonDefaults.IconSize)
+        )
+        Spacer(Modifier.size(ButtonDefaults.IconSpacing))
+        Text(label)
+    }
+}
diff --git a/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefreshFragment.kt b/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefreshFragment.kt
index 36d3bc7..7bd4999 100644
--- a/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefreshFragment.kt
+++ b/wallet/src/main/java/net/taler/wallet/transactions/TransactionRefreshFragment.kt
@@ -19,50 +19,31 @@ package net.taler.wallet.transactions
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
-import android.view.View.GONE
-import android.view.View.VISIBLE
 import android.view.ViewGroup
-import net.taler.common.toAbsoluteTime
-import net.taler.wallet.R
-import net.taler.wallet.cleanExchange
-import net.taler.wallet.databinding.FragmentTransactionWithdrawalBinding
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.platform.ComposeView
+import net.taler.wallet.compose.TalerSurface
+import net.taler.wallet.withdraw.TransactionWithdrawalComposable
 
 class TransactionRefreshFragment : TransactionDetailFragment() {
 
-    private lateinit var ui: FragmentTransactionWithdrawalBinding
-
     override fun onCreateView(
         inflater: LayoutInflater,
         container: ViewGroup?,
         savedInstanceState: Bundle?,
-    ): View {
-        ui = FragmentTransactionWithdrawalBinding.inflate(inflater, container, false)
-        return ui.root
-    }
-
-    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
-        transactionManager.selectedTransaction.observe(viewLifecycleOwner) { t ->
-            if (t !is TransactionRefresh) return@observe
-            ui.timeView.text = t.timestamp.ms.toAbsoluteTime(requireContext())
-
-            ui.effectiveAmountLabel.visibility = GONE
-            ui.effectiveAmountView.visibility = GONE
-            ui.confirmWithdrawalButton.visibility = GONE
-            ui.chosenAmountLabel.visibility = GONE
-            ui.chosenAmountView.visibility = GONE
-            val fee = t.amountEffective
-            ui.feeView.text = getString(R.string.amount_negative, fee.toString())
-            ui.exchangeView.text = cleanExchange(t.exchangeBaseUrl)
-            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 TransactionRefresh) {
+                    TransactionWithdrawalComposable(t, devMode.value, null) {
+                        onDeleteButtonClicked(t)
+                    }
                 }
             }
         }
     }
 
+
+
 }
diff --git a/wallet/src/main/java/net/taler/wallet/transactions/TransactionWithdrawalFragment.kt b/wallet/src/main/java/net/taler/wallet/transactions/TransactionWithdrawalFragment.kt
index ad70d2f..3a5b0d0 100644
--- a/wallet/src/main/java/net/taler/wallet/transactions/TransactionWithdrawalFragment.kt
+++ b/wallet/src/main/java/net/taler/wallet/transactions/TransactionWithdrawalFragment.kt
@@ -19,115 +19,72 @@ package net.taler.wallet.transactions
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
-import android.view.View.GONE
-import android.view.View.VISIBLE
 import android.view.ViewGroup
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.platform.ComposeView
 import androidx.fragment.app.activityViewModels
 import androidx.navigation.fragment.findNavController
-import net.taler.common.toAbsoluteTime
 import net.taler.wallet.MainViewModel
 import net.taler.wallet.R
-import net.taler.wallet.cleanExchange
-import net.taler.wallet.databinding.FragmentTransactionWithdrawalBinding
-import net.taler.wallet.handleKyc
+import net.taler.wallet.compose.TalerSurface
 import net.taler.wallet.launchInAppBrowser
-import net.taler.wallet.transactions.ExtendedStatus.Pending
 import net.taler.wallet.transactions.WithdrawalDetails.ManualTransfer
 import net.taler.wallet.transactions.WithdrawalDetails.TalerBankIntegrationApi
+import net.taler.wallet.withdraw.TransactionWithdrawalComposable
 import net.taler.wallet.withdraw.createManualTransferRequired
 
-class TransactionWithdrawalFragment : TransactionDetailFragment() {
+class TransactionWithdrawalFragment : TransactionDetailFragment(), ActionListener {
 
     private val model: MainViewModel by activityViewModels()
     private val withdrawManager by lazy { model.withdrawManager }
-    private lateinit var ui: FragmentTransactionWithdrawalBinding
 
     override fun onCreateView(
         inflater: LayoutInflater,
         container: ViewGroup?,
         savedInstanceState: Bundle?,
-    ): View {
-        ui = FragmentTransactionWithdrawalBinding.inflate(inflater, container, false)
-        return ui.root
-    }
-
-    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
-        transactionManager.selectedTransaction.observe(viewLifecycleOwner) { t ->
-            if (t !is TransactionWithdrawal) return@observe
-            ui.timeView.text = t.timestamp.ms.toAbsoluteTime(requireContext())
-
-            ui.effectiveAmountLabel.text = getString(R.string.withdraw_total)
-            ui.effectiveAmountView.text = t.amountEffective.toString()
-            setupConfirmWithdrawalButton(t)
-            setupActionButton(t)
-            ui.chosenAmountLabel.text = getString(R.string.amount_chosen)
-            ui.chosenAmountView.text =
-                getString(R.string.amount_positive, t.amountRaw.toString())
-            val fee = t.amountRaw - t.amountEffective
-            ui.feeView.text = getString(R.string.amount_negative, fee.toString())
-            ui.exchangeView.text = cleanExchange(t.exchangeBaseUrl)
-            if (t.extendedStatus == Pending) {
-                ui.deleteButton.setIconResource(R.drawable.ic_cancel)
-                ui.deleteButton.setText(R.string.cancel)
-            }
-            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 TransactionWithdrawal) {
+                    TransactionWithdrawalComposable(t, devMode.value, this@TransactionWithdrawalFragment) {
+                        onDeleteButtonClicked(t)
+                    }
                 }
             }
         }
     }
 
-    private val isPending get() = transactionManager.selectedTransaction.value?.extendedStatus == Pending
-
-    override val deleteDialogTitle: Int
-        get() = if (isPending) R.string.cancel else super.deleteDialogTitle
-    override val deleteDialogMessage: Int
-        get() = if (isPending) R.string.transactions_cancel_dialog_message
-        else super.deleteDialogMessage
-    override val deleteDialogButton: Int
-        get() = if (isPending) R.string.ok else super.deleteDialogButton
-
-    private fun setupConfirmWithdrawalButton(t: TransactionWithdrawal) {
-        if (t.extendedStatus == Pending && !t.confirmed) {
-            if (t.withdrawalDetails is TalerBankIntegrationApi &&
-                t.withdrawalDetails.bankConfirmationUrl != null
-            ) {
-                ui.confirmWithdrawalButton.setOnClickListener {
-                    launchInAppBrowser(requireContext(), t.withdrawalDetails.bankConfirmationUrl)
-                }
-            } else if (t.withdrawalDetails is ManualTransfer) {
-                ui.confirmWithdrawalButton.setText(R.string.withdraw_manual_ready_details_intro)
-                ui.confirmWithdrawalButton.setOnClickListener {
-                    val status = createManualTransferRequired(
-                        amount = t.amountRaw,
-                        exchangeBaseUrl = t.exchangeBaseUrl,
-                        // TODO what if there's more than one or no URI?
-                        uriStr = t.withdrawalDetails.exchangePaytoUris[0],
-                        transactionId = t.transactionId,
-                    )
-                    withdrawManager.viewManualWithdrawal(status)
-                    findNavController().navigate(
-                        R.id.action_nav_transactions_detail_withdrawal_to_nav_exchange_manual_withdrawal_success
-                    )
-                }
-            } else ui.confirmWithdrawalButton.visibility = GONE
-        } else ui.confirmWithdrawalButton.visibility = GONE
-    }
-
-    private fun setupActionButton(t: TransactionWithdrawal) {
-        ui.actionButton.visibility = t.handleKyc({ GONE }) { error ->
-            ui.actionButton.setText(R.string.transaction_action_kyc)
-            error.getStringExtra("kycUrl")?.let { kycUrl ->
-                ui.actionButton.setOnClickListener {
+    override fun onActionButtonClicked(tx: Transaction, type: ActionListener.Type) {
+        when(type) {
+            ActionListener.Type.COMPLETE_KYC -> {
+                tx.error?.getStringExtra("kycUrl")?.let { kycUrl ->
                     launchInAppBrowser(requireContext(), kycUrl)
                 }
             }
-            VISIBLE
+            ActionListener.Type.CONFIRM_WITH_BANK -> {
+                if (tx !is TransactionWithdrawal) return
+                if (tx.withdrawalDetails !is TalerBankIntegrationApi) return
+                tx.withdrawalDetails.bankConfirmationUrl?.let { url ->
+                    launchInAppBrowser(requireContext(), url)
+                }
+            }
+            ActionListener.Type.CONFIRM_MANUAL -> {
+                if (tx !is TransactionWithdrawal) return
+                if (tx.withdrawalDetails !is ManualTransfer) return
+                // TODO what if there's more than one or no URI?
+                if (tx.withdrawalDetails.exchangePaytoUris.isEmpty()) return
+                val status = createManualTransferRequired(
+                    amount = tx.amountRaw,
+                    exchangeBaseUrl = tx.exchangeBaseUrl,
+                    uriStr = tx.withdrawalDetails.exchangePaytoUris[0],
+                    transactionId = tx.transactionId,
+                )
+                withdrawManager.viewManualWithdrawal(status)
+                findNavController().navigate(
+                    R.id.action_nav_transactions_detail_withdrawal_to_nav_exchange_manual_withdrawal_success,
+                )
+            }
         }
     }
 }
diff --git a/wallet/src/main/java/net/taler/wallet/withdraw/TransactionWithdrawalComposable.kt b/wallet/src/main/java/net/taler/wallet/withdraw/TransactionWithdrawalComposable.kt
new file mode 100644
index 0000000..9265b6a
--- /dev/null
+++ b/wallet/src/main/java/net/taler/wallet/withdraw/TransactionWithdrawalComposable.kt
@@ -0,0 +1,154 @@
+/*
+ * 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 <http://www.gnu.org/licenses/>
+ */
+
+package net.taler.wallet.withdraw
+
+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.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.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.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.cleanExchange
+import net.taler.wallet.transactions.ActionButton
+import net.taler.wallet.transactions.ActionListener
+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.Transaction
+import net.taler.wallet.transactions.TransactionAmountComposable
+import net.taler.wallet.transactions.TransactionInfoComposable
+import net.taler.wallet.transactions.TransactionRefresh
+import net.taler.wallet.transactions.TransactionWithdrawal
+import net.taler.wallet.transactions.WithdrawalDetails.ManualTransfer
+
+@Composable
+fun TransactionWithdrawalComposable(
+    t: Transaction,
+    devMode: Boolean?,
+    listener: ActionListener?,
+    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,
+        )
+        if (t !is TransactionRefresh) {
+            TransactionAmountComposable(
+                label = stringResource(id = R.string.withdraw_total),
+                amount = t.amountEffective,
+                amountType = AmountType.Positive,
+            )
+        }
+        listener?.let {
+            ActionButton(tx = t, listener = it)
+        }
+        if (t !is TransactionRefresh) {
+            TransactionAmountComposable(
+                label = stringResource(id = R.string.amount_chosen),
+                amount = t.amountRaw,
+                amountType = AmountType.Neutral,
+            )
+        }
+        TransactionAmountComposable(
+            label = stringResource(id = R.string.withdraw_fees),
+            amount = when (t) {
+                is TransactionWithdrawal -> t.amountRaw - t.amountEffective
+                else -> t.amountEffective
+            },
+            amountType = AmountType.Negative,
+        )
+        when (t) {
+            is TransactionWithdrawal -> t.exchangeBaseUrl
+            is TransactionRefresh -> t.exchangeBaseUrl
+            else -> null
+        }?.let { url ->
+            TransactionInfoComposable(
+                label = stringResource(id = R.string.withdraw_exchange),
+                info = cleanExchange(url),
+            )
+        }
+        DeleteTransactionComposable(onDelete)
+        if (devMode == true && t.error != null) {
+            ErrorTransactionButton(error = t.error!!)
+        }
+    }
+}
+
+@Preview
+@Composable
+fun TransactionWithdrawalComposablePreview() {
+    val t = TransactionWithdrawal(
+        transactionId = "transactionId",
+        timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000),
+        extendedStatus = ExtendedStatus.Pending,
+        exchangeBaseUrl = "https://exchange.demo.taler.net/",
+        withdrawalDetails = ManualTransfer(exchangePaytoUris = emptyList()),
+        amountRaw = Amount.fromDouble("TESTKUDOS", 42.23),
+        amountEffective = Amount.fromDouble("TESTKUDOS", 42.1337),
+        error = TalerErrorInfo(code = TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED),
+    )
+    val listener = object : ActionListener {
+        override fun onActionButtonClicked(tx: Transaction, type: ActionListener.Type) {
+            TODO("Not yet implemented")
+        }
+    }
+    Surface {
+        TransactionWithdrawalComposable(t, true, listener) {}
+    }
+}
+
+@Preview
+@Composable
+fun TransactionRefreshComposablePreview() {
+    val t = TransactionRefresh(
+        transactionId = "transactionId",
+        timestamp = Timestamp.fromMillis(System.currentTimeMillis() - 360 * 60 * 1000),
+        extendedStatus = ExtendedStatus.Pending,
+        exchangeBaseUrl = "https://exchange.demo.taler.net/",
+        amountRaw = Amount.fromDouble("TESTKUDOS", 42.23),
+        amountEffective = Amount.fromDouble("TESTKUDOS", 42.1337),
+        error = TalerErrorInfo(code = TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED),
+    )
+    Surface {
+        TransactionWithdrawalComposable(t, true, null) {}
+    }
+}
\ No newline at end of file
diff --git a/wallet/src/main/res/layout/fragment_transaction_withdrawal.xml b/wallet/src/main/res/layout/fragment_transaction_withdrawal.xml
deleted file mode 100644
index 87530a4..0000000
--- a/wallet/src/main/res/layout/fragment_transaction_withdrawal.xml
+++ /dev/null
@@ -1,176 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!--
-  ~ This file is part of GNU Taler
-  ~ (C) 2020 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 <http://www.gnu.org/licenses/>
-  -->
-
-<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="match_parent"
-    android:layout_height="match_parent"
-    android:fillViewport="true"
-    tools:context=".transactions.TransactionDetailFragment">
-
-    <androidx.constraintlayout.widget.ConstraintLayout
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content">
-
-        <TextView
-            android:id="@+id/timeView"
-            style="@style/TransactionLabel.Time"
-            app:layout_constraintBottom_toTopOf="@+id/effectiveAmountLabel"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
-            tools:text="23 March 2020 23:42pm" />
-
-        <TextView
-            android:id="@+id/effectiveAmountLabel"
-            style="@style/TransactionLabel"
-            app:layout_constraintBottom_toTopOf="@+id/effectiveAmountView"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/timeView"
-            tools:text="@string/withdraw_total" />
-
-        <TextView
-            android:id="@+id/effectiveAmountView"
-            style="@style/TransactionContent"
-            android:textColor="@color/green"
-            app:layout_constraintBottom_toTopOf="@+id/confirmWithdrawalButton"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/effectiveAmountLabel"
-            tools:text="23.42 TESTKUDOS" />
-
-        <com.google.android.material.button.MaterialButton
-            android:id="@+id/confirmWithdrawalButton"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            app:icon="@drawable/ic_account_balance"
-            android:text="@string/withdraw_button_confirm_bank"
-            android:textColor="?colorOnPrimary"
-            app:iconTint="?colorOnPrimary"
-            app:drawableTint="?attr/colorOnPrimarySurface"
-            app:layout_constraintBottom_toTopOf="@+id/actionButton"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/effectiveAmountView"
-            tools:ignore="RtlHardcoded" />
-
-        <Button
-            android:id="@+id/actionButton"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginVertical="10dp"
-            android:textColor="?colorOnTertiary"
-            android:backgroundTint="?colorTertiary"
-            android:visibility="gone"
-            app:layout_constraintBottom_toTopOf="@id/chosenAmountLabel"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@id/confirmWithdrawalButton"
-            tools:text="@string/transaction_action_kyc"
-            tools:visibility="visible" />
-
-        <TextView
-            android:id="@+id/chosenAmountLabel"
-            style="@style/TransactionLabel"
-            app:layout_constraintBottom_toTopOf="@+id/chosenAmountView"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/actionButton"
-            tools:text="@string/amount_chosen" />
-
-        <TextView
-            android:id="@+id/chosenAmountView"
-            style="@style/TransactionContent"
-            app:layout_constraintBottom_toTopOf="@+id/feeLabel"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/chosenAmountLabel"
-            tools:text="24 TESTKUDOS" />
-
-        <TextView
-            android:id="@+id/feeLabel"
-            style="@style/TransactionLabel"
-            android:text="@string/withdraw_fees"
-            app:layout_constraintBottom_toTopOf="@+id/feeView"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/chosenAmountView" />
-
-        <TextView
-            android:id="@+id/feeView"
-            style="@style/TransactionContent"
-            android:textColor="?colorError"
-            app:layout_constraintBottom_toTopOf="@+id/exchangeLabel"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/feeLabel"
-            tools:text="-0.38 TESTKUDOS" />
-
-        <TextView
-            android:id="@+id/exchangeLabel"
-            style="@style/TransactionLabel"
-            android:text="@string/withdraw_exchange"
-            app:layout_constraintBottom_toTopOf="@+id/exchangeView"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/feeView" />
-
-        <TextView
-            android:id="@+id/exchangeView"
-            style="@style/TransactionContent"
-            app:layout_constraintBottom_toTopOf="@+id/deleteButton"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/exchangeLabel"
-            tools:text="exchange.demo.taler.net" />
-
-        <com.google.android.material.button.MaterialButton
-            android:id="@+id/deleteButton"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginVertical="10dp"
-            android:text="@string/transactions_delete"
-            app:backgroundTint="?colorError"
-            app:icon="@drawable/ic_delete"
-            android:textColor="?colorOnError"
-            app:iconTint="?colorOnError"
-            app:layout_constraintBottom_toTopOf="@id/showErrorButton"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/exchangeView" />
-
-        <com.google.android.material.button.MaterialButton
-            android:id="@+id/showErrorButton"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_marginVertical="10dp"
-            android:visibility="gone"
-            android:text="@string/nav_error"
-            app:backgroundTint="?colorError"
-            app:icon="@drawable/ic_error"
-            android:textColor="?colorOnError"
-            app:iconTint="?colorOnError"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/deleteButton"
-            tools:visibility="visible" />
-
-    </androidx.constraintlayout.widget.ConstraintLayout>
-
-</ScrollView>
diff --git a/wallet/src/main/res/navigation/nav_graph.xml b/wallet/src/main/res/navigation/nav_graph.xml
index 6508539..b559196 100644
--- a/wallet/src/main/res/navigation/nav_graph.xml
+++ b/wallet/src/main/res/navigation/nav_graph.xml
@@ -227,8 +227,7 @@
     <fragment
         android:id="@+id/nav_transactions_detail_withdrawal"
         android:name="net.taler.wallet.transactions.TransactionWithdrawalFragment"
-        android:label="@string/transactions_detail_title"
-        tools:layout="@layout/fragment_transaction_withdrawal">
+        android:label="@string/transactions_detail_title">
         <action
             android:id="@+id/action_nav_transactions_detail_withdrawal_to_nav_exchange_manual_withdrawal_success"
             app:destination="@id/nav_exchange_manual_withdrawal_success" />
@@ -249,20 +248,17 @@
     <fragment
         android:id="@+id/nav_transactions_detail_refresh"
         android:name="net.taler.wallet.transactions.TransactionRefreshFragment"
-        android:label="@string/transactions_detail_title"
-        tools:layout="@layout/fragment_transaction_withdrawal" />
+        android:label="@string/transactions_detail_title" />
 
     <fragment
         android:id="@+id/nav_transactions_detail_deposit"
         android:name="net.taler.wallet.transactions.TransactionDepositFragment"
-        android:label="@string/transactions_detail_title"
-        tools:layout="@layout/fragment_transaction_withdrawal" />
+        android:label="@string/transactions_detail_title" />
 
     <fragment
         android:id="@+id/nav_transactions_detail_tip"
         android:name="net.taler.wallet.transactions.TransactionTipFragment"
-        android:label="@string/transactions_detail_title"
-        tools:layout="@layout/fragment_transaction_withdrawal" />
+        android:label="@string/transactions_detail_title" />
 
     <fragment
         android:id="@+id/nav_transactions_detail_peer"