From 09fb1a173c2c6a82f1f0d5827dd3f074cd8f7b30 Mon Sep 17 00:00:00 2001
From: Khushboo Mehta <mehtakhushboo@hotmail.com>
Date: Thu, 12 Aug 2021 19:00:11 +0200
Subject: [PATCH] fix(@desktop/wallet) Truncate long wallet amount

Added logic to convert large amounts to Millions and Billions

fixes #2667
---
 ui/app/AppLayouts/Wallet/LeftTab.qml        |   4 +-
 ui/shared/polyfill.number.toLocaleString.js | 164 ++------------------
 2 files changed, 15 insertions(+), 153 deletions(-)

diff --git a/ui/app/AppLayouts/Wallet/LeftTab.qml b/ui/app/AppLayouts/Wallet/LeftTab.qml
index 1f9c6f0b77..e6049c4e02 100644
--- a/ui/app/AppLayouts/Wallet/LeftTab.qml
+++ b/ui/app/AppLayouts/Wallet/LeftTab.qml
@@ -43,7 +43,7 @@ Rectangle {
         StyledTextEdit {
             id: walletAmountValue
             color: Style.current.textColor
-            text: Utils.toLocaleString(walletModel.balanceView.totalFiatBalance, globalSettings.locale) + " " + walletModel.balanceView.defaultCurrency.toUpperCase()
+            text: Utils.toLocaleString(walletModel.balanceView.totalFiatBalance, globalSettings.locale, {"currency": true}) + " " + walletModel.balanceView.defaultCurrency.toUpperCase()
             selectByMouse: true
             cursorVisible: true
             readOnly: true
@@ -141,7 +141,7 @@ Rectangle {
             }
             StyledText {
                 id: walletBalance
-                text: isLoading ? "..." : Utils.toLocaleString(fiatBalance, globalSettings.locale) + " " + walletModel.balanceView.defaultCurrency.toUpperCase()
+                text: isLoading ? "..." : Utils.toLocaleString(fiatBalance, globalSettings.locale, {"currency": true}) + " " + walletModel.balanceView.defaultCurrency.toUpperCase()
                 anchors.top: parent.top
                 anchors.topMargin: Style.current.smallPadding
                 anchors.right: parent.right
diff --git a/ui/shared/polyfill.number.toLocaleString.js b/ui/shared/polyfill.number.toLocaleString.js
index 04728f9ca0..3c9adc56fe 100644
--- a/ui/shared/polyfill.number.toLocaleString.js
+++ b/ui/shared/polyfill.number.toLocaleString.js
@@ -22,18 +22,6 @@ var replaceSeparators = function(sNum, separators) {
     return sNum; 
 }; 
 
-var renderFormat = function(template, props) { 
-    for (var prop in props) { 
-        if (props[prop].indexOf('-') !== -1) { 
-            props[prop] = props[prop].replace('-', ''); 
-            template = '-' + template; 
-        } 
-        template = template.replace("{{" + prop + "}}", props[prop]); 
-    } 
-
-    return template; 
-}; 
-
 var mapMatch = function(map, locale) { 
     var match = locale; 
     var language = locale && locale.toLowerCase().match(/^\w+/); 
@@ -135,130 +123,6 @@ var currencyFormatMap = {
     "nb-NO": "post" 
 }; 
 
-var currencySymbols = { 
-    "afn": "؋", 
-    "ars": "$", 
-    "awg": "ƒ", 
-    "aud": "$", 
-    "azn": "₼", 
-    "bsd": "$", 
-    "bbd": "$", 
-    "byr": "p.", 
-    "bzd": "BZ$", 
-    "bmd": "$", 
-    "bob": "Bs.", 
-    "bam": "KM", 
-    "bwp": "P", 
-    "bgn": "лв", 
-    "brl": "R$", 
-    "bnd": "$", 
-    "khr": "៛", 
-    "cad": "$", 
-    "kyd": "$", 
-    "clp": "$", 
-    "cny": "¥", 
-    "cop": "$", 
-    "crc": "₡", 
-    "hrk": "kn", 
-    "cup": "₱", 
-    "czk": "Kč", 
-    "dkk": "kr", 
-    "dop": "RD$", 
-    "xcd": "$", 
-    "egp": "£", 
-    "svc": "$", 
-    "eek": "kr", 
-    "eur": "€", 
-    "fkp": "£", 
-    "fjd": "$", 
-    "ghc": "¢", 
-    "gip": "£", 
-    "gtq": "Q", 
-    "ggp": "£", 
-    "gyd": "$", 
-    "hnl": "L", 
-    "hkd": "$", 
-    "huf": "Ft", 
-    "isk": "kr", 
-    "inr": "₹", 
-    "idr": "Rp", 
-    "irr": "﷼", 
-    "imp": "£", 
-    "ils": "₪", 
-    "jmd": "J$", 
-    "jpy": "¥", 
-    "jep": "£", 
-    "kes": "KSh", 
-    "kzt": "лв", 
-    "kpw": "₩", 
-    "krw": "₩", 
-    "kgs": "лв", 
-    "lak": "₭", 
-    "lvl": "Ls", 
-    "lbp": "£", 
-    "lrd": "$", 
-    "ltl": "Lt", 
-    "mkd": "ден", 
-    "myr": "RM", 
-    "mur": "₨", 
-    "mxn": "$", 
-    "mnt": "₮", 
-    "mzn": "MT", 
-    "nad": "$", 
-    "npr": "₨", 
-    "ang": "ƒ", 
-    "nzd": "$", 
-    "nio": "C$", 
-    "ngn": "₦", 
-    "nok": "kr", 
-    "omr": "﷼", 
-    "pkr": "₨", 
-    "pab": "B/.", 
-    "pyg": "Gs", 
-    "pen": "S/.", 
-    "php": "₱", 
-    "pln": "zł", 
-    "qar": "﷼", 
-    "ron": "lei", 
-    "rub": "₽", 
-    "shp": "£", 
-    "sar": "﷼", 
-    "rsd": "Дин.", 
-    "scr": "₨", 
-    "sgd": "$", 
-    "sbd": "$", 
-    "sos": "S", 
-    "zar": "R", 
-    "lkr": "₨", 
-    "sek": "kr", 
-    "chf": "CHF", 
-    "srd": "$", 
-    "syp": "£", 
-    "tzs": "TSh", 
-    "twd": "NT$", 
-    "thb": "฿", 
-    "ttd": "TT$", 
-    "try": "", 
-    "trl": "₤", 
-    "tvd": "$", 
-    "ugx": "USh", 
-    "uah": "₴", 
-    "gbp": "£", 
-    "usd": "$", 
-    "uyu": "$U", 
-    "uzs": "лв", 
-    "vef": "Bs", 
-    "vnd": "₫", 
-    "yer": "﷼", 
-    "zwd": "Z$" 
-}; 
-
-var currencyFormats = { 
-    pre: "{{code}}{{num}}", 
-    post: "{{num}} {{code}}", 
-    prespace: "{{code}} {{num}}" 
-}; 
-
 function toLocaleString(val, locale, options) { 
     if (locale && locale.length < 2) 
         throw new RangeError("Invalid language tag: " + locale); 
@@ -273,22 +137,20 @@ function toLocaleString(val, locale, options) {
 
     sNum = mapMatch(transformForLocale, locale)(sNum, options); 
 
-    if(options && options.currency && options.style === "currency") { 
-        var format = currencyFormats[mapMatch(currencyFormatMap, locale)]; 
-        var symbol = currencySymbols[options.currency.toLowerCase()]; 
-        if(options.currencyDisplay === "code" || !symbol) { 
-            sNum = renderFormat(format, { 
-                num: sNum, 
-                code: options.currency.toUpperCase() 
-            }); 
-        } else { 
-            sNum = renderFormat(format, { 
-                num: sNum, 
-                code: symbol 
-            }); 
-        } 
-    } 
+    if(options && options.currency) {
+        sNum = convertToInternationalCurrencySystem(val)
+    }
 
     return sNum; 
 }; 
 
+function convertToInternationalCurrencySystem (val) {
+    // Nine 0's - Billions
+    return Math.abs(Number(val)) >= 1.0e+9
+    ? (Math.abs(Number(val)) / 1.0e+9).toFixed(2) + "B"
+    // Six 0's - Millions
+    : Math.abs(Number(val)) >= 1.0e+6
+    ? (Math.abs(Number(val)) / 1.0e+6).toFixed(2) + "M"
+    : Math.abs(Number(val));
+}
+