chore: layer bigNumberFormatter composable accepts computed prop for …

…decimalPlaces
InjectiveLabs · Mar 18, 2024 · 4cd76a0 · 4cd76a0
1 parent a256e8c
commit 4cd76a0
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 14 deletions.
diff --git a/layer/composables/useSharedBigNumberFormatted.ts b/layer/composables/useSharedBigNumberFormatted.ts
@@ -114,8 +114,8 @@ const getNumberMinimalDecimals = (
 export function useSharedBigNumberFormatter(
   value: ComputedRef<string | Number | BigNumberInBase>,
   options: {
-    decimalPlaces?: number
-    minimalDecimalPlaces?: number
+    decimalPlaces?: number | ComputedRef<number | undefined>
+    minimalDecimalPlaces?: number | ComputedRef<number | undefined>
     abbreviationFloor?: number /** Wether we should abbreviate numbers, for example 1,234,455 => 1M */
     roundingMode?: BigNumber.RoundingMode
     displayAbsoluteDecimalPlace?: boolean /** Explained above */
@@ -135,14 +135,16 @@ export function useSharedBigNumberFormatter(
   })
 
   const roundingMode = options.roundingMode || DEFAULT_ROUNDING_MODE
-  const decimalPlaces = options.decimalPlaces ?? DEFAULT_DECIMAL_PLACES
+  const decimalPlaces = computed(
+    () => toValue(options.decimalPlaces) ?? DEFAULT_DECIMAL_PLACES
+  )
   const displayAbsoluteDecimalPlace = !!options.displayAbsoluteDecimalPlace
 
   const valueToFixed = computed(() => {
     if (valueToBigNumber.value.isNaN() || valueToBigNumber.value.isZero()) {
       return !!options.shouldTruncate
         ? '0'
-        : getFormattedZeroValue(decimalPlaces)
+        : getFormattedZeroValue(decimalPlaces.value)
     }
 
     if (
@@ -153,7 +155,7 @@ export function useSharedBigNumberFormatter(
     }
 
     const roundedValue = valueToBigNumber.value.toFixed(
-      decimalPlaces,
+      decimalPlaces.value,
       roundingMode
     )
 
@@ -168,7 +170,7 @@ export function useSharedBigNumberFormatter(
     if (valueToBigNumber.value.isNaN() || valueToBigNumber.value.isZero()) {
       return !!options.shouldTruncate
         ? '0'
-        : getFormattedZeroValue(decimalPlaces)
+        : getFormattedZeroValue(decimalPlaces.value)
     }
 
     if (
@@ -181,12 +183,12 @@ export function useSharedBigNumberFormatter(
     const { minimalDecimalPlaces, minimalDisplayAmount } =
       getNumberMinimalDecimals(
         valueToBigNumber,
-        options.minimalDecimalPlaces,
+        toValue(options.minimalDecimalPlaces),
         displayAbsoluteDecimalPlace
       )
 
     const roundedValue = valueToBigNumber.value.toFixed(
-      decimalPlaces,
+      decimalPlaces.value,
       roundingMode
     )
 
@@ -198,7 +200,7 @@ export function useSharedBigNumberFormatter(
       return `< ${minimalDisplayAmount.toFormat(minimalDecimalPlaces)}`
     }
 
-    return new BigNumberInBase(roundedValue).toFormat(decimalPlaces)
+    return new BigNumberInBase(roundedValue).toFormat(decimalPlaces.value)
   })
 
   return {

diff --git a/layer/nuxt-config/vite/index.ts b/layer/nuxt-config/vite/index.ts
@@ -50,7 +50,11 @@ export default defineConfig({
 
   optimizeDeps: {
     exclude: ['fsevents'],
-    include: []
+    include: [
+      '@injectivelabs/sdk-ts',
+      '@injectivelabs/sdk-ui-ts',
+      '@injectivelabs/token-metadata'
+    ]
   }
 }) as ViteConfig
 

diff --git a/layer/package.json b/layer/package.json
@@ -10,11 +10,11 @@
   "dependencies": {
     "@injectivelabs/networks": "1.14.11-beta.2",
     "@injectivelabs/nuxt-bugsnag": "0.0.3",
-    "@injectivelabs/sdk-ts": "1.14.11-beta.14",
-    "@injectivelabs/sdk-ui-ts": "1.14.11-beta.19",
-    "@injectivelabs/token-metadata": "1.14.11-beta.10",
     "@injectivelabs/utils": "1.14.11-beta.1",
-    "@injectivelabs/wallet-ts": "1.14.11-beta.17",
+    "@injectivelabs/sdk-ts": "1.14.11-beta.15",
+    "@injectivelabs/sdk-ui-ts": "1.14.11-beta.20",
+    "@injectivelabs/token-metadata": "1.14.11-beta.11",
+    "@injectivelabs/wallet-ts": "1.14.11-beta.18",
     "@vueuse/integrations": "^10.7.1",
     "floating-vue": "2.0.0-beta.24",
     "vue-gtag": "^2.0.1",