From 6e28e1a018a697a1c99e5aaecb7be736de8b4a53 Mon Sep 17 00:00:00 2001
From: Alex McG <alex.mcgonagle.dev@gmail.com>
Date: Fri, 10 Jun 2022 16:23:41 +0100
Subject: [PATCH] Add thousand seperator for readability

---
 src/components/EtherFormatted.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/EtherFormatted.tsx b/src/components/EtherFormatted.tsx
index 04620486..7fdf591d 100644
--- a/src/components/EtherFormatted.tsx
+++ b/src/components/EtherFormatted.tsx
@@ -10,8 +10,14 @@ const EtherFormatted: FC<{ wei: BigNumberish }> = ({ wei }) => {
 
   const ether = ethers.utils.formatEther(wei);
   const isRounded = ether.split(".")[1].length > etherDecimalPlaces;
+  let stringAmount = new Decimal(ether).toDP(etherDecimalPlaces).toFixed();
 
-  return <>{isRounded && "~"}{new Decimal(ether).toDP(etherDecimalPlaces).toFixed()}</>;
+  if(stringAmount.includes('.')) {
+    const seperateStringByDecimal = stringAmount.split(".");
+    const formattedAmount = seperateStringByDecimal[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+    stringAmount = formattedAmount + "." + seperateStringByDecimal[1];
+  }
+  return <>{isRounded && "~"}{stringAmount}</>;
 };
 
 export default EtherFormatted;
\ No newline at end of file