diff --git a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx b/packages/taler-wallet-webextension/src/components/HistoryItem.tsx similarity index 78% rename from packages/taler-wallet-webextension/src/components/TransactionItem.tsx rename to packages/taler-wallet-webextension/src/components/HistoryItem.tsx index 15669e63d..a0ce04460 100644 --- a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx +++ b/packages/taler-wallet-webextension/src/components/HistoryItem.tsx @@ -39,7 +39,7 @@ import { } from "./styled/index.js"; import { Time } from "./Time.js"; -export function TransactionItem(props: { tx: Transaction }): VNode { +export function HistoryItem(props: { tx: Transaction }): VNode { const tx = props.tx; const { i18n } = useTranslationContext(); /** @@ -48,14 +48,15 @@ export function TransactionItem(props: { tx: Transaction }): VNode { switch (tx.type) { case TransactionType.Withdrawal: return ( - @@ -276,9 +296,9 @@ function TransactionLayout(props: TransactionLayoutProps): VNode { )} - {props.pending && ( + {props.description && ( - {props.pending} + {props.description} )} @@ -286,7 +306,7 @@ function TransactionLayout(props: TransactionLayoutProps): VNode { @@ -294,7 +314,7 @@ function TransactionLayout(props: TransactionLayoutProps): VNode { ); } -interface TransactionLayoutProps { +interface LayoutProps { debitCreditIndicator: "debit" | "credit" | "unknown"; amount: AmountString | "unknown"; timestamp: AbsoluteTime; @@ -302,13 +322,14 @@ interface TransactionLayoutProps { subtitle?: string; id: string; iconPath: string; - pending?: string; + currentState: TransactionMajorState; + description?: string; } interface TransactionAmountProps { debitCreditIndicator: "debit" | "credit" | "unknown"; amount: AmountJson; - pending: boolean; + currentState: TransactionMajorState; } function TransactionAmount(props: TransactionAmountProps): VNode { @@ -328,24 +349,43 @@ function TransactionAmount(props: TransactionAmountProps): VNode { {sign} {Amounts.stringifyValue(props.amount, 2)} - {props.pending && ( -
- PENDING + {props.currentState === TransactionMajorState.Aborted ? ( +
+ ABORTED
- )} + ) : props.currentState === TransactionMajorState.Failed ? ( +
+ FAILED +
+ ) : undefined} ); } diff --git a/packages/taler-wallet-webextension/src/spa/index.html b/packages/taler-wallet-webextension/src/spa/index.html index f352c7bf4..0d2cf0e0b 100644 --- a/packages/taler-wallet-webextension/src/spa/index.html +++ b/packages/taler-wallet-webextension/src/spa/index.html @@ -1,7 +1,7 @@ - +