summaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2023-05-29 23:47:21 -0300
committerSebastian <sebasjm@gmail.com>2023-05-29 23:47:21 -0300
commitbd7ca80ff6528377afdfcb94f612393853d3f69c (patch)
treea0731e0b9b8a02b0fe7482542bce68093362db50 /packages/taler-wallet-webextension
parentcb720b7a965ff20c5e857f8f84e958eadf50794e (diff)
downloadwallet-core-bd7ca80ff6528377afdfcb94f612393853d3f69c.tar.gz
wallet-core-bd7ca80ff6528377afdfcb94f612393853d3f69c.tar.bz2
wallet-core-bd7ca80ff6528377afdfcb94f612393853d3f69c.zip
show buttons
Diffstat (limited to 'packages/taler-wallet-webextension')
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Transaction.tsx193
1 files changed, 126 insertions, 67 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 39175186f..eb2325e7a 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -115,17 +115,26 @@ export function TransactionPage({ tid, goToWalletHistory }: Props): VNode {
return (
<TransactionView
transaction={state.response}
- onSend={async () => {
- null;
- }}
onCancel={async () => {
- await api.wallet.call(WalletApiOperation.AbortTransaction, {
+ await api.wallet.call(WalletApiOperation.CancelAbortingTransaction, {
transactionId,
});
goToWalletHistory(currency);
}}
- onDelete={async () => {
- await api.wallet.call(WalletApiOperation.DeleteTransaction, {
+ onSuspend={async () => {
+ await api.wallet.call(WalletApiOperation.SuspendTransaction, {
+ transactionId,
+ });
+ goToWalletHistory(currency);
+ }}
+ onResume={async () => {
+ await api.wallet.call(WalletApiOperation.SuspendTransaction, {
+ transactionId,
+ });
+ goToWalletHistory(currency);
+ }}
+ onAbort={async () => {
+ await api.wallet.call(WalletApiOperation.AbortTransaction, {
transactionId,
});
goToWalletHistory(currency);
@@ -136,6 +145,12 @@ export function TransactionPage({ tid, goToWalletHistory }: Props): VNode {
});
goToWalletHistory(currency);
}}
+ onDelete={async () => {
+ await api.wallet.call(WalletApiOperation.DeleteTransaction, {
+ transactionId,
+ });
+ goToWalletHistory(currency);
+ }}
onRefund={async (transactionId) => {
await api.wallet.call(WalletApiOperation.StartRefundQuery, {
transactionId,
@@ -148,8 +163,10 @@ export function TransactionPage({ tid, goToWalletHistory }: Props): VNode {
export interface WalletTransactionProps {
transaction: Transaction;
- onSend: () => Promise<void>;
onCancel: () => Promise<void>;
+ onSuspend: () => Promise<void>;
+ onResume: () => Promise<void>;
+ onAbort: () => Promise<void>;
onDelete: () => Promise<void>;
onRetry: () => Promise<void>;
onRefund: (id: TransactionIdStr) => Promise<void>;
@@ -175,7 +192,9 @@ function TransactionTemplate({
transaction,
onDelete,
onRetry,
- onSend,
+ onAbort,
+ onResume,
+ onSuspend,
onCancel,
children,
}: TransactionTemplateProps): VNode {
@@ -199,26 +218,39 @@ function TransactionTemplate({
setConfirmBeforeCancel(true);
}
- const SHOWING_RETRY_THRESHOLD_SECS = 30;
-
- const showSend = false;
const hasCancelTransactionImplemented =
transaction.type === TransactionType.Payment;
+ const hasAbortTransactionImplemented =
+ transaction.type === TransactionType.Withdrawal ||
+ transaction.type === TransactionType.Deposit ||
+ transaction.type === TransactionType.Payment;
- const transactionStillActive =
- transaction.txState.major !== TransactionMajorState.Aborted &&
- transaction.txState.major !== TransactionMajorState.Done &&
- transaction.txState.major !== TransactionMajorState.Failed;
+ const isFinalState =
+ transaction.txState.major === TransactionMajorState.Aborted ||
+ transaction.txState.major === TransactionMajorState.Done ||
+ transaction.txState.major === TransactionMajorState.Failed;
+
+ const showAbort =
+ hasAbortTransactionImplemented &&
+ transaction.txState.major === TransactionMajorState.Pending;
+
+ const showCancel =
+ hasCancelTransactionImplemented &&
+ transaction.txState.major === TransactionMajorState.Aborting;
- // show retry if there is an error in an active state, or after some time
- // if it is not aborting
const showRetry =
- transactionStillActive &&
- (transaction.error !== undefined ||
- (transaction.txState.major === TransactionMajorState.Aborting &&
- (transaction.timestamp.t_s === "never" ||
- differenceInSeconds(new Date(), transaction.timestamp.t_s * 1000) >
- SHOWING_RETRY_THRESHOLD_SECS)));
+ transaction.txState.major !== TransactionMajorState.Pending &&
+ transaction.txState.major !== TransactionMajorState.Aborting;
+
+ const showDelete = isFinalState;
+
+ const showResume =
+ transaction.txState.major === TransactionMajorState.Suspended ||
+ transaction.txState.major === TransactionMajorState.SuspendedAborting;
+
+ const showSuspend =
+ transaction.txState.major === TransactionMajorState.Pending ||
+ transaction.txState.major === TransactionMajorState.Aborting;
return (
<Fragment>
@@ -331,46 +363,50 @@ function TransactionTemplate({
</section>
<section>{children}</section>
<footer>
+ <div />
<div>
- {showSend ? (
+ {showRetry && (
+ <Button
+ variant="contained"
+ onClick={safely("retry transaction", onRetry)}
+ >
+ <i18n.Translate>Retry</i18n.Translate>
+ </Button>
+ )}
+ {showAbort && (
<Button
variant="contained"
- onClick={safely("send transaction", onSend)}
+ onClick={safely("abort transaction", onAbort)}
>
- <i18n.Translate>Send</i18n.Translate>
+ <i18n.Translate>Abort</i18n.Translate>
</Button>
- ) : null}
- </div>
- <div>
- {showRetry ? (
+ )}
+ {showResume && (
<Button
variant="contained"
- onClick={safely("retry transaction", onRetry)}
+ onClick={safely("resume transaction", onResume)}
>
- <i18n.Translate>Retry</i18n.Translate>
+ <i18n.Translate>Resume</i18n.Translate>
</Button>
- ) : null}
- {transactionStillActive ? (
- hasCancelTransactionImplemented ? (
- <Button
- variant="contained"
- color="error"
- onClick={doCheckBeforeCancel as SafeHandler<void>}
- >
- <i18n.Translate>Cancel</i18n.Translate>
- </Button>
- ) : (
- <EnabledBySettings name="deleteActiveTransactions">
- <Button
- variant="contained"
- color="error"
- onClick={doCheckBeforeForget as SafeHandler<void>}
- >
- <i18n.Translate>Delete</i18n.Translate>
- </Button>
- </EnabledBySettings>
- )
- ) : (
+ )}
+ {showSuspend && (
+ <Button
+ variant="contained"
+ onClick={safely("suspend transaction", onSuspend)}
+ >
+ <i18n.Translate>Suspend</i18n.Translate>
+ </Button>
+ )}
+ {showCancel && (
+ <Button
+ variant="contained"
+ color="error"
+ onClick={doCheckBeforeCancel as SafeHandler<void>}
+ >
+ <i18n.Translate>Cancel</i18n.Translate>
+ </Button>
+ )}
+ {showDelete && (
<Button
variant="contained"
color="error"
@@ -388,8 +424,11 @@ function TransactionTemplate({
export function TransactionView({
transaction,
onDelete,
+ onAbort,
+ onBack,
+ onResume,
+ onSuspend,
onRetry,
- onSend,
onRefund,
onCancel,
}: WalletTransactionProps): VNode {
@@ -408,7 +447,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -542,8 +583,10 @@ export function TransactionView({
<TransactionTemplate
transaction={transaction}
onDelete={onDelete}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onRetry={onRetry}
- onSend={onSend}
onCancel={onCancel}
>
<Header
@@ -681,7 +724,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -756,7 +801,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -785,7 +832,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -817,7 +866,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -875,7 +926,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -925,7 +978,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -968,7 +1023,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -1017,7 +1074,9 @@ export function TransactionView({
transaction={transaction}
onDelete={onDelete}
onRetry={onRetry}
- onSend={onSend}
+ onAbort={onAbort}
+ onResume={onResume}
+ onSuspend={onSuspend}
onCancel={onCancel}
>
<Header
@@ -1813,10 +1872,10 @@ function NicePayto({ payto }: { payto: PaytoUri }): VNode {
const url = new URL("/", `https://${payto.host}`);
return (
<Fragment>
- <div>{payto.account}</div>
+ <div>{"payto.account"}</div>
<SmallLightText>
<a href={url.href} target="_bank" rel="noreferrer">
- {url.toString()}
+ {url.href}
</a>
</SmallLightText>
</Fragment>