From 8f5910d30aa1384a49c1b144739943189ae53341 Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Tue, 3 Mar 2026 03:03:22 +0000
Subject: [PATCH 1/2] fix: Raw number rendering for \`taxPaidGes\` and
 \`profit\` after load (#375)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 kraiken-lib/src/format.ts                          | 5 +++++
 web-app/src/components/collapse/CollapseActive.vue | 6 +++---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/kraiken-lib/src/format.ts b/kraiken-lib/src/format.ts
index 2a41da4..efc55fe 100644
--- a/kraiken-lib/src/format.ts
+++ b/kraiken-lib/src/format.ts
@@ -24,3 +24,8 @@ export function compactNumber(value: number): string {
 export function commaNumber(value: number): string {
   return value ? value.toLocaleString('en-US') : '0';
 }
+
+/** Format a token amount with comma grouping and 2 decimal places (e.g. "1,234.56") */
+export function formatTokenAmount(value: number): string {
+  return value.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+}
diff --git a/web-app/src/components/collapse/CollapseActive.vue b/web-app/src/components/collapse/CollapseActive.vue
index db8e27a..b748ce4 100644
--- a/web-app/src/components/collapse/CollapseActive.vue
+++ b/web-app/src/components/collapse/CollapseActive.vue
@@ -42,11 +42,11 @@
       <div v-if="!error || taxPaidGes !== undefined" class="profit-stats-wrapper">
         <div class="profit-stats-item">
           <div><b>Tax Paid</b></div>
-          <div>{{ taxPaidGes ?? '...' }} $KRK</div>
+          <div>{{ taxPaidGes !== undefined ? formatTokenAmount(taxPaidGes) : '...' }} $KRK</div>
         </div>
         <div class="profit-stats-item">
           <div><b>Issuance Earned</b></div>
-          <div>{{ profit ?? '...' }} $KRK</div>
+          <div>{{ profit !== undefined ? formatTokenAmount(profit) : '...' }} $KRK</div>
         </div>
         <div class="profit-stats-item profit-stats-total">
           <div><b>Total</b></div>
@@ -88,7 +88,7 @@ import FButton from '@/components/fcomponents/FButton.vue';
 import FTag from '@/components/fcomponents/FTag.vue';
 import FSelect from '@/components/fcomponents/FSelect.vue';
 import FCollapse from '@/components/fcomponents/FCollapse.vue';
-import { compactNumber, weiToNumber } from 'kraiken-lib/format';
+import { compactNumber, weiToNumber, formatTokenAmount } from 'kraiken-lib/format';
 import { useUnstake } from '@/composables/useUnstake';
 import { useAdjustTaxRate } from '@/composables/useAdjustTaxRates';
 import { computed, ref, onMounted } from 'vue';

From d00b78f3383563c1eb8761d6ad17cdbcbdaad8fc Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Tue, 3 Mar 2026 03:32:06 +0000
Subject: [PATCH 2/2] fix: apply formatTokenAmount to Total row and guard
 against NaN/Infinity

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 kraiken-lib/src/format.ts                          | 1 +
 web-app/src/components/collapse/CollapseActive.vue | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/kraiken-lib/src/format.ts b/kraiken-lib/src/format.ts
index efc55fe..06d906d 100644
--- a/kraiken-lib/src/format.ts
+++ b/kraiken-lib/src/format.ts
@@ -27,5 +27,6 @@ export function commaNumber(value: number): string {
 
 /** Format a token amount with comma grouping and 2 decimal places (e.g. "1,234.56") */
 export function formatTokenAmount(value: number): string {
+  if (!isFinite(value)) return '0.00';
   return value.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
 }
diff --git a/web-app/src/components/collapse/CollapseActive.vue b/web-app/src/components/collapse/CollapseActive.vue
index b748ce4..8955831 100644
--- a/web-app/src/components/collapse/CollapseActive.vue
+++ b/web-app/src/components/collapse/CollapseActive.vue
@@ -50,7 +50,7 @@
         </div>
         <div class="profit-stats-item profit-stats-total">
           <div><b>Total</b></div>
-          <div>{{ taxPaidGes !== undefined && profit !== undefined ? total.toFixed(5) : '...' }} $KRK</div>
+          <div>{{ taxPaidGes !== undefined && profit !== undefined ? formatTokenAmount(total) : '...' }} $KRK</div>
         </div>
       </div>
     </div>