diff --git a/packages/checkout/widgets-lib/src/lib/utils.test.ts b/packages/checkout/widgets-lib/src/lib/utils.test.ts index a694033f65..a9eb525435 100644 --- a/packages/checkout/widgets-lib/src/lib/utils.test.ts +++ b/packages/checkout/widgets-lib/src/lib/utils.test.ts @@ -435,8 +435,20 @@ describe('utils', () => { expect(tokenValueFormat('0.0000012')).toEqual('0.000001'); }); - it(`should format to maximum of ${DEFAULT_TOKEN_FORMATTING_DECIMALS} decimal places`, () => { - expect(tokenValueFormat('0.0000001')).toEqual('0.000000'); + it(`should format to default maximum of ${DEFAULT_TOKEN_FORMATTING_DECIMALS} decimal places`, () => { + expect(tokenValueFormat('0.00000012345')).toEqual('0.000000'); + }); + + it('should format to custom maximum decimal places of 3', () => { + expect(tokenValueFormat('0.00000012345', 3)).toEqual('0.000'); + }); + + it('should format to custom maximum decimal places of 18', () => { + expect(tokenValueFormat('0.000000000000000000', 18)).toEqual('0.000000000000000000'); + }); + + it('should format to first non zero digit before maximum decimal places of 18', () => { + expect(tokenValueFormat('0.0000000012345', 18)).toEqual('0.000000001'); }); }); diff --git a/packages/checkout/widgets-lib/src/lib/utils.ts b/packages/checkout/widgets-lib/src/lib/utils.ts index 8341f30c03..227cc8690b 100644 --- a/packages/checkout/widgets-lib/src/lib/utils.ts +++ b/packages/checkout/widgets-lib/src/lib/utils.ts @@ -93,7 +93,10 @@ const tokenValueFormatDecimals = (s: string, numDecimals: number): string => { return parseFloat(s.substring(0, pointIndex + numDecimals + 1)).toFixed(numDecimals); }; -export const tokenValueFormat = (s: Number | string): string => { +export const tokenValueFormat = ( + s: Number | string, + maxDecimals: number = DEFAULT_TOKEN_FORMATTING_DECIMALS, +): string => { const asString = s.toString(); // Only float numbers will be handled by this function @@ -104,7 +107,19 @@ export const tokenValueFormat = (s: Number | string): string => { // 1. The number provided starts with "." (e.g. ".012") // 2. The number starts with 0 (e.g. "0.234") if (asString[0] === '.' || parseInt(asString[0], 10) === 0) { - return tokenValueFormatDecimals(asString, DEFAULT_TOKEN_FORMATTING_DECIMALS); + let formattedDecimals = Math.min(maxDecimals, DEFAULT_TOKEN_FORMATTING_DECIMALS); + let formattedValue = tokenValueFormatDecimals(asString, formattedDecimals); + if (parseFloat(formattedValue) === 0) { + // Ensure we return a value greater than 0 + while ((formattedValue[formattedValue.length - 1] || '') === '0' && formattedDecimals < maxDecimals) { + formattedDecimals += 1; + formattedValue = tokenValueFormatDecimals(asString, formattedDecimals); + if ((formattedValue[formattedValue.length - 1] || '') !== '0') { + break; + } + } + } + return formattedValue; } // In case the number is greater than 1 then the formatting will look slightly different. diff --git a/packages/checkout/widgets-lib/src/widgets/swap/components/SwapForm.tsx b/packages/checkout/widgets-lib/src/widgets/swap/components/SwapForm.tsx index bfac0da3e0..286e23763c 100644 --- a/packages/checkout/widgets-lib/src/widgets/swap/components/SwapForm.tsx +++ b/packages/checkout/widgets-lib/src/widgets/swap/components/SwapForm.tsx @@ -276,10 +276,13 @@ export function SwapForm({ data }: SwapFromProps) { setToAmount( formatZeroAmount( - tokenValueFormat(utils.formatUnits( - result.quote.amount.value, + tokenValueFormat( + utils.formatUnits( + result.quote.amount.value, + result.quote.amount.token.decimals, + ), result.quote.amount.token.decimals, - )), + ), ), );