diff options
author | Sebastian <sebasjm@gmail.com> | 2022-02-23 15:18:37 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-02-24 12:50:51 -0300 |
commit | 41850c9f14baa5330919c6dabf161b1aaeda7376 (patch) | |
tree | 678125e50206ca3f51a6051257a94644044f456a /packages/taler-wallet-webextension/src/cta/Pay.tsx | |
parent | 7647d077e7d9a5581e3ce919da936bc5d22a4df2 (diff) | |
download | wallet-core-41850c9f14baa5330919c6dabf161b1aaeda7376.tar.xz |
add i18n where was missing
Diffstat (limited to 'packages/taler-wallet-webextension/src/cta/Pay.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/cta/Pay.tsx | 143 |
1 files changed, 94 insertions, 49 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Pay.tsx b/packages/taler-wallet-webextension/src/cta/Pay.tsx index 7f5f42e8d..7ed0d072f 100644 --- a/packages/taler-wallet-webextension/src/cta/Pay.tsx +++ b/packages/taler-wallet-webextension/src/cta/Pay.tsx @@ -37,10 +37,12 @@ import { PreparePayResult, PreparePayResultType, Product, + Translate, } from "@gnu-taler/taler-util"; import { OperationFailedError } from "@gnu-taler/taler-wallet-core"; import { Fragment, h, VNode } from "preact"; import { useEffect, useState } from "preact/hooks"; +import { ErrorMessage } from "../components/ErrorMessage"; import { Loading } from "../components/Loading"; import { LoadingError } from "../components/LoadingError"; import { LogoHeader } from "../components/LogoHeader"; @@ -106,7 +108,12 @@ export function PayPage({ } if (hook.hasError) { - return <LoadingError title="Could not load pay status" error={hook} />; + return ( + <LoadingError + title={<Translate>Could not load pay status</Translate>} + error={hook} + /> + ); } const foundBalance = hook.response.balance.balances.find( @@ -178,9 +185,13 @@ export function PaymentRequestView({ if (!contractTerms) { return ( - <span> - Error: did not get contract terms from merchant or wallet backend. - </span> + <ErrorMessage + title={ + <Translate> + Could not load contract terms from merchant or wallet backend. + </Translate> + } + /> ); } @@ -192,13 +203,6 @@ export function PaymentRequestView({ totalFees = Amounts.sub(amountEffective, amountRaw).amount; } - // let merchantName: VNode; - // if (contractTerms.merchant && contractTerms.merchant.name) { - // merchantName = <strong>{contractTerms.merchant.name}</strong>; - // } else { - // merchantName = <strong>(pub: {contractTerms.merchant_pub})</strong>; - // } - function Alternative(): VNode { const [showQR, setShowQR] = useState<boolean>(false); const privateUri = @@ -209,12 +213,21 @@ export function PaymentRequestView({ return ( <section> <LinkSuccess upperCased onClick={() => setShowQR((qr) => !qr)}> - {!showQR ? i18n.str`Pay with a mobile phone` : i18n.str`Hide QR`} + {!showQR ? ( + <Translate>Pay with a mobile phone</Translate> + ) : ( + <Translate>Hide QR</Translate> + )} </LinkSuccess> {showQR && ( <div> <QR text={privateUri} /> - Scan the QR code or <a href={privateUri}>click here</a> + <Translate> + Scan the QR code or + <a href={privateUri}> + <Translate>click here</Translate> + </a> + </Translate> </div> )} </section> @@ -227,7 +240,9 @@ export function PaymentRequestView({ return ( <section> <div> - <p>Processing...</p> + <p> + <Translate>Processing</Translate>... + </p> </div> </section> ); @@ -239,7 +254,9 @@ export function PaymentRequestView({ <Fragment> <section> <ButtonSuccess upperCased onClick={onClick}> - {i18n.str`Pay`} {amountToString(payStatus.amountEffective)} + <Translate> + Pay {amountToString(payStatus.amountEffective)} + </Translate> </ButtonSuccess> </section> <Alternative /> @@ -252,18 +269,22 @@ export function PaymentRequestView({ <section> {balance ? ( <WarningBox> - Your balance of {amountToString(balance)} is not enough to pay - for this purchase + <Translate> + Your balance of {amountToString(balance)} is not enough to pay + for this purchase + </Translate> </WarningBox> ) : ( <WarningBox> - Your balance is not enough to pay for this purchase. + <Translate> + Your balance is not enough to pay for this purchase. + </Translate> </WarningBox> )} </section> <section> <ButtonSuccess upperCased onClick={goToWalletManualWithdraw}> - {i18n.str`Withdraw digital cash`} + <Translate>Withdraw digital cash</Translate> </ButtonSuccess> </section> <Alternative /> @@ -276,7 +297,7 @@ export function PaymentRequestView({ <section> {payStatus.paid && contractTerms.fulfillment_message && ( <Part - title="Merchant message" + title={<Translate>Merchant message</Translate>} text={contractTerms.fulfillment_message} kind="neutral" /> @@ -293,31 +314,48 @@ export function PaymentRequestView({ <WalletAction> <LogoHeader /> - <h2>{i18n.str`Digital cash payment`}</h2> + <h2> + <Translate>Digital cash payment</Translate> + </h2> {payStatus.status === PreparePayResultType.AlreadyConfirmed && (payStatus.paid ? ( payStatus.contractTerms.fulfillment_url ? ( <SuccessBox> - Already paid, you are going to be redirected to{" "} - <a href={payStatus.contractTerms.fulfillment_url}> - {payStatus.contractTerms.fulfillment_url} - </a> + <Translate> + Already paid, you are going to be redirected to{" "} + <a href={payStatus.contractTerms.fulfillment_url}> + {payStatus.contractTerms.fulfillment_url} + </a> + </Translate> </SuccessBox> ) : ( - <SuccessBox> Already paid </SuccessBox> + <SuccessBox> + <Translate>Already paid</Translate> + </SuccessBox> ) ) : ( - <WarningBox> Already claimed </WarningBox> + <WarningBox> + <Translate>Already claimed</Translate> + </WarningBox> ))} {payResult && payResult.type === ConfirmPayResultType.Done && ( <SuccessBox> - <h3>Payment complete</h3> + <h3> + <Translate>Payment complete</Translate> + </h3> <p> - {!payResult.contractTerms.fulfillment_message - ? payResult.contractTerms.fulfillment_url - ? `You are going to be redirected to ${payResult.contractTerms.fulfillment_url}` - : "You can close this page." - : payResult.contractTerms.fulfillment_message} + {!payResult.contractTerms.fulfillment_message ? ( + payResult.contractTerms.fulfillment_url ? ( + <Translate> + You are going to be redirected to $ + {payResult.contractTerms.fulfillment_url} + </Translate> + ) : ( + <Translate>You can close this page.</Translate> + ) + ) : ( + payResult.contractTerms.fulfillment_message + )} </p> </SuccessBox> )} @@ -326,14 +364,14 @@ export function PaymentRequestView({ Amounts.isNonZero(totalFees) && ( <Part big - title="Total to pay" + title={<Translate>Total to pay</Translate>} text={amountToString(payStatus.amountEffective)} kind="negative" /> )} <Part big - title="Purchase amount" + title={<Translate>Purchase amount</Translate>} text={amountToString(payStatus.amountRaw)} kind="neutral" /> @@ -341,21 +379,25 @@ export function PaymentRequestView({ <Fragment> <Part big - title="Fee" + title={<Translate>Fee</Translate>} text={amountToString(totalFees)} kind="negative" /> </Fragment> )} <Part - title="Merchant" + title={<Translate>Merchant</Translate>} text={contractTerms.merchant.name} kind="neutral" /> - <Part title="Purchase" text={contractTerms.summary} kind="neutral" /> + <Part + title={<Translate>Purchase</Translate>} + text={contractTerms.summary} + kind="neutral" + /> {contractTerms.order_id && ( <Part - title="Receipt" + title={<Translate>Receipt</Translate>} text={`#${contractTerms.order_id}`} kind="neutral" /> @@ -373,7 +415,7 @@ function ProductList({ products }: { products: Product[] }): VNode { return ( <Fragment> <SmallLightText style={{ margin: ".5em" }}> - List of products + <Translate>List of products</Translate> </SmallLightText> <dl> {products.map((p, i) => { @@ -415,15 +457,18 @@ function ProductList({ products }: { products: Product[] }): VNode { {p.quantity ?? 1} x {p.description} </dt> <dd> - Total{` `} - {p.price - ? `${Amounts.stringifyValue( - Amounts.mult( - Amounts.parseOrThrow(p.price), - p.quantity ?? 1, - ).amount, - )} ${p}` - : "free"} + <Translate>Total</Translate> + {` `} + {p.price ? ( + `${Amounts.stringifyValue( + Amounts.mult( + Amounts.parseOrThrow(p.price), + p.quantity ?? 1, + ).amount, + )} ${p}` + ) : ( + <Translate>free</Translate> + )} </dd> </div> </div> |