Stats page - total system surplus (#605)

* add surplus * update formatDataNumber * prettier * show OD for surplus on a frontend * surplus value with OD letters * test for formatDataNumber * update test for formatDataNumber * prettier * clean console.log * rm join testnet
open-dollar · Jul 3, 2024 · 1478661 · 1478661
1 parent e7daf53
commit 1478661
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 6 deletions.
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -21,9 +21,6 @@ const Footer: React.FC = () => {
                 <Row className="linksContainer">
                     <Column>
                         <Header>PROJECT</Header>
-                        <Link target="_blank" href="https://app.opendollar.com/">
-                            Join Testnet
-                        </Link>
                         <Link target="_blank" href="https://docs.opendollar.com/">
                             Docs
                         </Link>

diff --git a/src/containers/Analytics/index.tsx b/src/containers/Analytics/index.tsx
@@ -68,6 +68,7 @@ const Analytics = () => {
         globalDebt,
         globalDebtCeiling,
         globalDebtUtilization,
+        surplusInTreasury,
         marketPrice,
         redemptionPrice,
         totalLiquidity,
@@ -162,6 +163,13 @@ const Analytics = () => {
 
     const circulation = { title: 'circulation', value: erc20Supply, description: 'Circulating supply of OD stablecoin' }
 
+    const surplusInTreasuryData: DataCardProps = {
+        title: 'Surplus in Treasury',
+        value: surplusInTreasury,
+        description:
+            "Total HAI accrued by the system's stability fees. It's stored in the Stability Fee Treasury accountance",
+    }
+
     const liquidityUniswap = {
         title: 'OD/ETH Liquidity in Camelot',
         value: totalLiquidity,
@@ -244,6 +252,7 @@ const Analytics = () => {
         // totalFeesEarned,
         globalDebtUtilizationData,
         globalDebtData,
+        surplusInTreasuryData,
     ]
 
     const pricesData: DataCardProps[] = [
@@ -267,7 +276,6 @@ const Analytics = () => {
                 0,
                 true
             ).toString()
-
             const colRows = Object.fromEntries(
                 Object.entries(analyticsData?.tokenAnalyticsData).map(([key, value]) => {
                     const lockedAmountInUsd = multiplyWad(
@@ -324,7 +332,7 @@ const Analytics = () => {
                     analyticsData.globalDebt,
                     analyticsData.globalDebtCeiling
                 ),
-                surplusInTreasury: formatDataNumber(analyticsData.surplusInTreasury, 18, 0, true),
+                surplusInTreasury: `${formatDataNumber(analyticsData.surplusInTreasury, 18, 0)} OD`,
                 marketPrice: formatDataNumber(analyticsData.marketPrice, 18, 3, true, undefined, 4),
                 redemptionPrice: formatDataNumber(analyticsData.redemptionPrice, 18, 3, true, undefined, 4),
                 totalLiquidity: formattedLiquidity,

diff --git a/src/utils/formatDataNumber.ts b/src/utils/formatDataNumber.ts
@@ -31,7 +31,9 @@ export function formatDataNumber(
     return new Intl.NumberFormat('en-US', {
         minimumFractionDigits: minimumDecimals,
         maximumFractionDigits:
-            minimumDecimals >= formatDecimal ? Math.min(minimumDecimals, formatDecimal) + 1 : formatDecimal,
+            minimumDecimals >= formatDecimal && formatDecimal !== 0
+                ? Math.min(minimumDecimals, formatDecimal) + 1
+                : formatDecimal,
         notation: compact ? 'compact' : 'standard',
         style: currency ? 'currency' : 'decimal',
         currency: 'USD',

diff --git a/src/utils/index.test.ts b/src/utils/index.test.ts
@@ -1,3 +1,4 @@
+import { formatDataNumber } from './formatDataNumber'
 import {
     formatNumber,
     getCollateralRatio,
@@ -167,4 +168,26 @@ describe('utils', () => {
             expect(returnTotalValue('2', '2', true, true)).toEqual('0')
         })
     })
+
+    describe('formatDataNumber', () => {
+        it('handles format decimals correctly', () => {
+            const input = '2457565485783295579314012'
+            expect(formatDataNumber(input, 18, 2)).toEqual('2,457,565.49')
+        })
+
+        it('handles dollar currency sign correctly', () => {
+            const input = '2457565485783295579314012'
+            expect(formatDataNumber(input, 18, 2, true)).toEqual('$2,457,565.49')
+        })
+
+        it('handles compact value and currency sign correctly', () => {
+            const input = '2457565485783295579314012'
+            expect(formatDataNumber(input, 18, 2, true, true)).toEqual('$2.46M')
+        })
+
+        it('handles compact format decimals and minimum decimals correctly', () => {
+            const input = '1000000000000000000'
+            expect(formatDataNumber(input, 18, 3, true, undefined, 4)).toEqual('$1.0000')
+        })
+    })
 })