From d57b6a4bcc595aee990b8e1c63e786e7796b737b Mon Sep 17 00:00:00 2001
From: Florian Dold <florian.dold@gmail.com>
Date: Sun, 27 Nov 2016 22:13:24 +0100
Subject: modularize i18n

---
 src/i18n.tsx                          | 120 ++++++++++------------------------
 src/i18n/de.po                        | 118 +++++++++++++++++----------------
 src/i18n/en-US.po                     | 106 +++++++++++++++++-------------
 src/i18n/fr.po                        | 106 +++++++++++++++++-------------
 src/i18n/it.po                        | 106 +++++++++++++++++-------------
 src/i18n/strings-prelude              |  17 +++++
 src/i18n/strings-prelude.js           |   3 -
 src/i18n/strings.ts                   |  21 ++++++
 src/i18n/taler-wallet-webex.pot       | 106 +++++++++++++++++-------------
 src/pages/confirm-contract.html       |   4 +-
 src/pages/confirm-contract.tsx        |   9 +--
 src/pages/confirm-create-reserve.html |   5 --
 src/pages/confirm-create-reserve.tsx  |  41 ++++++------
 src/pages/error.html                  |   5 --
 src/pages/logs.html                   |   5 --
 src/pages/tree.html                   |   5 --
 src/popup/popup.html                  |   6 +-
 src/popup/popup.tsx                   |  19 +++---
 src/renderHtml.tsx                    |  11 ++--
 src/vendor/jed.d.ts                   |  13 ++++
 20 files changed, 426 insertions(+), 400 deletions(-)
 create mode 100644 src/i18n/strings-prelude
 delete mode 100644 src/i18n/strings-prelude.js
 create mode 100644 src/i18n/strings.ts
 create mode 100644 src/vendor/jed.d.ts

(limited to 'src')

diff --git a/src/i18n.tsx b/src/i18n.tsx
index 443d3997a..d03fd52ef 100644
--- a/src/i18n.tsx
+++ b/src/i18n.tsx
@@ -16,26 +16,26 @@
 
 "use strict";
 
-document.addEventListener(
-  "DOMContentLoaded",
-  function () {
-    try {
-      document.body.lang = chrome.i18n.getUILanguage();
-    } catch (e) {
-      // chrome.* not available?
-    }
-  });
+import {default as Jed} from "src/vendor/jed";
+import {strings} from "src/i18n/strings";
 
-declare var i18n: any;
+console.log("jed:", Jed);
 
 /**
  * Information about the last two i18n results, used by plural()
  * 2-element array, each element contains { stringFound: boolean, pluralValue: number }
  */
-var i18nResult = [] as any;
+const i18nResult = [] as any;
 
-const JedModule: any = (window as any)["Jed"];
-var jed: any;
+let lang: string;
+try {
+  lang = chrome.i18n.getUILanguage();
+} catch (e) {
+  lang = "en";
+  console.warn("i18n default language not available");
+}
+
+let jed = new Jed(strings[lang]);
 
 
 class PluralNumber {
@@ -55,28 +55,10 @@ class PluralNumber {
 }
 
 
-/**
- * Initialize Jed
- */
-function init () {
-  if ("object" === typeof jed) {
-    return;
-  }
-  if ("function" !== typeof JedModule) {
-    return;
-  }
-  if (!(i18n.lang in i18n.strings)) {
-    i18n.lang = "en-US";
-    return;
-  }
-  jed = new JedModule(i18n.strings[i18n.lang]);
-}
-
-
 /**
  * Convert template strings to a msgid
  */
-function toI18nString(strings: string[]) {
+function toI18nString(strings: ReadonlyArray<string>) {
   let str = "";
   for (let i = 0; i < strings.length; i++) {
     str += strings[i];
@@ -113,7 +95,7 @@ function getPluralValue (values: any) {
 function setI18nResult (i18nString: string, pluralValue: number) {
   i18nResult[1] = i18nResult[0];
   i18nResult[0] = {
-    stringFound: i18nString in i18n.strings[i18n.lang].locale_data[i18n.lang],
+    stringFound: i18nString in strings[lang].locale_data[lang],
     pluralValue: pluralValue
   };
 }
@@ -122,35 +104,21 @@ function setI18nResult (i18nString: string, pluralValue: number) {
 /**
  * Internationalize a string template with arbitrary serialized values.
  */
-var i18n = (function i18n(strings: string[], ...values: any[]) {
-  init();
-  //console.log('i18n:', strings, values);
-  if ("object" !== typeof jed) {
-    // Fallback implementation in case i18n lib is not there
-    return String.raw(strings as any, ...values);
-  }
-
-  let str = toI18nString (strings);
-  let n = getPluralValue (values);
+export function str(strings: TemplateStringsArray, ...values: any[]) {
+  let str = toI18nString(strings);
+  let n = getPluralValue(values);
   let tr = jed.translate(str).ifPlural(n, str).fetch(...values);
 
-  setI18nResult (str, n);
+  setI18nResult(str, n);
   return tr;
-}) as any;
-
-try {
-  i18n.lang = chrome.i18n.getUILanguage();
-} catch (e) {
-  console.warn("i18n default language not available");
 }
-i18n.strings = {};
 
 
 /**
  * Pluralize based on first numeric parameter in the template.
  * @todo The plural argument is used for extraction by pogen.js
  */
-i18n.plural = function (singular: any, plural: any) {
+function plural(singular: any, plural: any) {
   if (i18nResult[1].stringFound) { // string found in translation file?
     // 'singular' has the correctly translated & pluralized text
     return singular;
@@ -167,7 +135,7 @@ interface TranslateSwitchProps {
 /**
  * Return a number that is used to determine the plural form for a template.
  */
-i18n.number = function (n : number) {
+function number(n : number) {
   return new PluralNumber (n);
 };
 
@@ -196,12 +164,9 @@ interface TranslateProps {
   wrapProps?: any;
 }
 
-i18n.Translate = class extends React.Component<TranslateProps,void> {
+
+export class Translate extends React.Component<TranslateProps,void> {
   render(): JSX.Element {
-    init();
-    if (typeof jed !== "object") {
-      return <div>{this.props.children}</div>;
-    }
     let s = stringifyChildren(this.props.children);
     let tr = jed.ngettext(s, s, 1).split(/%(\d+)\$s/).filter((e: any, i: number) => i % 2 == 0);
     let childArray = React.Children.toArray(this.props.children!);
@@ -231,17 +196,18 @@ i18n.Translate = class extends React.Component<TranslateProps,void> {
   }
 }
 
-i18n.TranslateSwitch = class extends React.Component<TranslateSwitchProps,void>{
+
+export class TranslateSwitch extends React.Component<TranslateSwitchProps,void>{
   render(): JSX.Element {
     let singular: React.ReactElement<TranslationPluralProps> | undefined;
     let plural: React.ReactElement<TranslationPluralProps> | undefined;
     let children = this.props.children;
     if (children) {
       React.Children.forEach(children, (child: any) => {
-        if (child.type == i18n.TranslatePlural) {
+        if (child.type == TranslatePlural) {
           plural = child;
         }
-        if (child.type == i18n.TranslateSingular) {
+        if (child.type == TranslateSingular) {
           singular = child;
         }
       }); 
@@ -250,33 +216,22 @@ i18n.TranslateSwitch = class extends React.Component<TranslateSwitchProps,void>{
       console.error("translation not found");
       return React.createElement("span", {}, ["translation not found"]);
     }
-    init();
     singular.props.target = this.props.target;
     plural.props.target = this.props.target;;
-    if (typeof "jed" !== "object") {
-      if (this.props.target == 1) {
-        return singular;
-      } else {
-        return plural;
-      }
-    } else {
-      // We're looking up the translation based on the
-      // singular, even if we must use the plural form.
-      return singular;
-    }
+    // We're looking up the translation based on the
+    // singular, even if we must use the plural form.
+    return singular;
   }
 }
 
+
 interface TranslationPluralProps {
   target: number;
 }
 
-class TranslatePlural extends React.Component<TranslationPluralProps,void> {
+
+export class TranslatePlural extends React.Component<TranslationPluralProps,void> {
   render(): JSX.Element {
-    init();
-    if (typeof jed !== "object") {
-      return <div>{this.props.children}</div>;
-    }
     let s = stringifyChildren(this.props.children);
     let tr = jed.ngettext(s, s, 1).split(/%(\d+)\$s/).filter((e: any, i: number) => i % 2 == 0);
     let childArray = React.Children.toArray(this.props.children!);
@@ -303,14 +258,9 @@ class TranslatePlural extends React.Component<TranslationPluralProps,void> {
   }
 }
 
-i18n.TranslatePlural = TranslatePlural;
 
-class TranslateSingular extends React.Component<TranslationPluralProps,void> {
+export class TranslateSingular extends React.Component<TranslationPluralProps,void> {
   render(): JSX.Element {
-    init();
-    if (typeof jed !== "object") {
-      return <div>{this.props.children}</div>;
-    }
     let s = stringifyChildren(this.props.children);
     let tr = jed.ngettext(s, s, 1).split(/%(\d+)\$s/).filter((e: any, i: number) => i % 2 == 0);
     let childArray = React.Children.toArray(this.props.children!);
@@ -336,5 +286,3 @@ class TranslateSingular extends React.Component<TranslationPluralProps,void> {
     return <div>{result}</div>;
   }
 }
-
-i18n.TranslateSingular = TranslateSingular;
diff --git a/src/i18n/de.po b/src/i18n/de.po
index e1486d233..df5e3c08e 100644
--- a/src/i18n/de.po
+++ b/src/i18n/de.po
@@ -27,27 +27,27 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: src/pages/confirm-contract.tsx:61
+#: src/pages/confirm-contract.tsx:62
 #, c-format
 msgid "show more details\n"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:75
+#: src/pages/confirm-contract.tsx:76
 #, c-format
 msgid "Accepted exchanges:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:80
+#: src/pages/confirm-contract.tsx:81
 #, c-format
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:156
+#: src/pages/confirm-contract.tsx:157
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:157
+#: src/pages/confirm-contract.tsx:158
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "
@@ -55,196 +55,203 @@ msgid ""
 "wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:105
+#: src/pages/confirm-create-reserve.tsx:106
 #, fuzzy, c-format
 msgid "Withdrawal fees: %1$s"
 msgstr "Abheben bei %1$s"
 
-#: src/pages/confirm-create-reserve.tsx:106
+#: src/pages/confirm-create-reserve.tsx:107
 #, c-format
 msgid "Rounding loss: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:109
+#: src/pages/confirm-create-reserve.tsx:110
 #, c-format
 msgid "# Coins"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:110
+#: src/pages/confirm-create-reserve.tsx:111
 #, c-format
 msgid "Value"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:111
+#: src/pages/confirm-create-reserve.tsx:112
 #, fuzzy, c-format
 msgid "Withdraw Fee"
 msgstr "Abheben bei %1$s"
 
-#: src/pages/confirm-create-reserve.tsx:112
+#: src/pages/confirm-create-reserve.tsx:113
 #, c-format
 msgid "Refresh Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:113
+#: src/pages/confirm-create-reserve.tsx:114
 #, c-format
 msgid "Deposit Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:146
+#: src/pages/confirm-create-reserve.tsx:147
 #, fuzzy, c-format
 msgid "Withdraw fees:"
 msgstr "Abheben bei %1$s"
 
-#: src/pages/confirm-create-reserve.tsx:180
+#: src/pages/confirm-create-reserve.tsx:182
 #, c-format
 msgid "view fee structure / select different exchange provider"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:194
+#: src/pages/confirm-create-reserve.tsx:196
 #, c-format
 msgid "Detailed Fee Structure"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:210
+#: src/pages/confirm-create-reserve.tsx:212
 #, c-format
 msgid ""
 "The exchange provider will charge\n"
 " %1$s in fees.\n"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:222
+#: src/pages/confirm-create-reserve.tsx:224
 #, c-format
 msgid ""
 "Waiting for a response from\n"
 " %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:233
+#: src/pages/confirm-create-reserve.tsx:235
 #, c-format
 msgid "A problem occured, see below."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:239
+#: src/pages/confirm-create-reserve.tsx:241
 #, c-format
 msgid ""
 "Information about fees will be available when an exchange provider is "
 "selected."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:247
+#: src/pages/confirm-create-reserve.tsx:249
 #, c-format
 msgid "You are about to withdraw %1$s from your bank account into your wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:256
+#: src/pages/confirm-create-reserve.tsx:258
 #, c-format
 msgid "Accept fees and withdraw"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:278
+#: src/pages/confirm-create-reserve.tsx:280
 #, c-format
 msgid "Error: URL is empty"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:286
+#: src/pages/confirm-create-reserve.tsx:288
 #, c-format
 msgid "Error: URL may not be relative"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:344
+#: src/pages/confirm-create-reserve.tsx:347
 #, c-format
 msgid ""
 "Oops, something went wrong. The wallet responded with error status (%1$s)."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:371
+#: src/pages/confirm-create-reserve.tsx:374
 #, c-format
 msgid "Checking URL, please wait ..."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:385
+#: src/pages/confirm-create-reserve.tsx:388
 #, c-format
 msgid "Can't parse amount: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:393
+#: src/pages/confirm-create-reserve.tsx:396
 #, c-format
 msgid "Can't parse wire_types: %1$s"
 msgstr ""
 
 #. TODO:generic error reporting function or component.
-#: src/pages/confirm-create-reserve.tsx:410
+#: src/pages/confirm-create-reserve.tsx:413
 #, c-format
 msgid "Fatal error: \"%1$s\"."
 msgstr ""
 
-#: src/popup/popup.tsx:173
+#: src/popup/popup.tsx:172
 #, c-format
 msgid "Balance"
 msgstr "Saldo"
 
-#: src/popup/popup.tsx:176
+#: src/popup/popup.tsx:175
 #, c-format
 msgid "History"
 msgstr "Verlauf"
 
-#: src/popup/popup.tsx:179
+#: src/popup/popup.tsx:178
 #, c-format
 msgid "Debug"
 msgstr "Debug"
 
-#: src/popup/popup.tsx:239
+#: src/popup/popup.tsx:238
 #, c-format
 msgid "help"
 msgstr ""
 
-#: src/popup/popup.tsx:244
+#: src/popup/popup.tsx:243
 #, fuzzy, c-format
 msgid ""
 "You have no balance to show. Need some\n"
 " %1$s getting started?\n"
 msgstr "Sie haben kein Digitalgeld. Wollen Sie %1$s? abheben?"
 
-#: src/popup/popup.tsx:261
+#: src/popup/popup.tsx:260
 #, c-format
 msgid "%1$s incoming\n"
 msgstr ""
 
-#: src/popup/popup.tsx:274
+#: src/popup/popup.tsx:273
 #, c-format
 msgid "%1$s being spent\n"
 msgstr ""
 
-#: src/popup/popup.tsx:300
+#: src/popup/popup.tsx:299
 #, c-format
 msgid "Error: could not retrieve balance information."
 msgstr ""
 
-#: src/popup/popup.tsx:340
+#: src/popup/popup.tsx:337
 #, fuzzy, c-format
-msgid "Bank requested reserve (%1$s) for %2$s."
+msgid "Bank requested reserve (%1$s) for%2$s.\n"
 msgstr "Bank bestätig anlegen der Reserve (%1$s) bei %2$s"
 
-#: src/popup/popup.tsx:351
+#: src/popup/popup.tsx:346
 #, fuzzy, c-format
-msgid "Started to withdraw %1$s from %2$s (%3$s)."
+msgid ""
+"Started to withdraw\n"
+" %1$s from%2$s(%3$s).\n"
 msgstr "Reserve (%1$s) mit %2$s bei %3$s erzeugt"
 
-#: src/popup/popup.tsx:361
+#: src/popup/popup.tsx:358
 #, c-format
-msgid "Merchant %1$s offered contract %2$s."
+msgid "Merchant%1$soffered contract%2$s;\n"
 msgstr ""
 
-#: src/popup/popup.tsx:371
+#: src/popup/popup.tsx:368
 #, fuzzy, c-format
-msgid "Withdrew %1$s from %2$s (%3$s)."
+msgid "Withdrew%1$sfrom%2$s(%3$s).\n"
 msgstr "Reserve (%1$s) mit %2$s bei %3$s erzeugt"
 
-#: src/popup/popup.tsx:382
+#: src/popup/popup.tsx:379
 #, fuzzy, c-format
-msgid "Paid %1$s to merchant %2$s.  (%3$s)"
+msgid "Paid%1$sto merchant%2$s.  (%3$s)\n"
 msgstr "Reserve (%1$s) mit %2$s bei %3$s erzeugt"
 
+#: src/popup/popup.tsx:386
+#, c-format
+msgid "Unknown event (%1$s)"
+msgstr ""
+
 #: src/popup/popup.tsx:429
 #, c-format
 msgid "Error: could not retrieve event history"
@@ -255,20 +262,19 @@ msgstr ""
 msgid "Your wallet has no events recorded."
 msgstr "Ihre Geldbörse verzeichnet keine Vorkommnisse."
 
-#: src/renderHtml.tsx:42
+#: src/renderHtml.tsx:38
+#, fuzzy, c-format
+msgid "The merchant%1$swants to enter a contract over%2$s with you.\n"
+msgstr ""
+"%1$s\n"
+"               möchte einen Vertrag über %2$s\n"
+"               mit Ihnen abschließen."
+
+#: src/renderHtml.tsx:43
 #, fuzzy, c-format
 msgid "You are about to purchase:"
 msgstr "Sie sind dabei, Folgendes zu kaufen:"
 
-#~ msgid ""
-#~ "%1$s\n"
-#~ "               wants to enter a contract over %2$s\n"
-#~ "               with you."
-#~ msgstr ""
-#~ "%1$s\n"
-#~ "               möchte einen Vertrag über %2$s\n"
-#~ "               mit Ihnen abschließen."
-
 #~ msgid "Confirm Payment"
 #~ msgstr "Bezahlung bestätigen"
 
diff --git a/src/i18n/en-US.po b/src/i18n/en-US.po
index 7ff886a01..fae9d5336 100644
--- a/src/i18n/en-US.po
+++ b/src/i18n/en-US.po
@@ -27,27 +27,27 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: src/pages/confirm-contract.tsx:61
+#: src/pages/confirm-contract.tsx:62
 #, c-format
 msgid "show more details\n"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:75
+#: src/pages/confirm-contract.tsx:76
 #, c-format
 msgid "Accepted exchanges:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:80
+#: src/pages/confirm-contract.tsx:81
 #, c-format
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:156
+#: src/pages/confirm-contract.tsx:157
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:157
+#: src/pages/confirm-contract.tsx:158
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "
@@ -55,194 +55,201 @@ msgid ""
 "wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:105
+#: src/pages/confirm-create-reserve.tsx:106
 #, c-format
 msgid "Withdrawal fees: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:106
+#: src/pages/confirm-create-reserve.tsx:107
 #, c-format
 msgid "Rounding loss: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:109
+#: src/pages/confirm-create-reserve.tsx:110
 #, c-format
 msgid "# Coins"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:110
+#: src/pages/confirm-create-reserve.tsx:111
 #, c-format
 msgid "Value"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:111
+#: src/pages/confirm-create-reserve.tsx:112
 #, c-format
 msgid "Withdraw Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:112
+#: src/pages/confirm-create-reserve.tsx:113
 #, c-format
 msgid "Refresh Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:113
+#: src/pages/confirm-create-reserve.tsx:114
 #, c-format
 msgid "Deposit Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:146
+#: src/pages/confirm-create-reserve.tsx:147
 #, c-format
 msgid "Withdraw fees:"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:180
+#: src/pages/confirm-create-reserve.tsx:182
 #, c-format
 msgid "view fee structure / select different exchange provider"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:194
+#: src/pages/confirm-create-reserve.tsx:196
 #, c-format
 msgid "Detailed Fee Structure"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:210
+#: src/pages/confirm-create-reserve.tsx:212
 #, c-format
 msgid ""
 "The exchange provider will charge\n"
 " %1$s in fees.\n"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:222
+#: src/pages/confirm-create-reserve.tsx:224
 #, c-format
 msgid ""
 "Waiting for a response from\n"
 " %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:233
+#: src/pages/confirm-create-reserve.tsx:235
 #, c-format
 msgid "A problem occured, see below."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:239
+#: src/pages/confirm-create-reserve.tsx:241
 #, c-format
 msgid ""
 "Information about fees will be available when an exchange provider is "
 "selected."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:247
+#: src/pages/confirm-create-reserve.tsx:249
 #, c-format
 msgid "You are about to withdraw %1$s from your bank account into your wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:256
+#: src/pages/confirm-create-reserve.tsx:258
 #, c-format
 msgid "Accept fees and withdraw"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:278
+#: src/pages/confirm-create-reserve.tsx:280
 #, c-format
 msgid "Error: URL is empty"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:286
+#: src/pages/confirm-create-reserve.tsx:288
 #, c-format
 msgid "Error: URL may not be relative"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:344
+#: src/pages/confirm-create-reserve.tsx:347
 #, c-format
 msgid ""
 "Oops, something went wrong. The wallet responded with error status (%1$s)."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:371
+#: src/pages/confirm-create-reserve.tsx:374
 #, c-format
 msgid "Checking URL, please wait ..."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:385
+#: src/pages/confirm-create-reserve.tsx:388
 #, c-format
 msgid "Can't parse amount: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:393
+#: src/pages/confirm-create-reserve.tsx:396
 #, c-format
 msgid "Can't parse wire_types: %1$s"
 msgstr ""
 
 #. TODO:generic error reporting function or component.
-#: src/pages/confirm-create-reserve.tsx:410
+#: src/pages/confirm-create-reserve.tsx:413
 #, c-format
 msgid "Fatal error: \"%1$s\"."
 msgstr ""
 
-#: src/popup/popup.tsx:173
+#: src/popup/popup.tsx:172
 #, c-format
 msgid "Balance"
 msgstr ""
 
-#: src/popup/popup.tsx:176
+#: src/popup/popup.tsx:175
 #, c-format
 msgid "History"
 msgstr ""
 
-#: src/popup/popup.tsx:179
+#: src/popup/popup.tsx:178
 #, c-format
 msgid "Debug"
 msgstr ""
 
-#: src/popup/popup.tsx:239
+#: src/popup/popup.tsx:238
 #, c-format
 msgid "help"
 msgstr ""
 
-#: src/popup/popup.tsx:244
+#: src/popup/popup.tsx:243
 #, c-format
 msgid ""
 "You have no balance to show. Need some\n"
 " %1$s getting started?\n"
 msgstr ""
 
-#: src/popup/popup.tsx:261
+#: src/popup/popup.tsx:260
 #, c-format
 msgid "%1$s incoming\n"
 msgstr ""
 
-#: src/popup/popup.tsx:274
+#: src/popup/popup.tsx:273
 #, c-format
 msgid "%1$s being spent\n"
 msgstr ""
 
-#: src/popup/popup.tsx:300
+#: src/popup/popup.tsx:299
 #, c-format
 msgid "Error: could not retrieve balance information."
 msgstr ""
 
-#: src/popup/popup.tsx:340
+#: src/popup/popup.tsx:337
 #, c-format
-msgid "Bank requested reserve (%1$s) for %2$s."
+msgid "Bank requested reserve (%1$s) for%2$s.\n"
 msgstr ""
 
-#: src/popup/popup.tsx:351
+#: src/popup/popup.tsx:346
 #, c-format
-msgid "Started to withdraw %1$s from %2$s (%3$s)."
+msgid ""
+"Started to withdraw\n"
+" %1$s from%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:361
+#: src/popup/popup.tsx:358
 #, c-format
-msgid "Merchant %1$s offered contract %2$s."
+msgid "Merchant%1$soffered contract%2$s;\n"
 msgstr ""
 
-#: src/popup/popup.tsx:371
+#: src/popup/popup.tsx:368
 #, c-format
-msgid "Withdrew %1$s from %2$s (%3$s)."
+msgid "Withdrew%1$sfrom%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:382
+#: src/popup/popup.tsx:379
 #, c-format
-msgid "Paid %1$s to merchant %2$s.  (%3$s)"
+msgid "Paid%1$sto merchant%2$s.  (%3$s)\n"
+msgstr ""
+
+#: src/popup/popup.tsx:386
+#, c-format
+msgid "Unknown event (%1$s)"
 msgstr ""
 
 #: src/popup/popup.tsx:429
@@ -255,7 +262,12 @@ msgstr ""
 msgid "Your wallet has no events recorded."
 msgstr ""
 
-#: src/renderHtml.tsx:42
+#: src/renderHtml.tsx:38
+#, c-format
+msgid "The merchant%1$swants to enter a contract over%2$s with you.\n"
+msgstr ""
+
+#: src/renderHtml.tsx:43
 #, c-format
 msgid "You are about to purchase:"
 msgstr ""
diff --git a/src/i18n/fr.po b/src/i18n/fr.po
index 8c68a63f1..8bfdf57d0 100644
--- a/src/i18n/fr.po
+++ b/src/i18n/fr.po
@@ -27,27 +27,27 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: src/pages/confirm-contract.tsx:61
+#: src/pages/confirm-contract.tsx:62
 #, c-format
 msgid "show more details\n"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:75
+#: src/pages/confirm-contract.tsx:76
 #, c-format
 msgid "Accepted exchanges:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:80
+#: src/pages/confirm-contract.tsx:81
 #, c-format
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:156
+#: src/pages/confirm-contract.tsx:157
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:157
+#: src/pages/confirm-contract.tsx:158
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "
@@ -55,194 +55,201 @@ msgid ""
 "wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:105
+#: src/pages/confirm-create-reserve.tsx:106
 #, c-format
 msgid "Withdrawal fees: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:106
+#: src/pages/confirm-create-reserve.tsx:107
 #, c-format
 msgid "Rounding loss: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:109
+#: src/pages/confirm-create-reserve.tsx:110
 #, c-format
 msgid "# Coins"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:110
+#: src/pages/confirm-create-reserve.tsx:111
 #, c-format
 msgid "Value"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:111
+#: src/pages/confirm-create-reserve.tsx:112
 #, c-format
 msgid "Withdraw Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:112
+#: src/pages/confirm-create-reserve.tsx:113
 #, c-format
 msgid "Refresh Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:113
+#: src/pages/confirm-create-reserve.tsx:114
 #, c-format
 msgid "Deposit Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:146
+#: src/pages/confirm-create-reserve.tsx:147
 #, c-format
 msgid "Withdraw fees:"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:180
+#: src/pages/confirm-create-reserve.tsx:182
 #, c-format
 msgid "view fee structure / select different exchange provider"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:194
+#: src/pages/confirm-create-reserve.tsx:196
 #, c-format
 msgid "Detailed Fee Structure"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:210
+#: src/pages/confirm-create-reserve.tsx:212
 #, c-format
 msgid ""
 "The exchange provider will charge\n"
 " %1$s in fees.\n"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:222
+#: src/pages/confirm-create-reserve.tsx:224
 #, c-format
 msgid ""
 "Waiting for a response from\n"
 " %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:233
+#: src/pages/confirm-create-reserve.tsx:235
 #, c-format
 msgid "A problem occured, see below."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:239
+#: src/pages/confirm-create-reserve.tsx:241
 #, c-format
 msgid ""
 "Information about fees will be available when an exchange provider is "
 "selected."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:247
+#: src/pages/confirm-create-reserve.tsx:249
 #, c-format
 msgid "You are about to withdraw %1$s from your bank account into your wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:256
+#: src/pages/confirm-create-reserve.tsx:258
 #, c-format
 msgid "Accept fees and withdraw"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:278
+#: src/pages/confirm-create-reserve.tsx:280
 #, c-format
 msgid "Error: URL is empty"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:286
+#: src/pages/confirm-create-reserve.tsx:288
 #, c-format
 msgid "Error: URL may not be relative"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:344
+#: src/pages/confirm-create-reserve.tsx:347
 #, c-format
 msgid ""
 "Oops, something went wrong. The wallet responded with error status (%1$s)."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:371
+#: src/pages/confirm-create-reserve.tsx:374
 #, c-format
 msgid "Checking URL, please wait ..."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:385
+#: src/pages/confirm-create-reserve.tsx:388
 #, c-format
 msgid "Can't parse amount: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:393
+#: src/pages/confirm-create-reserve.tsx:396
 #, c-format
 msgid "Can't parse wire_types: %1$s"
 msgstr ""
 
 #. TODO:generic error reporting function or component.
-#: src/pages/confirm-create-reserve.tsx:410
+#: src/pages/confirm-create-reserve.tsx:413
 #, c-format
 msgid "Fatal error: \"%1$s\"."
 msgstr ""
 
-#: src/popup/popup.tsx:173
+#: src/popup/popup.tsx:172
 #, c-format
 msgid "Balance"
 msgstr ""
 
-#: src/popup/popup.tsx:176
+#: src/popup/popup.tsx:175
 #, c-format
 msgid "History"
 msgstr ""
 
-#: src/popup/popup.tsx:179
+#: src/popup/popup.tsx:178
 #, c-format
 msgid "Debug"
 msgstr ""
 
-#: src/popup/popup.tsx:239
+#: src/popup/popup.tsx:238
 #, c-format
 msgid "help"
 msgstr ""
 
-#: src/popup/popup.tsx:244
+#: src/popup/popup.tsx:243
 #, c-format
 msgid ""
 "You have no balance to show. Need some\n"
 " %1$s getting started?\n"
 msgstr ""
 
-#: src/popup/popup.tsx:261
+#: src/popup/popup.tsx:260
 #, c-format
 msgid "%1$s incoming\n"
 msgstr ""
 
-#: src/popup/popup.tsx:274
+#: src/popup/popup.tsx:273
 #, c-format
 msgid "%1$s being spent\n"
 msgstr ""
 
-#: src/popup/popup.tsx:300
+#: src/popup/popup.tsx:299
 #, c-format
 msgid "Error: could not retrieve balance information."
 msgstr ""
 
-#: src/popup/popup.tsx:340
+#: src/popup/popup.tsx:337
 #, c-format
-msgid "Bank requested reserve (%1$s) for %2$s."
+msgid "Bank requested reserve (%1$s) for%2$s.\n"
 msgstr ""
 
-#: src/popup/popup.tsx:351
+#: src/popup/popup.tsx:346
 #, c-format
-msgid "Started to withdraw %1$s from %2$s (%3$s)."
+msgid ""
+"Started to withdraw\n"
+" %1$s from%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:361
+#: src/popup/popup.tsx:358
 #, c-format
-msgid "Merchant %1$s offered contract %2$s."
+msgid "Merchant%1$soffered contract%2$s;\n"
 msgstr ""
 
-#: src/popup/popup.tsx:371
+#: src/popup/popup.tsx:368
 #, c-format
-msgid "Withdrew %1$s from %2$s (%3$s)."
+msgid "Withdrew%1$sfrom%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:382
+#: src/popup/popup.tsx:379
 #, c-format
-msgid "Paid %1$s to merchant %2$s.  (%3$s)"
+msgid "Paid%1$sto merchant%2$s.  (%3$s)\n"
+msgstr ""
+
+#: src/popup/popup.tsx:386
+#, c-format
+msgid "Unknown event (%1$s)"
 msgstr ""
 
 #: src/popup/popup.tsx:429
@@ -255,7 +262,12 @@ msgstr ""
 msgid "Your wallet has no events recorded."
 msgstr ""
 
-#: src/renderHtml.tsx:42
+#: src/renderHtml.tsx:38
+#, c-format
+msgid "The merchant%1$swants to enter a contract over%2$s with you.\n"
+msgstr ""
+
+#: src/renderHtml.tsx:43
 #, c-format
 msgid "You are about to purchase:"
 msgstr ""
diff --git a/src/i18n/it.po b/src/i18n/it.po
index 8c68a63f1..8bfdf57d0 100644
--- a/src/i18n/it.po
+++ b/src/i18n/it.po
@@ -27,27 +27,27 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: src/pages/confirm-contract.tsx:61
+#: src/pages/confirm-contract.tsx:62
 #, c-format
 msgid "show more details\n"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:75
+#: src/pages/confirm-contract.tsx:76
 #, c-format
 msgid "Accepted exchanges:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:80
+#: src/pages/confirm-contract.tsx:81
 #, c-format
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:156
+#: src/pages/confirm-contract.tsx:157
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:157
+#: src/pages/confirm-contract.tsx:158
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "
@@ -55,194 +55,201 @@ msgid ""
 "wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:105
+#: src/pages/confirm-create-reserve.tsx:106
 #, c-format
 msgid "Withdrawal fees: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:106
+#: src/pages/confirm-create-reserve.tsx:107
 #, c-format
 msgid "Rounding loss: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:109
+#: src/pages/confirm-create-reserve.tsx:110
 #, c-format
 msgid "# Coins"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:110
+#: src/pages/confirm-create-reserve.tsx:111
 #, c-format
 msgid "Value"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:111
+#: src/pages/confirm-create-reserve.tsx:112
 #, c-format
 msgid "Withdraw Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:112
+#: src/pages/confirm-create-reserve.tsx:113
 #, c-format
 msgid "Refresh Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:113
+#: src/pages/confirm-create-reserve.tsx:114
 #, c-format
 msgid "Deposit Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:146
+#: src/pages/confirm-create-reserve.tsx:147
 #, c-format
 msgid "Withdraw fees:"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:180
+#: src/pages/confirm-create-reserve.tsx:182
 #, c-format
 msgid "view fee structure / select different exchange provider"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:194
+#: src/pages/confirm-create-reserve.tsx:196
 #, c-format
 msgid "Detailed Fee Structure"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:210
+#: src/pages/confirm-create-reserve.tsx:212
 #, c-format
 msgid ""
 "The exchange provider will charge\n"
 " %1$s in fees.\n"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:222
+#: src/pages/confirm-create-reserve.tsx:224
 #, c-format
 msgid ""
 "Waiting for a response from\n"
 " %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:233
+#: src/pages/confirm-create-reserve.tsx:235
 #, c-format
 msgid "A problem occured, see below."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:239
+#: src/pages/confirm-create-reserve.tsx:241
 #, c-format
 msgid ""
 "Information about fees will be available when an exchange provider is "
 "selected."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:247
+#: src/pages/confirm-create-reserve.tsx:249
 #, c-format
 msgid "You are about to withdraw %1$s from your bank account into your wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:256
+#: src/pages/confirm-create-reserve.tsx:258
 #, c-format
 msgid "Accept fees and withdraw"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:278
+#: src/pages/confirm-create-reserve.tsx:280
 #, c-format
 msgid "Error: URL is empty"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:286
+#: src/pages/confirm-create-reserve.tsx:288
 #, c-format
 msgid "Error: URL may not be relative"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:344
+#: src/pages/confirm-create-reserve.tsx:347
 #, c-format
 msgid ""
 "Oops, something went wrong. The wallet responded with error status (%1$s)."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:371
+#: src/pages/confirm-create-reserve.tsx:374
 #, c-format
 msgid "Checking URL, please wait ..."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:385
+#: src/pages/confirm-create-reserve.tsx:388
 #, c-format
 msgid "Can't parse amount: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:393
+#: src/pages/confirm-create-reserve.tsx:396
 #, c-format
 msgid "Can't parse wire_types: %1$s"
 msgstr ""
 
 #. TODO:generic error reporting function or component.
-#: src/pages/confirm-create-reserve.tsx:410
+#: src/pages/confirm-create-reserve.tsx:413
 #, c-format
 msgid "Fatal error: \"%1$s\"."
 msgstr ""
 
-#: src/popup/popup.tsx:173
+#: src/popup/popup.tsx:172
 #, c-format
 msgid "Balance"
 msgstr ""
 
-#: src/popup/popup.tsx:176
+#: src/popup/popup.tsx:175
 #, c-format
 msgid "History"
 msgstr ""
 
-#: src/popup/popup.tsx:179
+#: src/popup/popup.tsx:178
 #, c-format
 msgid "Debug"
 msgstr ""
 
-#: src/popup/popup.tsx:239
+#: src/popup/popup.tsx:238
 #, c-format
 msgid "help"
 msgstr ""
 
-#: src/popup/popup.tsx:244
+#: src/popup/popup.tsx:243
 #, c-format
 msgid ""
 "You have no balance to show. Need some\n"
 " %1$s getting started?\n"
 msgstr ""
 
-#: src/popup/popup.tsx:261
+#: src/popup/popup.tsx:260
 #, c-format
 msgid "%1$s incoming\n"
 msgstr ""
 
-#: src/popup/popup.tsx:274
+#: src/popup/popup.tsx:273
 #, c-format
 msgid "%1$s being spent\n"
 msgstr ""
 
-#: src/popup/popup.tsx:300
+#: src/popup/popup.tsx:299
 #, c-format
 msgid "Error: could not retrieve balance information."
 msgstr ""
 
-#: src/popup/popup.tsx:340
+#: src/popup/popup.tsx:337
 #, c-format
-msgid "Bank requested reserve (%1$s) for %2$s."
+msgid "Bank requested reserve (%1$s) for%2$s.\n"
 msgstr ""
 
-#: src/popup/popup.tsx:351
+#: src/popup/popup.tsx:346
 #, c-format
-msgid "Started to withdraw %1$s from %2$s (%3$s)."
+msgid ""
+"Started to withdraw\n"
+" %1$s from%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:361
+#: src/popup/popup.tsx:358
 #, c-format
-msgid "Merchant %1$s offered contract %2$s."
+msgid "Merchant%1$soffered contract%2$s;\n"
 msgstr ""
 
-#: src/popup/popup.tsx:371
+#: src/popup/popup.tsx:368
 #, c-format
-msgid "Withdrew %1$s from %2$s (%3$s)."
+msgid "Withdrew%1$sfrom%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:382
+#: src/popup/popup.tsx:379
 #, c-format
-msgid "Paid %1$s to merchant %2$s.  (%3$s)"
+msgid "Paid%1$sto merchant%2$s.  (%3$s)\n"
+msgstr ""
+
+#: src/popup/popup.tsx:386
+#, c-format
+msgid "Unknown event (%1$s)"
 msgstr ""
 
 #: src/popup/popup.tsx:429
@@ -255,7 +262,12 @@ msgstr ""
 msgid "Your wallet has no events recorded."
 msgstr ""
 
-#: src/renderHtml.tsx:42
+#: src/renderHtml.tsx:38
+#, c-format
+msgid "The merchant%1$swants to enter a contract over%2$s with you.\n"
+msgstr ""
+
+#: src/renderHtml.tsx:43
 #, c-format
 msgid "You are about to purchase:"
 msgstr ""
diff --git a/src/i18n/strings-prelude b/src/i18n/strings-prelude
new file mode 100644
index 000000000..147b6c939
--- /dev/null
+++ b/src/i18n/strings-prelude
@@ -0,0 +1,17 @@
+/*
+ This file is part of TALER
+ (C) 2016 Inria
+
+ 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 <http://www.gnu.org/licenses/>
+ */
+
+export let strings: {[s: string]: any} = {};
diff --git a/src/i18n/strings-prelude.js b/src/i18n/strings-prelude.js
deleted file mode 100644
index 0e9ddc468..000000000
--- a/src/i18n/strings-prelude.js
+++ /dev/null
@@ -1,3 +0,0 @@
-if (!window.i18n) {
-  throw Error("Module loading order incorrect, please load i18n module before loading i18n-strings");
-}
diff --git a/src/i18n/strings.ts b/src/i18n/strings.ts
new file mode 100644
index 000000000..08ba92992
--- /dev/null
+++ b/src/i18n/strings.ts
@@ -0,0 +1,21 @@
+/*
+ This file is part of TALER
+ (C) 2016 Inria
+
+ 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 <http://www.gnu.org/licenses/>
+ */
+
+export let strings: {[s: string]: any} = {};
+strings['de'] = {"domain":"de","locale_data":{"de":{"":{"domain":"de","plural_forms":"nplurals=2; plural=(n != 1);","lang":""},"show more details\n":[""],"Accepted exchanges:":[""],"Exchanges in the wallet:":[""],"You have insufficient funds of the requested currency in your wallet.":[""],"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.":[""],"Withdrawal fees: %1$s":["Abheben bei %1$s"],"Rounding loss: %1$s":[""],"# Coins":[""],"Value":[""],"Withdraw Fee":["Abheben bei %1$s"],"Refresh Fee":[""],"Deposit Fee":[""],"Withdraw fees:":["Abheben bei %1$s"],"view fee structure / select different exchange provider":[""],"Detailed Fee Structure":[""],"The exchange provider will charge\n %1$s in fees.\n":[""],"Waiting for a response from\n %1$s":[""],"A problem occured, see below.":[""],"Information about fees will be available when an exchange provider is selected.":[""],"You are about to withdraw %1$s from your bank account into your wallet.":[""],"Accept fees and withdraw":[""],"Error: URL is empty":[""],"Error: URL may not be relative":[""],"Oops, something went wrong. The wallet responded with error status (%1$s).":[""],"Checking URL, please wait ...":[""],"Can't parse amount: %1$s":[""],"Can't parse wire_types: %1$s":[""],"Fatal error: \"%1$s\".":[""],"Balance":["Saldo"],"History":["Verlauf"],"Debug":["Debug"],"help":[""],"You have no balance to show. Need some\n %1$s getting started?\n":["Sie haben kein Digitalgeld. Wollen Sie %1$s? abheben?"],"%1$s incoming\n":[""],"%1$s being spent\n":[""],"Error: could not retrieve balance information.":[""],"Bank requested reserve (%1$s) for%2$s.\n":["Bank bestätig anlegen der Reserve (%1$s) bei %2$s"],"Started to withdraw\n %1$s from%2$s(%3$s).\n":["Reserve (%1$s) mit %2$s bei %3$s erzeugt"],"Merchant%1$soffered contract%2$s;\n":[""],"Withdrew%1$sfrom%2$s(%3$s).\n":["Reserve (%1$s) mit %2$s bei %3$s erzeugt"],"Paid%1$sto merchant%2$s.  (%3$s)\n":["Reserve (%1$s) mit %2$s bei %3$s erzeugt"],"Unknown event (%1$s)":[""],"Error: could not retrieve event history":[""],"Your wallet has no events recorded.":["Ihre Geldbörse verzeichnet keine Vorkommnisse."],"The merchant%1$swants to enter a contract over%2$s with you.\n":["%1$s\n               möchte einen Vertrag über %2$s\n               mit Ihnen abschließen."],"You are about to purchase:":["Sie sind dabei, Folgendes zu kaufen:"]}}};
+strings['en-US'] = {"domain":"en-US","locale_data":{"en-US":{"":{"domain":"en-US","plural_forms":"nplurals=2; plural=(n != 1);","lang":""},"show more details\n":[""],"Accepted exchanges:":[""],"Exchanges in the wallet:":[""],"You have insufficient funds of the requested currency in your wallet.":[""],"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.":[""],"Withdrawal fees: %1$s":[""],"Rounding loss: %1$s":[""],"# Coins":[""],"Value":[""],"Withdraw Fee":[""],"Refresh Fee":[""],"Deposit Fee":[""],"Withdraw fees:":[""],"view fee structure / select different exchange provider":[""],"Detailed Fee Structure":[""],"The exchange provider will charge\n %1$s in fees.\n":[""],"Waiting for a response from\n %1$s":[""],"A problem occured, see below.":[""],"Information about fees will be available when an exchange provider is selected.":[""],"You are about to withdraw %1$s from your bank account into your wallet.":[""],"Accept fees and withdraw":[""],"Error: URL is empty":[""],"Error: URL may not be relative":[""],"Oops, something went wrong. The wallet responded with error status (%1$s).":[""],"Checking URL, please wait ...":[""],"Can't parse amount: %1$s":[""],"Can't parse wire_types: %1$s":[""],"Fatal error: \"%1$s\".":[""],"Balance":[""],"History":[""],"Debug":[""],"help":[""],"You have no balance to show. Need some\n %1$s getting started?\n":[""],"%1$s incoming\n":[""],"%1$s being spent\n":[""],"Error: could not retrieve balance information.":[""],"Bank requested reserve (%1$s) for%2$s.\n":[""],"Started to withdraw\n %1$s from%2$s(%3$s).\n":[""],"Merchant%1$soffered contract%2$s;\n":[""],"Withdrew%1$sfrom%2$s(%3$s).\n":[""],"Paid%1$sto merchant%2$s.  (%3$s)\n":[""],"Unknown event (%1$s)":[""],"Error: could not retrieve event history":[""],"Your wallet has no events recorded.":[""],"The merchant%1$swants to enter a contract over%2$s with you.\n":[""],"You are about to purchase:":[""]}}};
+strings['fr'] = {"domain":"fr","locale_data":{"fr":{"":{"domain":"fr","plural_forms":"nplurals=2; plural=(n != 1);","lang":""},"show more details\n":[""],"Accepted exchanges:":[""],"Exchanges in the wallet:":[""],"You have insufficient funds of the requested currency in your wallet.":[""],"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.":[""],"Withdrawal fees: %1$s":[""],"Rounding loss: %1$s":[""],"# Coins":[""],"Value":[""],"Withdraw Fee":[""],"Refresh Fee":[""],"Deposit Fee":[""],"Withdraw fees:":[""],"view fee structure / select different exchange provider":[""],"Detailed Fee Structure":[""],"The exchange provider will charge\n %1$s in fees.\n":[""],"Waiting for a response from\n %1$s":[""],"A problem occured, see below.":[""],"Information about fees will be available when an exchange provider is selected.":[""],"You are about to withdraw %1$s from your bank account into your wallet.":[""],"Accept fees and withdraw":[""],"Error: URL is empty":[""],"Error: URL may not be relative":[""],"Oops, something went wrong. The wallet responded with error status (%1$s).":[""],"Checking URL, please wait ...":[""],"Can't parse amount: %1$s":[""],"Can't parse wire_types: %1$s":[""],"Fatal error: \"%1$s\".":[""],"Balance":[""],"History":[""],"Debug":[""],"help":[""],"You have no balance to show. Need some\n %1$s getting started?\n":[""],"%1$s incoming\n":[""],"%1$s being spent\n":[""],"Error: could not retrieve balance information.":[""],"Bank requested reserve (%1$s) for%2$s.\n":[""],"Started to withdraw\n %1$s from%2$s(%3$s).\n":[""],"Merchant%1$soffered contract%2$s;\n":[""],"Withdrew%1$sfrom%2$s(%3$s).\n":[""],"Paid%1$sto merchant%2$s.  (%3$s)\n":[""],"Unknown event (%1$s)":[""],"Error: could not retrieve event history":[""],"Your wallet has no events recorded.":[""],"The merchant%1$swants to enter a contract over%2$s with you.\n":[""],"You are about to purchase:":[""]}}};
+strings['it'] = {"domain":"it","locale_data":{"it":{"":{"domain":"it","plural_forms":"nplurals=2; plural=(n != 1);","lang":""},"show more details\n":[""],"Accepted exchanges:":[""],"Exchanges in the wallet:":[""],"You have insufficient funds of the requested currency in your wallet.":[""],"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.":[""],"Withdrawal fees: %1$s":[""],"Rounding loss: %1$s":[""],"# Coins":[""],"Value":[""],"Withdraw Fee":[""],"Refresh Fee":[""],"Deposit Fee":[""],"Withdraw fees:":[""],"view fee structure / select different exchange provider":[""],"Detailed Fee Structure":[""],"The exchange provider will charge\n %1$s in fees.\n":[""],"Waiting for a response from\n %1$s":[""],"A problem occured, see below.":[""],"Information about fees will be available when an exchange provider is selected.":[""],"You are about to withdraw %1$s from your bank account into your wallet.":[""],"Accept fees and withdraw":[""],"Error: URL is empty":[""],"Error: URL may not be relative":[""],"Oops, something went wrong. The wallet responded with error status (%1$s).":[""],"Checking URL, please wait ...":[""],"Can't parse amount: %1$s":[""],"Can't parse wire_types: %1$s":[""],"Fatal error: \"%1$s\".":[""],"Balance":[""],"History":[""],"Debug":[""],"help":[""],"You have no balance to show. Need some\n %1$s getting started?\n":[""],"%1$s incoming\n":[""],"%1$s being spent\n":[""],"Error: could not retrieve balance information.":[""],"Bank requested reserve (%1$s) for%2$s.\n":[""],"Started to withdraw\n %1$s from%2$s(%3$s).\n":[""],"Merchant%1$soffered contract%2$s;\n":[""],"Withdrew%1$sfrom%2$s(%3$s).\n":[""],"Paid%1$sto merchant%2$s.  (%3$s)\n":[""],"Unknown event (%1$s)":[""],"Error: could not retrieve event history":[""],"Your wallet has no events recorded.":[""],"The merchant%1$swants to enter a contract over%2$s with you.\n":[""],"You are about to purchase:":[""]}}};
diff --git a/src/i18n/taler-wallet-webex.pot b/src/i18n/taler-wallet-webex.pot
index 8c68a63f1..8bfdf57d0 100644
--- a/src/i18n/taler-wallet-webex.pot
+++ b/src/i18n/taler-wallet-webex.pot
@@ -27,27 +27,27 @@ msgstr ""
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: src/pages/confirm-contract.tsx:61
+#: src/pages/confirm-contract.tsx:62
 #, c-format
 msgid "show more details\n"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:75
+#: src/pages/confirm-contract.tsx:76
 #, c-format
 msgid "Accepted exchanges:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:80
+#: src/pages/confirm-contract.tsx:81
 #, c-format
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:156
+#: src/pages/confirm-contract.tsx:157
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
-#: src/pages/confirm-contract.tsx:157
+#: src/pages/confirm-contract.tsx:158
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "
@@ -55,194 +55,201 @@ msgid ""
 "wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:105
+#: src/pages/confirm-create-reserve.tsx:106
 #, c-format
 msgid "Withdrawal fees: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:106
+#: src/pages/confirm-create-reserve.tsx:107
 #, c-format
 msgid "Rounding loss: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:109
+#: src/pages/confirm-create-reserve.tsx:110
 #, c-format
 msgid "# Coins"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:110
+#: src/pages/confirm-create-reserve.tsx:111
 #, c-format
 msgid "Value"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:111
+#: src/pages/confirm-create-reserve.tsx:112
 #, c-format
 msgid "Withdraw Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:112
+#: src/pages/confirm-create-reserve.tsx:113
 #, c-format
 msgid "Refresh Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:113
+#: src/pages/confirm-create-reserve.tsx:114
 #, c-format
 msgid "Deposit Fee"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:146
+#: src/pages/confirm-create-reserve.tsx:147
 #, c-format
 msgid "Withdraw fees:"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:180
+#: src/pages/confirm-create-reserve.tsx:182
 #, c-format
 msgid "view fee structure / select different exchange provider"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:194
+#: src/pages/confirm-create-reserve.tsx:196
 #, c-format
 msgid "Detailed Fee Structure"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:210
+#: src/pages/confirm-create-reserve.tsx:212
 #, c-format
 msgid ""
 "The exchange provider will charge\n"
 " %1$s in fees.\n"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:222
+#: src/pages/confirm-create-reserve.tsx:224
 #, c-format
 msgid ""
 "Waiting for a response from\n"
 " %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:233
+#: src/pages/confirm-create-reserve.tsx:235
 #, c-format
 msgid "A problem occured, see below."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:239
+#: src/pages/confirm-create-reserve.tsx:241
 #, c-format
 msgid ""
 "Information about fees will be available when an exchange provider is "
 "selected."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:247
+#: src/pages/confirm-create-reserve.tsx:249
 #, c-format
 msgid "You are about to withdraw %1$s from your bank account into your wallet."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:256
+#: src/pages/confirm-create-reserve.tsx:258
 #, c-format
 msgid "Accept fees and withdraw"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:278
+#: src/pages/confirm-create-reserve.tsx:280
 #, c-format
 msgid "Error: URL is empty"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:286
+#: src/pages/confirm-create-reserve.tsx:288
 #, c-format
 msgid "Error: URL may not be relative"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:344
+#: src/pages/confirm-create-reserve.tsx:347
 #, c-format
 msgid ""
 "Oops, something went wrong. The wallet responded with error status (%1$s)."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:371
+#: src/pages/confirm-create-reserve.tsx:374
 #, c-format
 msgid "Checking URL, please wait ..."
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:385
+#: src/pages/confirm-create-reserve.tsx:388
 #, c-format
 msgid "Can't parse amount: %1$s"
 msgstr ""
 
-#: src/pages/confirm-create-reserve.tsx:393
+#: src/pages/confirm-create-reserve.tsx:396
 #, c-format
 msgid "Can't parse wire_types: %1$s"
 msgstr ""
 
 #. TODO:generic error reporting function or component.
-#: src/pages/confirm-create-reserve.tsx:410
+#: src/pages/confirm-create-reserve.tsx:413
 #, c-format
 msgid "Fatal error: \"%1$s\"."
 msgstr ""
 
-#: src/popup/popup.tsx:173
+#: src/popup/popup.tsx:172
 #, c-format
 msgid "Balance"
 msgstr ""
 
-#: src/popup/popup.tsx:176
+#: src/popup/popup.tsx:175
 #, c-format
 msgid "History"
 msgstr ""
 
-#: src/popup/popup.tsx:179
+#: src/popup/popup.tsx:178
 #, c-format
 msgid "Debug"
 msgstr ""
 
-#: src/popup/popup.tsx:239
+#: src/popup/popup.tsx:238
 #, c-format
 msgid "help"
 msgstr ""
 
-#: src/popup/popup.tsx:244
+#: src/popup/popup.tsx:243
 #, c-format
 msgid ""
 "You have no balance to show. Need some\n"
 " %1$s getting started?\n"
 msgstr ""
 
-#: src/popup/popup.tsx:261
+#: src/popup/popup.tsx:260
 #, c-format
 msgid "%1$s incoming\n"
 msgstr ""
 
-#: src/popup/popup.tsx:274
+#: src/popup/popup.tsx:273
 #, c-format
 msgid "%1$s being spent\n"
 msgstr ""
 
-#: src/popup/popup.tsx:300
+#: src/popup/popup.tsx:299
 #, c-format
 msgid "Error: could not retrieve balance information."
 msgstr ""
 
-#: src/popup/popup.tsx:340
+#: src/popup/popup.tsx:337
 #, c-format
-msgid "Bank requested reserve (%1$s) for %2$s."
+msgid "Bank requested reserve (%1$s) for%2$s.\n"
 msgstr ""
 
-#: src/popup/popup.tsx:351
+#: src/popup/popup.tsx:346
 #, c-format
-msgid "Started to withdraw %1$s from %2$s (%3$s)."
+msgid ""
+"Started to withdraw\n"
+" %1$s from%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:361
+#: src/popup/popup.tsx:358
 #, c-format
-msgid "Merchant %1$s offered contract %2$s."
+msgid "Merchant%1$soffered contract%2$s;\n"
 msgstr ""
 
-#: src/popup/popup.tsx:371
+#: src/popup/popup.tsx:368
 #, c-format
-msgid "Withdrew %1$s from %2$s (%3$s)."
+msgid "Withdrew%1$sfrom%2$s(%3$s).\n"
 msgstr ""
 
-#: src/popup/popup.tsx:382
+#: src/popup/popup.tsx:379
 #, c-format
-msgid "Paid %1$s to merchant %2$s.  (%3$s)"
+msgid "Paid%1$sto merchant%2$s.  (%3$s)\n"
+msgstr ""
+
+#: src/popup/popup.tsx:386
+#, c-format
+msgid "Unknown event (%1$s)"
 msgstr ""
 
 #: src/popup/popup.tsx:429
@@ -255,7 +262,12 @@ msgstr ""
 msgid "Your wallet has no events recorded."
 msgstr ""
 
-#: src/renderHtml.tsx:42
+#: src/renderHtml.tsx:38
+#, c-format
+msgid "The merchant%1$swants to enter a contract over%2$s with you.\n"
+msgstr ""
+
+#: src/renderHtml.tsx:43
 #, c-format
 msgid "You are about to purchase:"
 msgstr ""
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>
 
diff --git a/src/popup/popup.html b/src/popup/popup.html
index 5800519a4..a8b339b05 100644
--- a/src/popup/popup.html
+++ b/src/popup/popup.html
@@ -11,16 +11,12 @@
   <script src="/src/vendor/react-dom.js"></script>
   <script src="/src/vendor/URI.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/vendor/system-csp-production.src.js"></script>
   <script src="/src/moduleTrampoline.js"></script>
 </head>
 
 <body>
-<div id="content" style="margin:0;padding:0"></div>
+  <div id="content" style="margin:0;padding:0"></div>
 </body>
 
 </html>
diff --git a/src/popup/popup.tsx b/src/popup/popup.tsx
index bd93f54f2..47dbd0b8f 100644
--- a/src/popup/popup.tsx
+++ b/src/popup/popup.tsx
@@ -33,8 +33,7 @@ import {
   WalletBalanceEntry
 } from "src/types";
 import {abbrev, prettyAmount} from "src/renderHtml";
-
-declare var i18n: any;
+import * as i18n from "src/i18n";
 
 function onUpdateNotification(f: () => void): () => void {
   let port = chrome.runtime.connect({name: "notifications"});
@@ -170,13 +169,13 @@ class WalletNavBar extends React.Component<any,any> {
     return (
       <div className="nav" id="header">
         <Tab target="/balance">
-          {i18n`Balance`}
+          {i18n.str`Balance`}
         </Tab>
         <Tab target="/history">
-          {i18n`History`}
+          {i18n.str`History`}
         </Tab>
         <Tab target="/debug">
-          {i18n`Debug`}
+          {i18n.str`Debug`}
         </Tab>
       </div>);
   }
@@ -236,7 +235,7 @@ class WalletBalanceView extends React.Component<any, any> {
   renderEmpty(): JSX.Element {
     let helpLink = (
       <ExtensionLink target="/src/pages/help/empty-wallet.html">
-        {i18n`help`}
+        {i18n.str`help`}
       </ExtensionLink>
     );
     return (
@@ -297,7 +296,7 @@ class WalletBalanceView extends React.Component<any, any> {
   render(): JSX.Element {
     let wallet = this.balance;
     if (this.gotError) {
-      return i18n`Error: could not retrieve balance information.`;
+      return i18n.str`Error: could not retrieve balance information.`;
     }
     if (!wallet) {
       return <span></span>;
@@ -384,7 +383,7 @@ function formatHistoryItem(historyItem: HistoryRecord) {
       );
     }
     default:
-      return (<p>{i18n`Unknown event (${historyItem.type})`}</p>);
+      return (<p>{i18n.str`Unknown event (${historyItem.type})`}</p>);
   }
 }
 
@@ -427,7 +426,7 @@ class WalletHistory extends React.Component<any, any> {
     console.log("rendering history");
     let history: HistoryRecord[] = this.myHistory;
     if (this.gotError) {
-      return i18n`Error: could not retrieve event history`;
+      return i18n.str`Error: could not retrieve event history`;
     }
 
     if (!history) {
@@ -461,7 +460,7 @@ class WalletHistory extends React.Component<any, any> {
     if (listing.length > 0) {
       return <div className="container">{listing}</div>;
     }
-    return <p>{i18n`Your wallet has no events recorded.`}</p>
+    return <p>{i18n.str`Your wallet has no events recorded.`}</p>
   }
 
 }
diff --git a/src/renderHtml.tsx b/src/renderHtml.tsx
index c858a8842..40b48094e 100644
--- a/src/renderHtml.tsx
+++ b/src/renderHtml.tsx
@@ -22,6 +22,7 @@
 
 
 import {AmountJson, Contract, Amounts} from "./types";
+import * as i18n from "src/i18n";
 
 export function prettyAmount(amount: AmountJson) {
   let v = amount.value + amount.fraction / Amounts.fractionalBase;
@@ -34,12 +35,12 @@ export function renderContract(contract: Contract): JSX.Element {
 
   return (
     <div>
-      <p>
-        The merchant {merchantName}
-        wants to enter a contract over {amount}{" "}
+      <i18n.Translate wrap="p">
+        The merchant <span>{merchantName}</span>
+        wants to enter a contract over <span>{amount}</span>{" "}
         with you.
-      </p>
-      <p>{i18n`You are about to purchase:`}</p>
+      </i18n.Translate>
+      <p>{i18n.str`You are about to purchase:`}</p>
       <ul>
         {contract.products.map(
           (p: any, i: number) => (<li key={i}>{`${p.description}: ${prettyAmount(p.price)}`}</li>))
diff --git a/src/vendor/jed.d.ts b/src/vendor/jed.d.ts
new file mode 100644
index 000000000..2e64cba08
--- /dev/null
+++ b/src/vendor/jed.d.ts
@@ -0,0 +1,13 @@
+
+interface JedModule {
+  translate: any;
+  ngettext: any;
+}
+
+interface JedConstructor {
+  new(s: any): JedModule;
+}
+
+declare const Jed: JedConstructor;
+
+export default Jed;
-- 
cgit v1.2.3