From 74049c19fce8ee77b1fa9933e26ac3569e3513f9 Mon Sep 17 00:00:00 2001
From: Dan Finlay <dan@danfinlay.com>
Date: Tue, 3 Apr 2018 13:52:01 -0700
Subject: [PATCH] Internationalize currency

Fixes #3580
---
 package-lock.json                      | 20 ++++++++++++++++++++
 package.json                           |  1 +
 test/unit/balance-formatter-test.js    | 17 +++++++++++++++++
 ui/app/components/balance-component.js |  7 ++++++-
 4 files changed, 44 insertions(+), 1 deletion(-)
 create mode 100644 test/unit/balance-formatter-test.js

diff --git a/package-lock.json b/package-lock.json
index 1029c507f..278d4028c 100644
--- a/package-lock.json
+++ b/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",
diff --git a/package.json b/package.json
index 1227b82b7..441ccbc6e 100644
--- a/package.json
+++ b/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",
diff --git a/test/unit/balance-formatter-test.js b/test/unit/balance-formatter-test.js
new file mode 100644
index 000000000..0fdb7f618
--- /dev/null
+++ b/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()
+  })
+})
diff --git a/ui/app/components/balance-component.js b/ui/app/components/balance-component.js
index d591ab455..f6ca6dd26 100644
--- a/ui/app/components/balance-component.js
+++ b/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) {