diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
index e97b3364f..6f4980aff 100644
--- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
+++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
@@ -21,11 +21,11 @@ import {
segwitMinAmount,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
-import { useEffect, useMemo, useRef, useState } from "preact/hooks";
+import { useEffect, useRef, useState } from "preact/hooks";
import { useTranslationContext } from "../context/translation.js";
import { CopiedIcon, CopyIcon } from "../svg/index.js";
import { Amount } from "./Amount.js";
-import { ButtonBox, TooltipLeft, TooltipRight } from "./styled/index.js";
+import { ButtonBox, TooltipLeft } from "./styled/index.js";
export interface BankDetailsProps {
payto: PaytoUri | undefined;
@@ -123,9 +123,9 @@ export function BankDetailsByPaytoType({
) : payto.targetType === "iban" ? (
- {payto.bic !== undefined ?
+ {payto.bic !== undefined ? (
BIC} value={payto.bic} />
- : undefined}
+ ) : undefined}
IBAN} value={payto.iban} />
) : undefined;
diff --git a/packages/taler-wallet-webextension/src/components/CopyButton.tsx b/packages/taler-wallet-webextension/src/components/CopyButton.tsx
new file mode 100644
index 000000000..2024e2423
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/components/CopyButton.tsx
@@ -0,0 +1,54 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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
+ */
+
+import { h, VNode } from "preact";
+import { useEffect, useState } from "preact/hooks";
+import { CopiedIcon, CopyIcon } from "../svg/index.js";
+import { ButtonBox, TooltipLeft } from "./styled/index.js";
+
+export function CopyButton({
+ getContent,
+}: {
+ getContent: () => string;
+}): VNode {
+ const [copied, setCopied] = useState(false);
+ function copyText(): void {
+ navigator.clipboard.writeText(getContent() || "");
+ setCopied(true);
+ }
+ useEffect(() => {
+ if (copied) {
+ setTimeout(() => {
+ setCopied(false);
+ }, 1000);
+ }
+ }, [copied]);
+
+ if (!copied) {
+ return (
+
+
+
+ );
+ }
+ return (
+
+
+
+
+
+ );
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
index 1440229af..38590f715 100644
--- a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
@@ -17,6 +17,7 @@ import { AmountJson, PaytoUri, stringifyPaytoUri } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { Amount } from "../components/Amount.js";
import { BankDetailsByPaytoType } from "../components/BankDetailsByPaytoType.js";
+import { CopyButton } from "../components/CopyButton.js";
import { ErrorMessage } from "../components/ErrorMessage.js";
import { QR } from "../components/QR.js";
import { Title, WarningBox } from "../components/styled/index.js";
@@ -56,6 +57,30 @@ export function ReserveCreated({
payto={paytoURI}
subject={reservePub}
/>
+
+
+
+
+
+
+
+ Payto URI
+
+
+
+ |
+ {stringifyPaytoUri(paytoURI)} |
+
+ stringifyPaytoUri(paytoURI)} />
+ |
+
+
+
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 9fff76442..29d1bdd45 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -42,6 +42,7 @@ import { useEffect, useState } from "preact/hooks";
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 { Loading } from "../components/Loading.js";
import { LoadingError } from "../components/LoadingError.js";
@@ -293,6 +294,39 @@ export function TransactionView({
)}
subject={transaction.withdrawalDetails.reservePub}
/>
+
+
+
+
+
+
+
+ Payto URI
+
+
+
+ |
+
+ {transaction.withdrawalDetails.exchangePaytoUris[0]}
+ |
+
+
+ transaction.withdrawalDetails.type ===
+ WithdrawalType.ManualTransfer
+ ? transaction.withdrawalDetails.exchangePaytoUris[0]
+ : ""
+ }
+ />
+ |
+
+
+
Make sure to use the correct subject, otherwise the money will