💲fix: Align currencies in the right way

peterhanania · Apr 2, 2023 · fcfde50 · fcfde50
1 parent 82e071f
commit fcfde50
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 13 deletions.
diff --git a/.gitignore b/.gitignore
@@ -14,6 +14,7 @@ out/
 
 # production
 build
+.idea
 
 # misc
 .DS_Store

diff --git a/components/Data.tsx b/components/Data.tsx
@@ -3,7 +3,6 @@ import Badges from "./json/badges/index.json";
 import Tippy from "@tippyjs/react";
 import moment from "moment";
 import emojis from "./json/demo/emojis.json";
-import currencies from "./json/other/currencies.json";
 import Utils from "./utils";
 import Highcharts from "highcharts";
 import HighchartsReact from "highcharts-react-official";
@@ -11572,8 +11571,7 @@ export default function Data({ data, demo }: any): ReactElement {
                     </Tippy>
                     {data?.dataFile ? "They've " : "You've "}spent{" "}
                     <p className="mx-1 font-extrabold text-blue-500 inline-flex">
-                      {Utils.getMostUsedCurrency(data.payments.transactions)}
-                      {data?.payments?.total?.toFixed(2) || 0}
+                      {Utils.getMostUsedCurrency(data.payments.transactions, data?.payments?.total?.toFixed(2) ?? 0)}
                     </p>
                     on Discord
                   </span>
@@ -11596,9 +11594,10 @@ export default function Data({ data, demo }: any): ReactElement {
                           <div className="inline-flex">
                             <p className="mx-1 font-extrabold inline-flex">
                               {Utils.getMostUsedCurrency(
-                                data.payments.transactions
+                                data.payments.transactions,
+                                t?.amount ? t.amount : 0
                               )}
-                              {t?.amount ? t.amount : 0}
+
                             </p>
                             on
                             <Tippy

diff --git a/components/json/other/currencies.json b/components/json/other/currencies.json
@@ -152,7 +152,8 @@
   {
     "currency": "Egypt Pound",
     "abbreviation": "EGP",
-    "symbol": "£"
+    "symbol": "£",
+    "right": true
   },
   {
     "currency": "El Salvador Colon",
@@ -172,7 +173,8 @@
   {
     "currency": "Falkland Islands (Malvinas) Pound",
     "abbreviation": "FKP",
-    "symbol": "£"
+    "symbol": "£",
+    "right": true
   },
   {
     "currency": "Fiji Dollar",
@@ -187,7 +189,8 @@
   {
     "currency": "Gibraltar Pound",
     "abbreviation": "GIP",
-    "symbol": "£"
+    "symbol": "£",
+    "right": true
   },
   {
     "currency": "Guatemala Quetzal",
@@ -432,7 +435,8 @@
   {
     "currency": "Saint Helena Pound",
     "abbreviation": "SHP",
-    "symbol": "£"
+    "symbol": "£",
+    "right": true
   },
   {
     "currency": "Saudi Arabia Riyal",
@@ -537,7 +541,8 @@
   {
     "currency": "United Kingdom Pound",
     "abbreviation": "GBP",
-    "symbol": "£"
+    "symbol": "£",
+    "right": true
   },
   {
     "currency": "United States Dollar",

diff --git a/components/utils/index.js b/components/utils/index.js
@@ -12,7 +12,7 @@ import currencies from "../json/other/currencies.json";
 import connectionsJSON from "../json/connections.json";
 
 class Utils {
-  static getMostUsedCurrency(transactions) {
+  static getMostUsedCurrency(transactions, amount) {
     if (transactions == null) {
       return;
     }
@@ -34,8 +34,13 @@ class Utils {
       (a) => a?.abbreviation.toLowerCase() === mostUsedCurrency
     );
 
-    return currency.symbol;
+    // {amount}{symbol}
+    if (currency.right) return `${amount}${currency.symbol}`;
+
+    // {symbol}{amount}
+    else return `${currency.symbol}${amount}`;
   }
+
   static readFile(name, files) {
     return new Promise((resolve) => {
       const file = files.find((file) => {
@@ -445,7 +450,8 @@ class Utils {
         .sort((a, b) => b.count - a.count);
 
     const connectionsPossible = Object.keys(connectionsJSON);
-    const connectionsRand = Math.floor(Math.random() * connectionsPossible.length) + 1;
+    const connectionsRand =
+      Math.floor(Math.random() * connectionsPossible.length) + 1;
     const connectionsArray = [];
     for (let i = 0; i < connectionsRand; i++) {
       const connectionsArray_ =