diff --git a/packages/hooks/src/use-currency-formatter/use-currency-formatter.tsx b/packages/hooks/src/use-currency-formatter/use-currency-formatter.tsx index 23d207fd2..791319cf6 100644 --- a/packages/hooks/src/use-currency-formatter/use-currency-formatter.tsx +++ b/packages/hooks/src/use-currency-formatter/use-currency-formatter.tsx @@ -3,9 +3,14 @@ import { useMemo } from 'react'; import { NumberFormatter } from '@internationalized/number'; import Decimal from 'decimal.js-light'; +// any number under this limit is considered very small decimal const decimalLimit = 0.00000000009; + +// number used to replace very small decimals with <$0.00000001 const overDecimalLimitIndicator = 0.00000001; +const standardLimitDigits = 6; + type UseCurrencyFormatterProps = { currency?: string; compact?: boolean; @@ -54,20 +59,26 @@ const useCurrencyFormatter = (options: UseCurrencyFormatterProps = {}): UseCurre return standard.format(value); } + const isVerySmallDecimal = new Decimal(value).lte(decimalLimit); + // checks if decimal is lower than the limit - if (new Decimal(value).lte(decimalLimit)) { + if (isVerySmallDecimal) { return `<${decimal.format(overDecimalLimitIndicator)}`; } const length = value.toFixed(0).length; + // checks if the number is solely decimal const isOnlyDecimal = length === 1 && value < 1; if (isOnlyDecimal) { return decimal.format(value); } - return length > 6 ? compact.format(value) : standard.format(value); + // any number above limit digits amount will be formatted with compact approach + const shouldCompact = length > standardLimitDigits; + + return shouldCompact ? compact.format(value) : standard.format(value); }; };