diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/wallet/Transaction.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/wallet/Transaction.tsx | 119 |
1 files changed, 59 insertions, 60 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx index b7eb4a947..542694490 100644 --- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx @@ -32,6 +32,7 @@ import { TransactionRefund, TransactionTip, TransactionType, + TranslatedString, WithdrawalType, } from "@gnu-taler/taler-util"; import { WalletApiOperation } from "@gnu-taler/taler-wallet-core"; @@ -43,9 +44,8 @@ import emptyImg from "../../static/img/empty.png"; import { Amount } from "../components/Amount.js"; import { BankDetailsByPaytoType } from "../components/BankDetailsByPaytoType.js"; import { CopyButton } from "../components/CopyButton.js"; -import { ErrorTalerOperation } from "../components/ErrorTalerOperation.js"; +import { AlertView, ErrorAlertView } from "../components/CurrentAlerts.js"; import { Loading } from "../components/Loading.js"; -import { LoadingError } from "../components/LoadingError.js"; import { Kind, Part, PartCollapsible, PartPayto } from "../components/Part.js"; import { QR } from "../components/QR.js"; import { ShowFullContractTermPopup } from "../components/ShowFullContractTermPopup.js"; @@ -60,6 +60,7 @@ import { WarningBox, } from "../components/styled/index.js"; import { Time } from "../components/Time.js"; +import { alertFromError } from "../context/alert.js"; import { useBackendContext } from "../context/backend.js"; import { useTranslationContext } from "../context/translation.js"; import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js"; @@ -98,13 +99,11 @@ export function TransactionPage({ if (state.hasError) { return ( - <LoadingError - title={ - <i18n.Translate> - Could not load the transaction information - </i18n.Translate> - } - error={state} + <AlertView + alert={alertFromError( + i18n.str`Could not load transaction information`, + state, + )} /> ); } @@ -199,14 +198,14 @@ export function TransactionView({ return ( <Fragment> <section style={{ padding: 8, textAlign: "center" }}> - <ErrorTalerOperation - title={ - <i18n.Translate> - There was an error trying to complete the transaction - </i18n.Translate> - } - error={transaction?.error} - /> + {transaction?.error ? ( + <ErrorAlertView + error={alertFromError( + i18n.str`There was an error trying to complete the transaction`, + transaction.error, + )} + /> + ) : undefined} {transaction.pending && ( <WarningBox> <i18n.Translate>This transaction is not completed</i18n.Translate> @@ -367,7 +366,7 @@ export function TransactionView({ </Fragment> )} <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <WithdrawDetails amount={{ @@ -420,7 +419,7 @@ export function TransactionView({ <br /> {transaction.refunds.length > 0 ? ( <Part - title={<i18n.Translate>Refunds</i18n.Translate>} + title={i18n.str`Refunds`} text={ <table> {transaction.refunds.map((r, i) => { @@ -462,7 +461,7 @@ export function TransactionView({ picked up. </i18n.Translate> <Part - title={<i18n.Translate>Offer</i18n.Translate>} + title={i18n.str`Offer`} text={<Amount value={pendingRefund} />} kind="positive" /> @@ -480,17 +479,17 @@ export function TransactionView({ </InfoBox> )} <Part - title={<i18n.Translate>Merchant</i18n.Translate>} + title={i18n.str`Merchant`} text={<MerchantDetails merchant={transaction.info.merchant} />} kind="neutral" /> <Part - title={<i18n.Translate>Invoice ID</i18n.Translate>} - text={transaction.info.orderId} + title={i18n.str`Invoice ID`} + text={transaction.info.orderId as TranslatedString} kind="neutral" /> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <PurchaseDetails price={price} @@ -520,12 +519,12 @@ export function TransactionView({ </Header> {payto && <PartPayto payto={payto} kind="neutral" />} <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={<DepositDetails transaction={transaction} />} kind="neutral" /> <Part - title={<i18n.Translate>Wire transfer deadline</i18n.Translate>} + title={i18n.str`Wire transfer deadline`} text={ <Time timestamp={AbsoluteTime.fromTimestamp( @@ -557,7 +556,7 @@ export function TransactionView({ {transaction.exchangeBaseUrl} </Header> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={<RefreshDetails transaction={transaction} />} /> </TransactionTemplate> @@ -578,12 +577,12 @@ export function TransactionView({ {transaction.merchantBaseUrl} </Header> {/* <Part - title={<i18n.Translate>Merchant</i18n.Translate>} + title={i18n.str`Merchant`} text={<MerchantDetails merchant={transaction.merchant} />} kind="neutral" /> */} <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={<TipDetails transaction={transaction} />} /> </TransactionTemplate> @@ -604,12 +603,12 @@ export function TransactionView({ </Header> <Part - title={<i18n.Translate>Merchant</i18n.Translate>} - text={transaction.info.merchant.name} + title={i18n.str`Merchant`} + text={transaction.info.merchant.name as TranslatedString} kind="neutral" /> <Part - title={<i18n.Translate>Original order ID</i18n.Translate>} + title={i18n.str`Original order ID`} text={ <a href={Pages.balanceTransaction({ @@ -622,12 +621,12 @@ export function TransactionView({ kind="neutral" /> <Part - title={<i18n.Translate>Purchase summary</i18n.Translate>} - text={transaction.info.summary} + title={i18n.str`Purchase summary`} + text={transaction.info.summary as TranslatedString} kind="neutral" /> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={<RefundDetails transaction={transaction} />} /> </TransactionTemplate> @@ -683,25 +682,25 @@ export function TransactionView({ {transaction.info.summary ? ( <Part - title={<i18n.Translate>Subject</i18n.Translate>} - text={transaction.info.summary} + title={i18n.str`Subject`} + text={transaction.info.summary as TranslatedString} kind="neutral" /> ) : undefined} <Part - title={<i18n.Translate>Exchange</i18n.Translate>} - text={transaction.exchangeBaseUrl} + title={i18n.str`Exchange`} + text={transaction.exchangeBaseUrl as TranslatedString} kind="neutral" /> {transaction.pending /** pending is not-pay */ && ( <Part - title={<i18n.Translate>URI</i18n.Translate>} + title={i18n.str`URI`} text={<ShowQrWithCopy text={transaction.talerUri} />} kind="neutral" /> )} <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <InvoiceDetails amount={{ @@ -730,18 +729,18 @@ export function TransactionView({ {transaction.info.summary ? ( <Part - title={<i18n.Translate>Subject</i18n.Translate>} - text={transaction.info.summary} + title={i18n.str`Subject`} + text={transaction.info.summary as TranslatedString} kind="neutral" /> ) : undefined} <Part - title={<i18n.Translate>Exchange</i18n.Translate>} - text={transaction.exchangeBaseUrl} + title={i18n.str`Exchange`} + text={transaction.exchangeBaseUrl as TranslatedString} kind="neutral" /> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <InvoiceDetails amount={{ @@ -769,25 +768,25 @@ export function TransactionView({ {transaction.info.summary ? ( <Part - title={<i18n.Translate>Subject</i18n.Translate>} - text={transaction.info.summary} + title={i18n.str`Subject`} + text={transaction.info.summary as TranslatedString} kind="neutral" /> ) : undefined} <Part - title={<i18n.Translate>Exchange</i18n.Translate>} - text={transaction.exchangeBaseUrl} + title={i18n.str`Exchange`} + text={transaction.exchangeBaseUrl as TranslatedString} kind="neutral" /> {/* {transaction.pending && ( //pending is not-received )} */} <Part - title={<i18n.Translate>URI</i18n.Translate>} + title={i18n.str`URI`} text={<ShowQrWithCopy text={transaction.talerUri} />} kind="neutral" /> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <TransferDetails amount={{ @@ -816,18 +815,18 @@ export function TransactionView({ {transaction.info.summary ? ( <Part - title={<i18n.Translate>Subject</i18n.Translate>} - text={transaction.info.summary} + title={i18n.str`Subject`} + text={transaction.info.summary as TranslatedString} kind="neutral" /> ) : undefined} <Part - title={<i18n.Translate>Exchange</i18n.Translate>} - text={transaction.exchangeBaseUrl} + title={i18n.str`Exchange`} + text={transaction.exchangeBaseUrl as TranslatedString} kind="neutral" /> <Part - title={<i18n.Translate>Details</i18n.Translate>} + title={i18n.str`Details`} text={ <TransferDetails amount={{ @@ -1245,7 +1244,7 @@ export function PurchaseDetails({ <td colSpan={2}> <PartCollapsible big - title={<i18n.Translate>Products</i18n.Translate>} + title={i18n.str`Products`} text={ <ListOfProducts> {info.products?.map((p, k) => ( @@ -1274,7 +1273,7 @@ export function PurchaseDetails({ <td colSpan={2}> <PartCollapsible big - title={<i18n.Translate>Delivery</i18n.Translate>} + title={i18n.str`Delivery`} text={ <DeliveryDetails date={info.delivery_date} @@ -1508,7 +1507,7 @@ function Header({ total: AmountJson; children: ComponentChildren; kind: Kind; - type: string; + type: TranslatedString; }): VNode { return ( <div |