modularize i18n

7 files changed, 27 insertions, 47 deletions

diff --git a/src/pages/confirm-contract.html b/src/pages/confirm-contract.html
index 261609d1c..c42479c29 100644
--- a/src/pages/confirm-contract.html
+++ b/src/pages/confirm-contract.html
@@ -12,10 +12,8 @@
   <script src="/src/vendor/URI.js"></script>
   <script src="/src/vendor/react.js"></script>
   <script src="/src/vendor/react-dom.js"></script>
+
   <script src="/src/vendor/system-csp-production.src.js"></script>
-  <!-- <script src="/src/vendor/jed.js"></script> -->
-  <script src="/src/i18n.js"></script>
-  <script src="/src/i18n/strings.js"></script>
   <script src="/src/moduleTrampoline.js"></script>
 
   <style>
diff --git a/src/pages/confirm-contract.tsx b/src/pages/confirm-contract.tsx
index 2ce3b0616..3a0712a8c 100644
--- a/src/pages/confirm-contract.tsx
+++ b/src/pages/confirm-contract.tsx
@@ -28,6 +28,7 @@ import {Contract, AmountJson, ExchangeRecord} from "src/types";
 import {OfferRecord} from "src/wallet";
 import {renderContract, prettyAmount} from "src/renderHtml";
 import {getExchanges} from "src/wxApi";
+import * as i18n from "src/i18n";
 
 
 interface DetailState {
@@ -72,12 +73,12 @@ class Details extends React.Component<DetailProps, DetailState> {
             show less details
           </button>
           <div>
-            {i18n`Accepted exchanges:`}
+            {i18n.str`Accepted exchanges:`}
             <ul>
               {this.props.contract.exchanges.map(
                 e => <li>{`${e.url}: ${e.master_pub}`}</li>)}
             </ul>
-            {i18n`Exchanges in the wallet:`}
+            {i18n.str`Exchanges in the wallet:`}
             <ul>
               {(this.props.exchanges || []).map(
                 (e: ExchangeRecord) =>
@@ -153,8 +154,8 @@ class ContractPrompt extends React.Component<ContractPromptProps, ContractPrompt
         console.log("check-pay error", JSON.stringify(resp));
         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 msgInsufficient = i18n.str`You have insufficient funds of the requested currency in your wallet.`;
+            let msgNoMatch = i18n.str`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.html b/src/pages/confirm-create-reserve.html
index b679de9c9..341b786d8 100644
--- a/src/pages/confirm-create-reserve.html
+++ b/src/pages/confirm-create-reserve.html
@@ -10,11 +10,6 @@
   <script src="/src/vendor/react.js"></script>
   <script src="/src/vendor/react-dom.js"></script>
 
-  <!-- i18n -->
-  <script src="/src/vendor/jed.js"></script>
-  <script src="/src/i18n.js"></script>
-  <script src="/src/i18n/strings.js"></script>
-
   <!-- module loading -->
   <script src="/src/vendor/system-csp-production.src.js"></script>
   <script src="/src/moduleTrampoline.js"></script>
diff --git a/src/pages/confirm-create-reserve.tsx b/src/pages/confirm-create-reserve.tsx
index 1ac56a8d0..da86729d3 100644
--- a/src/pages/confirm-create-reserve.tsx
+++ b/src/pages/confirm-create-reserve.tsx
@@ -30,6 +30,7 @@ import {
 } from "src/types";
 import {getReserveCreationInfo} from "src/wxApi";
 import {ImplicitStateComponent, StateHolder} from "src/components";
+import * as i18n from "src/i18n";
 
 "use strict";
 
@@ -102,15 +103,15 @@ function renderReserveCreationDetails(rci: ReserveCreationInfo|null) {
 
   return (
     <div>
-      <p>{i18n`Withdrawal fees: ${withdrawFeeStr}`}</p>
-      <p>{i18n`Rounding loss: ${overheadStr}`}</p>
+      <p>{i18n.str`Withdrawal fees: ${withdrawFeeStr}`}</p>
+      <p>{i18n.str`Rounding loss: ${overheadStr}`}</p>
       <table>
         <thead>
-        <th>{i18n`# Coins`}</th>
-        <th>{i18n`Value`}</th>
-        <th>{i18n`Withdraw Fee`}</th>
-        <th>{i18n`Refresh Fee`}</th>
-        <th>{i18n`Deposit Fee`}</th>
+        <th>{i18n.str`# Coins`}</th>
+        <th>{i18n.str`Value`}</th>
+        <th>{i18n.str`Withdraw Fee`}</th>
+        <th>{i18n.str`Refresh Fee`}</th>
+        <th>{i18n.str`Deposit Fee`}</th>
         </thead>
         <tbody>
         {uniq.map(row)}
@@ -143,7 +144,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>{i18n`Withdraw fees:`} {amountToPretty(totalCost)}</p>;
+    return <p>{i18n.str`Withdraw fees:`} {amountToPretty(totalCost)}</p>;
   }
   return <p />;
 }
@@ -178,7 +179,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
       return (
         <button className="linky"
                 onClick={() => this.detailCollapsed(false)}>
-          {i18n`view fee structure / select different exchange provider`}
+          {i18n.str`view fee structure / select different exchange provider`}
         </button>
       );
     }
@@ -192,7 +193,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
                onInput={(e) => this.onUrlChanged((e.target as HTMLInputElement).value)}/>
         <br />
         {this.renderStatus()}
-        <h2>{i18n`Detailed Fee Structure`}</h2>
+        <h2>{i18n.str`Detailed Fee Structure`}</h2>
         {renderReserveCreationDetails(this.reserveCreationInfo())}
       </div>)
   }
@@ -231,13 +232,13 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
     if (this.statusString()) {
       return (
         <p>
-          <strong style={{color: "red"}}>{i18n`A problem occured, see below.`}</strong>
+          <strong style={{color: "red"}}>{i18n.str`A problem occured, see below.`}</strong>
         </p>
       );
     }
     return (
       <p>
-        {i18n`Information about fees will be available when an exchange provider is selected.`}
+        {i18n.str`Information about fees will be available when an exchange provider is selected.`}
       </p>
     );
   }
@@ -254,7 +255,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
         <button className="accept"
                 disabled={this.reserveCreationInfo() == null}
                 onClick={() => this.confirmReserve()}>
-          {i18n`Accept fees and withdraw`}
+          {i18n.str`Accept fees and withdraw`}
         </button>
         <br/>
         {this.renderAdvanced()}
@@ -276,7 +277,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
   async forceReserveUpdate() {
     this.reserveCreationInfo(null);
     if (!this.url()) {
-      this.statusString(i18n`Error: URL is empty`);
+      this.statusString(i18n.str`Error: URL is empty`);
       this.detailCollapsed(false);
       return;
     }
@@ -284,7 +285,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
     this.statusString(null);
     let parsedUrl = URI(this.url()!);
     if (parsedUrl.is("relative")) {
-      this.statusString(i18n`Error: URL may not be relative`);
+      this.statusString(i18n.str`Error: URL may not be relative`);
       this.detailCollapsed(false);
       return;
     }
@@ -344,7 +345,7 @@ class ExchangeSelection extends ImplicitStateComponent<ExchangeSelectionProps> {
       } else {
         this.reset();
         this.statusString(
-          i18n`Oops, something went wrong. The wallet responded with error status (${rawResp.error}).`);
+          i18n.str`Oops, something went wrong. The wallet responded with error status (${rawResp.error}).`);
         this.detailCollapsed(false);
       }
     };
@@ -370,7 +371,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>{i18n`Checking URL, please wait ...`}</p>;
+      return <p>{i18n.str`Checking URL, please wait ...`}</p>;
     }
     return "";
   }
@@ -384,7 +385,7 @@ export async function main() {
     try {
       amount = AmountJson.checked(JSON.parse(query.amount));
     } catch (e) {
-      throw Error(i18n`Can't parse amount: ${e.message}`);
+      throw Error(i18n.str`Can't parse amount: ${e.message}`);
     }
     const callback_url = query.callback_url;
     const bank_url = query.bank_url;
@@ -392,7 +393,7 @@ export async function main() {
     try {
       wt_types = JSON.parse(query.wt_types);
     } catch (e) {
-      throw Error(i18n`Can't parse wire_types: ${e.message}`);
+      throw Error(i18n.str`Can't parse wire_types: ${e.message}`);
     }
 
     const suggestedExchangeUrl = await getSuggestedExchange(amount.currency);
@@ -409,7 +410,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 = i18n`Fatal error: "${e.message}".`;
+    document.body.innerText = i18n.str`Fatal error: "${e.message}".`;
     console.error(`got error "${e.message}"`, e);
   }
 }
diff --git a/src/pages/error.html b/src/pages/error.html
index 8d6b3e153..7e6103c0e 100644
--- a/src/pages/error.html
+++ b/src/pages/error.html
@@ -13,11 +13,6 @@
 	<script src="/src/vendor/react.js"></script>
 	<script src="/src/vendor/react-dom.js"></script>
 
-	<!-- i18n -->
-	<script src="/src/vendor/jed.js"></script>
-	<script src="/src/i18n.js"></script>
-	<script src="/src/i18n/strings.js"></script>
-
 	<script src="/src/vendor/system-csp-production.src.js"></script>
 	<script src="/src/moduleTrampoline.js"></script>
 
diff --git a/src/pages/logs.html b/src/pages/logs.html
index 9178298f8..866b434f8 100644
--- a/src/pages/logs.html
+++ b/src/pages/logs.html
@@ -13,11 +13,6 @@
 	<script src="/src/vendor/react.js"></script>
 	<script src="/src/vendor/react-dom.js"></script>
 
-	<!-- i18n -->
-	<script src="/src/vendor/jed.js"></script>
-	<script src="/src/i18n.js"></script>
-	<script src="/src/i18n/strings.js"></script>
-
 	<script src="/src/vendor/system-csp-production.src.js"></script>
 	<script src="/src/moduleTrampoline.js"></script>
 
diff --git a/src/pages/tree.html b/src/pages/tree.html
index 4be7a5cdc..7ff4295a0 100644
--- a/src/pages/tree.html
+++ b/src/pages/tree.html
@@ -13,11 +13,6 @@
 	<script src="/src/vendor/react.js"></script>
 	<script src="/src/vendor/react-dom.js"></script>
 
-	<!-- i18n -->
-	<script src="/src/vendor/jed.js"></script>
-	<script src="/src/i18n.js"></script>
-	<script src="/src/i18n/strings.js"></script>
-
 	<script src="/src/vendor/system-csp-production.src.js"></script>
 	<script src="/src/moduleTrampoline.js"></script>