/* This file is part of TALER (C) 2015 GNUnet e.V. 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. 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 TALER; see the file COPYING. If not, see */ /** * Page shown to the user to confirm entering * a contract. */ /** * Imports. */ import * as i18n from "../../i18n"; import { runOnceWhenReady } from "./common"; import { ExchangeRecord, ProposalDownloadRecord } from "../../dbTypes"; import { ContractTerms } from "../../talerTypes"; import { CheckPayResult, PreparePayResult } from "../../walletTypes"; import { renderAmount, ProgressButton } from "../renderHtml"; import * as wxApi from "../wxApi"; import React, { useState, useEffect } from "react"; import * as ReactDOM from "react-dom"; import URI = require("urijs"); import { WalletApiError } from "../wxApi"; import * as Amounts from "../../amounts"; function TalerPayDialog({ talerPayUri }: { talerPayUri: string }) { const [payStatus, setPayStatus] = useState(); const [payErrMsg, setPayErrMsg] = useState(""); const [numTries, setNumTries] = useState(0); const [loading, setLoading] = useState(false); let totalFees: Amounts.AmountJson | undefined = undefined; useEffect(() => { const doFetch = async () => { const p = await wxApi.preparePay(talerPayUri); setPayStatus(p); }; doFetch(); }, [numTries]); if (!payStatus) { return Loading payment information ...; } if (payStatus.status === "error") { return Error: {payStatus.error}; } if (payStatus.status === "payment-possible") { totalFees = payStatus.totalFees; } if (payStatus.status === "paid" && numTries === 0) { return ( You have already paid for this article. Click{" "} here to view it again. ); } const contractTerms = payStatus.contractTerms; if (!contractTerms) { return ( Error: did not get contract terms from merchant or wallet backend. ); } let merchantName: React.ReactElement; if (contractTerms.merchant && contractTerms.merchant.name) { merchantName = {contractTerms.merchant.name}; } else { merchantName = (pub: {contractTerms.merchant_pub}); } const amount = ( {renderAmount(Amounts.parseOrThrow(contractTerms.amount))} ); const doPayment = async () => { setNumTries(numTries + 1); try { setLoading(true); const res = await wxApi.confirmPay(payStatus!.proposalId!, undefined); document.location.href = res.nextUrl; } catch (e) { console.error(e); setPayErrMsg(e.message); } }; return (

The merchant {merchantName} offers you to purchase:

{contractTerms.summary}
{totalFees ? ( The total price is {amount} (plus {renderAmount(totalFees)} fees). ) : ( The total price is {amount}. )}

{payErrMsg ? (

Payment failed: {payErrMsg}

) : (
doPayment()}> {i18n.str`Confirm payment`}
)}
); } runOnceWhenReady(() => { try { const url = new URI(document.location.href); const query: any = URI.parseQuery(url.query()); let talerPayUri = query.talerPayUri; ReactDOM.render( , document.getElementById("contract")!, ); } catch (e) { ReactDOM.render( Fatal error: {e.message}, document.getElementById("contract")!, ); console.error(e); } });