translations

2 files changed, 35 insertions, 33 deletions

diff --git a/src/pages/confirm-contract.tsx b/src/pages/confirm-contract.tsx
index 238ae2fb5..2ce3b0616 100644
--- a/src/pages/confirm-contract.tsx
+++ b/src/pages/confirm-contract.tsx
@@ -58,7 +58,9 @@ class Details extends React.Component<DetailProps, DetailState> {
         <div>
           <button className="linky"
                   onClick={() => { this.setState({collapsed: false} as any)}}>
+          <i18n.Translate wrap="span">
             show more details
+          </i18n.Translate>
           </button>
         </div>
       );
@@ -70,12 +72,12 @@ class Details extends React.Component<DetailProps, DetailState> {
             show less details
           </button>
           <div>
-            Accepted exchanges:
+            {i18n`Accepted exchanges:`}
             <ul>
               {this.props.contract.exchanges.map(
                 e => <li>{`${e.url}: ${e.master_pub}`}</li>)}
             </ul>
-            Exchanges in the wallet:
+            {i18n`Exchanges in the wallet:`}
             <ul>
               {(this.props.exchanges || []).map(
                 (e: ExchangeRecord) =>
@@ -152,8 +154,7 @@ class ContractPrompt extends React.Component<ContractPromptProps, ContractPrompt
         switch (resp.error) {
           case "coins-insufficient":
             let msgInsufficient = i18n`You have insufficient funds of the requested currency in your wallet.`;
-            let msgNoMatch = i18n`You do not have any funds from an exchange that is accepted by this merchant.
-              None of the exchanges accepted by the merchant is known to your wallet.`;
+            let msgNoMatch = i18n`You do not have any funds from an exchange that is accepted by this merchant. None of the exchanges accepted by the merchant is known to your wallet.`;
             if (this.state.exchanges && this.state.offer) {
               let acceptedExchangePubs = this.state.offer.contract.exchanges.map((e) => e.master_pub);
               let ex = this.state.exchanges.find((e) => acceptedExchangePubs.indexOf(e.masterPublicKey) >= 0);
diff --git a/src/pages/confirm-create-reserve.tsx b/src/pages/confirm-create-reserve.tsx
index 81a90650c..77a18a8a8 100644
--- a/src/pages/confirm-create-reserve.tsx
+++ b/src/pages/confirm-create-reserve.tsx
@@ -102,15 +102,15 @@ function renderReserveCreationDetails(rci: ReserveCreationInfo|null) {
 
   return (
     <div>
-      <p>{`Withdrawal fees: ${withdrawFeeStr}`}</p>
-      <p>{`Rounding loss: ${overheadStr}`}</p>
+      <p>{i18n`Withdrawal fees: ${withdrawFeeStr}`}</p>
+      <p>{i18n`Rounding loss: ${overheadStr}`}</p>
       <table>
         <thead>
-        <th># Coins</th>
-        <th>Value</th>
-        <th>Withdraw Fee</th>
-        <th>Refresh Fee</th>
-        <th>Deposit fee</th>
+        <th>{i18n`# Coins`}</th>
+        <th>{i18n`Value`}</th>
+        <th>{i18n`Withdraw Fee`}</th>
+        <th>{i18n`Refresh Fee`}</th>
+        <th>{i18n`Deposit Fee`}</th>
         </thead>
         <tbody>
         {uniq.map(row)}
@@ -143,7 +143,7 @@ function WithdrawFee(props: {reserveCreationInfo: ReserveCreationInfo|null}): JS
   if (props.reserveCreationInfo) {
     let {overhead, withdrawFee} = props.reserveCreationInfo;
     let totalCost = Amounts.add(overhead, withdrawFee).amount;
-    return <p>Withdraw fees: {amountToPretty(totalCost)}</p>;
+    return <p>{i18n`Withdraw fees:`} {amountToPretty(totalCost)}</p>;
   }
   return <p />;
 }
@@ -177,7 +177,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
       return (
         <button className="linky"
                 onClick={() => this.detailCollapsed(false)}>
-          view fee structure / select different exchange provider
+          {i18n`view fee structure / select different exchange provider`}
         </button>
       );
     }
@@ -191,7 +191,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
                onInput={(e) => this.onUrlChanged((e.target as HTMLInputElement).value)}/>
         <br />
         {this.renderStatus()}
-        <h2>Detailed Fee Structure</h2>
+        <h2>{i18n`Detailed Fee Structure`}</h2>
         {renderReserveCreationDetails(this.reserveCreationInfo())}
       </div>)
   }
@@ -208,33 +208,35 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
   renderFeeStatus() {
     if (this.reserveCreationInfo()) {
       return (
-        <p>
+        <i18n.Translate wrap="p">
           The exchange provider will charge
           {" "}
-          {this.renderFee()}
+          <span>{this.renderFee()}</span>
           {" "}
           in fees.
-        </p>
+        </i18n.Translate>
       );
     }
     if (this.url() && !this.statusString()) {
       let shortName = URI(this.url()!).host();
-      return <p>
-        Waiting for a response from
-        {" "}
-        <em>{shortName}</em>
-      </p>;
+      return (
+        <i18n.Translate wrap="p">
+          Waiting for a response from
+          {" "}
+          <em>{shortName}</em>
+        </i18n.Translate>
+      );
     }
     if (this.statusString()) {
       return (
         <p>
-          <strong style={{color: "red"}}>A problem occured, see below.</strong>
+          <strong style={{color: "red"}}>{i18n`A problem occured, see below.`}</strong>
         </p>
       );
     }
     return (
       <p>
-        Information about fees will be available when an exchange provider is selected.
+        {i18n`Information about fees will be available when an exchange provider is selected.`}
       </p>
     );
   }
@@ -242,16 +244,16 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
   render(): JSX.Element {
     return (
       <div>
-        <p>
+        <i18n.Translate wrap="p">
           {"You are about to withdraw "}
           <strong>{amountToPretty(this.props.amount)}</strong>
           {" from your bank account into your wallet."}
-        </p>
+        </i18n.Translate>
         {this.renderFeeStatus()}
         <button className="accept"
                 disabled={this.reserveCreationInfo() == null}
                 onClick={() => this.confirmReserve()}>
-          Accept fees and withdraw
+          {i18n`Accept fees and withdraw`}
         </button>
         <br/>
         {this.renderAdvanced()}
@@ -340,8 +342,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
       } else {
         this.reset();
         this.statusString(
-          `Oops, something went wrong.` +
-          `The wallet responded with error status (${rawResp.error}).`);
+          i18n`Oops, something went wrong. The wallet responded with error status (${rawResp.error}).`);
         this.detailCollapsed(false);
       }
     };
@@ -367,7 +368,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
     if (this.statusString()) {
       return <p><strong style={{color: "red"}}>{this.statusString()}</strong></p>;
     } else if (!this.reserveCreationInfo()) {
-      return <p>Checking URL, please wait ...</p>;
+      return <p>{i18n`Checking URL, please wait ...`}</p>;
     }
     return "";
   }
@@ -381,7 +382,7 @@ export async function main() {
     try {
       amount = AmountJson.checked(JSON.parse(query.amount));
     } catch (e) {
-      throw Error(`Can't parse amount: ${e.message}`);
+      throw Error(i18n`Can't parse amount: ${e.message}`);
     }
     const callback_url = query.callback_url;
     const bank_url = query.bank_url;
@@ -389,7 +390,7 @@ export async function main() {
     try {
       wt_types = JSON.parse(query.wt_types);
     } catch (e) {
-      throw Error(`Can't parse wire_types: ${e.message}`);
+      throw Error(i18n`Can't parse wire_types: ${e.message}`);
     }
 
     const suggestedExchangeUrl = await getSuggestedExchange(amount.currency);
@@ -406,7 +407,7 @@ export async function main() {
   } catch (e) {
     // TODO: provide more context information, maybe factor it out into a
     // TODO:generic error reporting function or component.
-    document.body.innerText = `Fatal error: "${e.message}".`;
+    document.body.innerText = i18n`Fatal error: "${e.message}".`;
     console.error(`got error "${e.message}"`, e);
   }
 }