Internationalize currency

Fixes #3580

package-lock.json

@@ -344,6 +344,11 @@
         "negotiator": "0.6.1"
       }
     },
+    "accounting": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/accounting/-/accounting-0.4.1.tgz",
+      "integrity": "sha1-h91BA+/39EYPHhhvXGd+1s9WaIM="
+    },
     "acorn": {
       "version": "4.0.13",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
@@ -4073,6 +4078,16 @@
         "cssom": "0.3.2"
       }
     },
+    "currency-formatter": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/currency-formatter/-/currency-formatter-1.4.2.tgz",
+      "integrity": "sha512-rQ5HB3DenCZwfVPdpVTuVcAORodVO0VoqIbjhdUSuy0sE2b9jBdCaVKbA355NUc2KhPbu5ojHs3WypuEwPLfNg==",
+      "requires": {
+        "accounting": "0.4.1",
+        "locale-currency": "0.0.1",
+        "object-assign": "4.1.1"
+      }
+    },
     "currently-unhandled": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
@@ -13074,6 +13089,11 @@
         "object-assign": "4.1.1"
       }
     },
+    "locale-currency": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/locale-currency/-/locale-currency-0.0.1.tgz",
+      "integrity": "sha1-yeFaIv9XW0tLuUekv5KsI2vR/ps="
+    },
     "locate-path": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",

package.json

@@ -81,6 +81,7 @@
     "classnames": "^2.2.5",
     "clone": "^2.1.1",
     "copy-to-clipboard": "^3.0.8",
+    "currency-formatter": "^1.4.2",
     "debounce": "^1.0.0",
     "debounce-stream": "^2.0.0",
     "deep-extend": "^0.5.0",

test/unit/balance-formatter-test.js

@@ -0,0 +1,17 @@
+const assert = require('assert')
+const currencyFormatter = require('currency-formatter')
+const infuraConversion = require('../../ui/app/infura-conversion.json')
+
+describe.only('currencyFormatting', function () {
+  it('be able to format any infura currency', function (done) {
+    const number = 10000
+
+    infuraConversion.objects.forEach((conversion) => {
+      const code = conversion.quote.code.toUpperCase()
+      const result = currencyFormatter.format(number, { code })
+      assert.ok(result, `Currency ${code} formatted as ${result}`)
+    })
+
+    done()
+  })
+})

ui/app/components/balance-component.js

@@ -4,6 +4,7 @@ const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const TokenBalance = require('./token-balance')
 const Identicon = require('./identicon')
+const currencyFormatter = require('currency-formatter')
 
 const { formatBalance, generateBalanceObject } = require('../util')
 
@@ -97,9 +98,13 @@ BalanceComponent.prototype.renderFiatAmount = function (fiatDisplayNumber, fiatS
   const shouldNotRenderFiat = fiatDisplayNumber === 'N/A' || Number(fiatDisplayNumber) === 0
   if (shouldNotRenderFiat) return null
 
+  const display = currencyFormatter.format(Number(fiatDisplayNumber), {
+    code: fiatSuffix.toUpperCase()
+  })
+
   return h('div.fiat-amount', {
     style: {},
-  }, `${fiatPrefix}${fiatDisplayNumber} ${fiatSuffix}`)
+  }, display)
 }
 
 BalanceComponent.prototype.getTokenBalance = function (formattedBalance, shorten) {