From 38433b23ca32d17134982f082a0f7cf6bf218917 Mon Sep 17 00:00:00 2001 From: aelmanaa Date: Tue, 24 Jun 2025 08:17:25 +0200 Subject: [PATCH 1/2] fix --- src/components/CCIP/Drawer/TokenDrawer.tsx | 2 +- src/components/CCIP/Tooltip/RateTooltip.tsx | 3 +- src/config/data/ccip/utils.ts | 45 +++++++++++++-------- 3 files changed, 32 insertions(+), 18 deletions(-) diff --git a/src/components/CCIP/Drawer/TokenDrawer.tsx b/src/components/CCIP/Drawer/TokenDrawer.tsx index 9be122ad2de..e232f70780d 100644 --- a/src/components/CCIP/Drawer/TokenDrawer.tsx +++ b/src/components/CCIP/Drawer/TokenDrawer.tsx @@ -8,12 +8,12 @@ import { SupportedTokenConfig, Version, LaneFilter, - displayCapacity, determineTokenMechanism, PoolType, getTokenData, LaneConfig, } from "~/config/data/ccip/index.ts" +import { displayCapacity } from "~/config/data/ccip/utils.ts" import { useState } from "react" import { ChainType, ExplorerInfo, SupportedChain } from "~/config/index.ts" import LaneDrawer from "../Drawer/LaneDrawer.tsx" diff --git a/src/components/CCIP/Tooltip/RateTooltip.tsx b/src/components/CCIP/Tooltip/RateTooltip.tsx index 836644ab53d..ba33c92706f 100644 --- a/src/components/CCIP/Tooltip/RateTooltip.tsx +++ b/src/components/CCIP/Tooltip/RateTooltip.tsx @@ -1,5 +1,6 @@ import { Tooltip } from "~/features/common/Tooltip/Tooltip.tsx" -import { LaneFilter, SupportedTokenConfig, displayRate } from "~/config/data/ccip/index.ts" +import { LaneFilter, SupportedTokenConfig } from "~/config/data/ccip/index.ts" +import { displayRate } from "~/config/data/ccip/utils.ts" function RateTooltip({ destinationLane, diff --git a/src/config/data/ccip/utils.ts b/src/config/data/ccip/utils.ts index 29317824c9c..ca3214c54a6 100644 --- a/src/config/data/ccip/utils.ts +++ b/src/config/data/ccip/utils.ts @@ -2,8 +2,8 @@ import { SupportedChain } from "~/config/types.ts" import { chainToTechnology } from "~/config/chains.ts" import { NetworkFeeStructure, PoolType, TokenMechanism, LaneSpecificFeeKey, RateLimiterConfig } from "./types.ts" import { networkFees } from "./data.ts" -import BigNumberJs from "bignumber.js" import { commify } from "~/utils/index.js" +import { formatUnits } from "ethers" // Define valid pool type combinations and their corresponding mechanisms const POOL_MECHANISM_MAP: Record = { @@ -116,13 +116,6 @@ export const calculateMessaingNetworkFees = (sourceChain: SupportedChain, destin return calculateMessagingNetworkFeesDirect(laneSpecificFeeKey) } -const normalizeNumber = (bigNum: BigNumberJs, decimals = 18) => { - const divisor = new BigNumberJs(10).pow(decimals) - const normalized = bigNum.dividedBy(divisor) - - return normalized.toNumber() -} - const formatTime = (seconds: number) => { const minute = 60 const hour = 3600 // 60*60 @@ -154,25 +147,45 @@ const formatTime = (seconds: number) => { } } +/** + * Modern capacity display using ethers.js v6 formatUnits + */ export const displayCapacity = (decimals = 18, token: string, rateLimiterConfig?: RateLimiterConfig) => { if (!rateLimiterConfig?.isEnabled) { return "N/A" } - const capacity = String(rateLimiterConfig?.capacity || 0) - const numberWithoutDecimals = normalizeNumber(new BigNumberJs(capacity), decimals).toString() - return `${commify(numberWithoutDecimals)} ${token}` + const capacity = rateLimiterConfig?.capacity || "0" + // Use ethers.js formatUnits for precise decimal conversion + const formattedCapacity = formatUnits(capacity, decimals) + + // Remove trailing zeros and unnecessary decimal point + const cleanedCapacity = formattedCapacity.replace(/\.?0+$/, "") + + return `${commify(cleanedCapacity)} ${token}` } +/** + * Modern rate display using ethers.js v6 formatUnits + */ export const displayRate = (capacity: string, rate: string, symbol: string, decimals = 18) => { - const capacityNormalized = normalizeNumber(new BigNumberJs(capacity), decimals) // normalize capacity - const rateNormalized = normalizeNumber(new BigNumberJs(rate), decimals) // normalize capacity + // Use ethers.js formatUnits for precise decimal conversion + const capacityFormatted = formatUnits(capacity, decimals) + const rateFormatted = formatUnits(rate, decimals) + + // Convert to numbers for time calculation + const capacityNum = parseFloat(capacityFormatted) + const rateNum = parseFloat(rateFormatted) - const totalRefillTime = capacityNormalized / rateNormalized // in seconds + const totalRefillTime = capacityNum / rateNum // in seconds const displayTime = `${formatTime(totalRefillTime)}` + // Clean up formatting + const cleanedRate = rateFormatted.replace(/\.?0+$/, "") + const cleanedCapacity = capacityFormatted.replace(/\.?0+$/, "") + return { - rateSecond: `${commify(rateNormalized)} ${symbol}/second`, - maxThroughput: `Refills from 0 to ${commify(capacityNormalized)} ${symbol} in ${displayTime}`, + rateSecond: `${commify(cleanedRate)} ${symbol}/second`, + maxThroughput: `Refills from 0 to ${commify(cleanedCapacity)} ${symbol} in ${displayTime}`, } } From ca31740fcdf2dd7b59a6e3d5af041dbe3d782575 Mon Sep 17 00:00:00 2001 From: aelmanaa Date: Tue, 24 Jun 2025 08:19:34 +0200 Subject: [PATCH 2/2] fix --- src/components/CCIP/Drawer/TokenDrawer.tsx | 2 +- src/components/CCIP/Tooltip/RateTooltip.tsx | 3 +-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/CCIP/Drawer/TokenDrawer.tsx b/src/components/CCIP/Drawer/TokenDrawer.tsx index e232f70780d..9be122ad2de 100644 --- a/src/components/CCIP/Drawer/TokenDrawer.tsx +++ b/src/components/CCIP/Drawer/TokenDrawer.tsx @@ -8,12 +8,12 @@ import { SupportedTokenConfig, Version, LaneFilter, + displayCapacity, determineTokenMechanism, PoolType, getTokenData, LaneConfig, } from "~/config/data/ccip/index.ts" -import { displayCapacity } from "~/config/data/ccip/utils.ts" import { useState } from "react" import { ChainType, ExplorerInfo, SupportedChain } from "~/config/index.ts" import LaneDrawer from "../Drawer/LaneDrawer.tsx" diff --git a/src/components/CCIP/Tooltip/RateTooltip.tsx b/src/components/CCIP/Tooltip/RateTooltip.tsx index ba33c92706f..836644ab53d 100644 --- a/src/components/CCIP/Tooltip/RateTooltip.tsx +++ b/src/components/CCIP/Tooltip/RateTooltip.tsx @@ -1,6 +1,5 @@ import { Tooltip } from "~/features/common/Tooltip/Tooltip.tsx" -import { LaneFilter, SupportedTokenConfig } from "~/config/data/ccip/index.ts" -import { displayRate } from "~/config/data/ccip/utils.ts" +import { LaneFilter, SupportedTokenConfig, displayRate } from "~/config/data/ccip/index.ts" function RateTooltip({ destinationLane,