diff options
Diffstat (limited to 'packages/taler-wallet-webextension')
9 files changed, 143 insertions, 39 deletions
diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx index b6fd494fa..dd8abc509 100644 --- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx +++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx @@ -65,6 +65,8 @@ export function BankDetailsByPaytoType({ const payto = parsePaytoUri(firstPayto); if (!payto) return <Fragment />; + payto.params["amount"] = Amounts.stringify(amount); + payto.params["message"] = subject; if (payto.isKnown && payto.targetType === "bitcoin") { const min = segwitMinAmount(amount.currency); diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx index 18da2609c..b67bbb216 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx @@ -31,7 +31,7 @@ import editIcon from "../../svg/edit_24px.inline.svg"; import { ExchangeDetails, getAmountWithFee, - InvoiceDetails, + InvoiceCreationDetails, } from "../../wallet/Transaction.js"; import { State } from "./index.js"; @@ -144,7 +144,7 @@ export function ReadyView({ <Part title={i18n.str`Details`} text={ - <InvoiceDetails + <InvoiceCreationDetails amount={getAmountWithFee(toBeReceived, requestAmount, "credit")} /> } diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx index 85923a2c5..e54e54bd1 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx @@ -22,7 +22,10 @@ import { PaymentButtons } from "../../components/PaymentButtons.js"; import { SubTitle, WalletAction } from "../../components/styled/index.js"; import { Time } from "../../components/Time.js"; import { useTranslationContext } from "@gnu-taler/web-util/browser"; -import { getAmountWithFee, InvoiceDetails } from "../../wallet/Transaction.js"; +import { + getAmountWithFee, + InvoicePaymentDetails, +} from "../../wallet/Transaction.js"; import { State } from "./index.js"; export function ReadyView( @@ -38,7 +41,7 @@ export function ReadyView( <Part title={i18n.str`Details`} text={ - <InvoiceDetails + <InvoicePaymentDetails amount={getAmountWithFee(effective, raw, "debit")} /> } diff --git a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx index 764036dad..b0911cb2f 100644 --- a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx @@ -104,7 +104,7 @@ export function BaseView(state: SupportedStates): VNode { )} </section> <PaymentButtons - amount={state.amount} + amount={effective} payStatus={state.payStatus} uri={state.uri} payHandler={state.status === "ready" ? state.payHandler : undefined} diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts index edd823181..80b8a01bd 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts @@ -67,8 +67,8 @@ export function useComponentState({ // } const { amountEffective, amountRaw } = hook.response; - const debitAmount = Amounts.parseOrThrow(amountRaw); - const toBeReceived = Amounts.parseOrThrow(amountEffective); + const debitAmount = Amounts.parseOrThrow(amountEffective); + const toBeReceived = Amounts.parseOrThrow(amountRaw); let purse_expiration: TalerProtocolTimestamp | undefined = undefined; let timestampError: string | undefined = undefined; diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx index 8fe88025f..8489b0643 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx @@ -14,17 +14,16 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { Amounts } from "@gnu-taler/taler-util"; +import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { format } from "date-fns"; import { Fragment, h, VNode } from "preact"; -import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; -import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; -import { Link, SubTitle, WalletAction } from "../../components/styled/index.js"; -import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Button } from "../../mui/Button.js"; import { TextField } from "../../mui/TextField.js"; -import { getAmountWithFee, TransferDetails } from "../../wallet/Transaction.js"; +import { + getAmountWithFee, + TransferCreationDetails, +} from "../../wallet/Transaction.js"; import { State } from "./index.js"; export function ReadyView({ @@ -110,7 +109,7 @@ export function ReadyView({ <Part title={i18n.str`Details`} text={ - <TransferDetails + <TransferCreationDetails amount={getAmountWithFee(debitAmount, toBeReceived, "debit")} /> } diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx index 189554a49..5dce2ce22 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx @@ -14,16 +14,16 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ +import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, h, VNode } from "preact"; import { Amount } from "../../components/Amount.js"; -import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; -import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; -import { Link, SubTitle, WalletAction } from "../../components/styled/index.js"; import { Time } from "../../components/Time.js"; -import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Button } from "../../mui/Button.js"; -import { getAmountWithFee, TransferDetails } from "../../wallet/Transaction.js"; +import { + getAmountWithFee, + TransferPickupDetails, +} from "../../wallet/Transaction.js"; import { State } from "./index.js"; export function ReadyView({ @@ -42,7 +42,7 @@ export function ReadyView({ <Part title={i18n.str`Details`} text={ - <TransferDetails + <TransferPickupDetails amount={getAmountWithFee(effective, raw, "credit")} /> } diff --git a/packages/taler-wallet-webextension/src/wallet/History.tsx b/packages/taler-wallet-webextension/src/wallet/History.tsx index a16590fe8..900218991 100644 --- a/packages/taler-wallet-webextension/src/wallet/History.tsx +++ b/packages/taler-wallet-webextension/src/wallet/History.tsx @@ -152,16 +152,20 @@ export function HistoryView({ ? [] : transactionByCurrency[selectedCurrency] ?? []; + const datesWithTransaction: string[] = []; const byDate = ts.reduce((rv, x) => { const theDate = x.timestamp.t_s === "never" ? 0 : normalizeToDay(x.timestamp.t_s * 1000); if (theDate) { - (rv[theDate] = rv[theDate] || []).push(x); + if (!rv[theDate]) { + rv[theDate] = []; + datesWithTransaction.push(String(theDate)); + } + rv[theDate].push(x); } return rv; }, {} as { [x: string]: Transaction[] }); - const datesWithTransaction = Object.keys(byDate); if (balances.length === 0 || !selectedCurrency) { return ( diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx index 13adb34b2..17a921b54 100644 --- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx @@ -876,7 +876,7 @@ export function TransactionView({ <Part title={i18n.str`Details`} text={ - <InvoiceDetails + <InvoiceCreationDetails amount={getAmountWithFee(effective, raw, "credit")} /> } @@ -920,7 +920,7 @@ export function TransactionView({ <Part title={i18n.str`Details`} text={ - <InvoiceDetails + <InvoicePaymentDetails amount={getAmountWithFee(effective, raw, "debit")} /> } @@ -972,7 +972,7 @@ export function TransactionView({ <Part title={i18n.str`Details`} text={ - <TransferDetails + <TransferCreationDetails amount={getAmountWithFee(effective, raw, "debit")} /> } @@ -1016,7 +1016,7 @@ export function TransactionView({ <Part title={i18n.str`Details`} text={ - <TransferDetails + <TransferPickupDetails amount={getAmountWithFee(effective, raw, "credit")} /> } @@ -1212,24 +1212,27 @@ export function getAmountWithFee( raw: AmountJson, direction: "credit" | "debit", ): AmountWithFee { - const fee = - direction === "credit" - ? Amounts.sub(raw, effective).amount - : Amounts.sub(effective, raw).amount; + const total = direction === "credit" ? effective : raw; + const value = direction === "debit" ? effective : raw; + const fee = Amounts.sub(value, total).amount; const maxFrac = [effective, raw, fee] .map((a) => Amounts.maxFractionalDigits(a)) .reduce((c, p) => Math.max(c, p), 0); return { - total: effective, - value: raw, + total, + value, fee, maxFrac, }; } -export function InvoiceDetails({ amount }: { amount: AmountWithFee }): VNode { +export function InvoiceCreationDetails({ + amount, +}: { + amount: AmountWithFee; +}): VNode { const { i18n } = useTranslationContext(); return ( @@ -1270,7 +1273,101 @@ export function InvoiceDetails({ amount }: { amount: AmountWithFee }): VNode { ); } -export function TransferDetails({ amount }: { amount: AmountWithFee }): VNode { +export function InvoicePaymentDetails({ + amount, +}: { + amount: AmountWithFee; +}): VNode { + const { i18n } = useTranslationContext(); + + return ( + <PurchaseDetailsTable> + <tr> + <td> + <i18n.Translate>Invoice</i18n.Translate> + </td> + <td> + <Amount value={amount.total} maxFracSize={amount.maxFrac} /> + </td> + </tr> + + {Amounts.isNonZero(amount.fee) && ( + <tr> + <td> + <i18n.Translate>Fees</i18n.Translate> + </td> + <td> + <Amount value={amount.fee} maxFracSize={amount.maxFrac} /> + </td> + </tr> + )} + <tr> + <td colSpan={2}> + <hr /> + </td> + </tr> + <tr> + <td> + <i18n.Translate>Total</i18n.Translate> + </td> + <td> + <Amount value={amount.value} maxFracSize={amount.maxFrac} /> + </td> + </tr> + </PurchaseDetailsTable> + ); +} + +export function TransferCreationDetails({ + amount, +}: { + amount: AmountWithFee; +}): VNode { + const { i18n } = useTranslationContext(); + + return ( + <PurchaseDetailsTable> + <tr> + <td> + <i18n.Translate>Sent</i18n.Translate> + </td> + <td> + <Amount value={amount.value} maxFracSize={amount.maxFrac} /> + </td> + </tr> + + {Amounts.isNonZero(amount.fee) && ( + <tr> + <td> + <i18n.Translate>Fees</i18n.Translate> + </td> + <td> + <Amount value={amount.fee} maxFracSize={amount.maxFrac} /> + </td> + </tr> + )} + <tr> + <td colSpan={2}> + <hr /> + </td> + </tr> + <tr> + <td> + <i18n.Translate>Transfer</i18n.Translate> + </td> + <td> + <Amount value={amount.total} maxFracSize={amount.maxFrac} /> + </td> + </tr> + </PurchaseDetailsTable> + ); +} + +export function TransferPickupDetails({ + amount, +}: { + amount: AmountWithFee; +}): VNode { const { i18n } = useTranslationContext(); return ( @@ -1310,7 +1407,6 @@ export function TransferDetails({ amount }: { amount: AmountWithFee }): VNode { </PurchaseDetailsTable> ); } - export function WithdrawDetails({ amount }: { amount: AmountWithFee }): VNode { const { i18n } = useTranslationContext(); @@ -1324,7 +1420,7 @@ export function WithdrawDetails({ amount }: { amount: AmountWithFee }): VNode { <PurchaseDetailsTable> <tr> <td> - <i18n.Translate>Wire transfer</i18n.Translate> + <i18n.Translate>Transfer</i18n.Translate> </td> <td> <Amount value={amount.value} maxFracSize={amount.maxFrac} /> @@ -1389,7 +1485,7 @@ export function PurchaseDetails({ <i18n.Translate>Price</i18n.Translate> </td> <td> - <Amount value={price.value} /> + <Amount value={price.total} /> </td> </tr> {Amounts.isNonZero(price.fee) && ( @@ -1451,7 +1547,7 @@ export function PurchaseDetails({ <i18n.Translate>Total</i18n.Translate> </td> <td> - <Amount value={price.total} /> + <Amount value={price.value} /> </td> </tr> </Fragment> @@ -1621,7 +1717,7 @@ function DepositDetails({ amount }: { amount: AmountWithFee }): VNode { <PurchaseDetailsTable> <tr> <td> - <i18n.Translate>Deposit</i18n.Translate> + <i18n.Translate>Sent</i18n.Translate> </td> <td> <Amount value={amount.value} maxFracSize={amount.maxFrac} /> |