diff --git a/common/util/format.ts b/common/util/format.ts index 20dc0100..c68f319e 100644 --- a/common/util/format.ts +++ b/common/util/format.ts @@ -29,6 +29,20 @@ export function formatPercent(zeroToOne: number) { return (zeroToOne * 100).toFixed(decimalPlaces) + '%' } +// Eg 1234567.89 => 1.23M; 5678 => 5.68K +export function formatLargeNumber(num: number, sigfigs = 3): string { + const absNum = Math.abs(num) + if (absNum < 1000) { + return num.toPrecision(sigfigs) + } + + const suffix = ['', 'K', 'M', 'B', 'T', 'Q'] + const suffixIdx = Math.floor(Math.log10(absNum) / 3) + const suffixStr = suffix[suffixIdx] + const numStr = (num / Math.pow(10, 3 * suffixIdx)).toPrecision(sigfigs) + return `${numStr}${suffixStr}` +} + export function toCamelCase(words: string) { const camelCase = words .split(' ') diff --git a/web/components/contract/contract-card.tsx b/web/components/contract/contract-card.tsx index 19f0842a..cf910ef3 100644 --- a/web/components/contract/contract-card.tsx +++ b/web/components/contract/contract-card.tsx @@ -1,7 +1,7 @@ import clsx from 'clsx' import Link from 'next/link' import { Row } from '../layout/row' -import { formatPercent } from 'common/util/format' +import { formatLargeNumber, formatPercent } from 'common/util/format' import { Contract, contractPath, @@ -255,7 +255,7 @@ export function NumericResolutionOrExpectation(props: { ) : ( <>