diff --git a/packages/demobank-ui/src/pages/QrCodeSection.tsx b/packages/demobank-ui/src/pages/QrCodeSection.tsx index 919f2b1fe..dc92576fb 100644 --- a/packages/demobank-ui/src/pages/QrCodeSection.tsx +++ b/packages/demobank-ui/src/pages/QrCodeSection.tsx @@ -14,11 +14,21 @@ GNU Taler; see the file COPYING. If not, see */ -import { stringifyWithdrawUri, WithdrawUriResult } from "@gnu-taler/taler-util"; -import { useTranslationContext } from "@gnu-taler/web-util/lib/index.browser"; +import { + HttpStatusCode, + stringifyWithdrawUri, + WithdrawUriResult, +} from "@gnu-taler/taler-util"; +import { + RequestError, + useTranslationContext, +} from "@gnu-taler/web-util/lib/index.browser"; import { h, VNode } from "preact"; import { useEffect } from "preact/hooks"; import { QR } from "../components/QR.js"; +import { useAccessAnonAPI } from "../hooks/access.js"; +import { notifyError } from "../hooks/notification.js"; +import { buildRequestErrorMessage } from "../utils.js"; export function QrCodeSection({ withdrawUri, @@ -38,6 +48,7 @@ export function QrCodeSection({ }, []); const talerWithdrawUri = stringifyWithdrawUri(withdrawUri); + const { abortWithdrawal } = useAccessAnonAPI(); return (

{i18n.str`Transfer to Taler Wallet`}

@@ -55,7 +66,32 @@ export function QrCodeSection({
{ + e.preventDefault(); + try { + await abortWithdrawal(withdrawUri.withdrawalOperationId); + onAborted(); + } catch (error) { + if (error instanceof RequestError) { + notifyError( + buildRequestErrorMessage(i18n, error.cause, { + onClientError: (status) => + status === HttpStatusCode.Conflict + ? i18n.str`The reserve operation has been confirmed previously and can't be aborted` + : undefined, + }), + ); + } else { + notifyError({ + title: i18n.str`Operation failed, please report`, + description: + error instanceof Error + ? error.message + : JSON.stringify(error), + }); + } + } + }} >{i18n.str`Abort`}