feat: adapts the formatter to not round but rather truncate to one de…

…cimal digit

src/hooks/useSafeStats.ts

@@ -33,7 +33,7 @@ export const fetchTotalSafesDeployed = async (): Promise<number | null> => {
 }
 
 export const useSafeStats = (): Array<string | null> => {
-  const { totalAssets, totalSafesDeployed, totalTransactions } = useContext(SafeStatsContext)
+  const { totalTransactions, totalAssets, totalSafesDeployed } = useContext(SafeStatsContext)
 
   const formattedTotalTransactions = totalTransactions ? formatValue(totalTransactions) : null
   const formattedTotalAssets = totalAssets ? '$' + formatValue(totalAssets) : null

src/lib/__test__/formatValue.test.ts

@@ -2,47 +2,48 @@ import { formatValue } from '@/lib/formatValue'
 
 describe('formatValue', () => {
   it('formats value in trillions', () => {
-    expect(formatValue(2308.73e12)).toBe('2309T')
-    expect(formatValue(508.73e12)).toBe('509T')
+    expect(formatValue(2308.73e12)).toBe('2308T')
+    expect(formatValue(508.73e12)).toBe('508T')
     expect(formatValue(234.23e12)).toBe('234T')
-    expect(formatValue(9.99e12)).toBe('10T')
+    expect(formatValue(9.99e12)).toBe('9.9T')
     expect(formatValue(2e12)).toBe('2T')
     expect(formatValue(1.23e12)).toBe('1.2T')
     expect(formatValue(0.75e12)).toBe('750B')
   })
 
   it('formats value in billions', () => {
     expect(formatValue(2318.73e9)).toBe('2.3T')
-    expect(formatValue(508.73e9)).toBe('509B')
+    expect(formatValue(508.73e9)).toBe('508B')
     expect(formatValue(234.23e9)).toBe('234B')
-    expect(formatValue(9.99e9)).toBe('10B')
+    expect(formatValue(9.99e9)).toBe('9.9B')
     expect(formatValue(2e9)).toBe('2B')
     expect(formatValue(1.23e9)).toBe('1.2B')
     expect(formatValue(0.75e9)).toBe('750M')
   })
 
   it('formats value in millions', () => {
     expect(formatValue(2318.73e6)).toBe('2.3B')
-    expect(formatValue(508.73e6)).toBe('509M')
+    expect(formatValue(508.73e6)).toBe('508M')
     expect(formatValue(234.23e6)).toBe('234M')
-    expect(formatValue(9.99e6)).toBe('10M')
+    expect(formatValue(9.99e6)).toBe('9.9M')
+    expect(formatValue(4.35e6)).toBe('4.3M')
     expect(formatValue(2e6)).toBe('2M')
     expect(formatValue(1.23e6)).toBe('1.2M')
     expect(formatValue(0.75e6)).toBe('750K')
   })
 
   it('formats value in thousands', () => {
     expect(formatValue(2318.73e3)).toBe('2.3M')
-    expect(formatValue(508.73e3)).toBe('509K')
+    expect(formatValue(508.73e3)).toBe('508K')
     expect(formatValue(234.23e3)).toBe('234K')
-    expect(formatValue(9.99e3)).toBe('10K')
+    expect(formatValue(9.99e3)).toBe('9.9K')
     expect(formatValue(2e3)).toBe('2K')
     expect(formatValue(1.23e3)).toBe('1.2K')
     expect(formatValue(0.75e3)).toBe('750')
   })
 
   it('formats value below 1e3', () => {
-    expect(formatValue(21599)).toBe('22K')
+    expect(formatValue(21599)).toBe('21K')
     expect(formatValue(2999)).toBe('3K')
     expect(formatValue(123)).toBe('123')
   })

src/lib/formatValue.ts

@@ -1,7 +1,36 @@
+/**
+ * Formats the given number in thousands order of magnitude and truncates the decimal part to 1 digit.
+ *
+ * @param {number} value - The number to be formatted.
+ * @returns {string} The formatted string representation of the number.
+ */
 export function formatValue(value: number): string {
   const numberFormat = new Intl.NumberFormat(undefined, {
     notation: 'compact',
+    maximumFractionDigits: 2,
   })
 
-  return `${numberFormat.format(value)}`
+  const parts = numberFormat.formatToParts(value)
+  let integer = '0'
+  let decimalPart = ''
+  let compact = ''
+
+  for (const part of parts) {
+    if (part.type === 'integer') {
+      integer = part.value
+    } else if (part.type === 'decimal') {
+      if (integer.length === 1) {
+        decimalPart = part.value
+      }
+    } else if (part.type === 'fraction') {
+      if (integer.length === 1) {
+        // Truncates the fraction part to 1 decimal place if the value has a single integer digit
+        decimalPart = `${decimalPart}${part.value[0]}`
+      }
+    } else if (part.type === 'compact') {
+      compact = part.value
+    }
+  }
+
+  return `${integer}${decimalPart}${compact}`
 }