From 32db2d291ccbf1c0e545491c0348c90111270962 Mon Sep 17 00:00:00 2001
From: EmberSpirit <EmberSpirit007@proton.me>
Date: Mon, 23 Oct 2023 21:58:54 +0200
Subject: [PATCH] update bloodchart compact number

---
 src/components/BloodChart.vue    | 11 ++++++++---
 src/components/ConnectWallet.vue |  2 +-
 src/helper/helper.js             |  7 +++++++
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/BloodChart.vue b/src/components/BloodChart.vue
index a6e863e..80ee6ec 100644
--- a/src/components/BloodChart.vue
+++ b/src/components/BloodChart.vue
@@ -72,8 +72,13 @@
 					</div>
 				</div>
 				<div class="blood-chart-element-footer">
-					<div class="blood-chart-amount">
-						{{ formatNumber(coin.amountInBLD, 10n ** tokenStore.memeToken.decimals) }}
+					<div
+						class="blood-chart-amount"
+						:title="formatBigIntDivision(coin.amountInBLD, 10n ** tokenStore.memeToken.decimals)"
+					>
+						{{
+							compactNumber(formatBigIntDivision(coin.amountInBLD, 10n ** tokenStore.memeToken.decimals))
+						}}
 					</div>
 					<div>$BLOOD</div>
 				</div>
@@ -96,7 +101,7 @@
 
 <script setup>
 import { computed, ref, inject, onMounted } from "vue";
-import { getPercentage, formatNumber } from "@/helper/helper.js";
+import { getPercentage, formatNumber, compactNumber, formatBigIntDivision } from "@/helper/helper.js";
 import { useCycleStore } from "@/stores/cycles";
 
 import { useMemeburnerStore } from "@/stores/memeburner";
diff --git a/src/components/ConnectWallet.vue b/src/components/ConnectWallet.vue
index 5669fd4..8337fc6 100644
--- a/src/components/ConnectWallet.vue
+++ b/src/components/ConnectWallet.vue
@@ -36,7 +36,7 @@
 				<div class="connected-header-avatar">
 					<img :src="getblocky(walletStore.address)" alt="avatar" />
 				</div>
-				<div class="connected-header-address">
+				<div class="connected-header-address" :title="walletStore.address">
 					{{ getAddressShortName(walletStore.address) }}
 				</div>
 				<div class="connected-header-logout" @click="disconnectWallet">
diff --git a/src/helper/helper.js b/src/helper/helper.js
index b17d06c..100210d 100644
--- a/src/helper/helper.js
+++ b/src/helper/helper.js
@@ -3,6 +3,13 @@ export function getPercentage(amount, goal) {
     return ((Number(amount) / Number(goal)) * 100).toFixed(2);
 }
 
+export function compactNumber(number) {
+	return Intl.NumberFormat("en-US", {
+		notation: "compact",
+		maximumFractionDigits: 2,
+	}).format(number);
+}
+
 
 export function formatNumber(nominator, denominator) {
     let number = formatBigIntDivision(nominator, denominator);