diff --git a/src/components/atoms/Price/Conversion.tsx b/src/components/atoms/Price/Conversion.tsx index f0ed81a42..81b76d046 100644 --- a/src/components/atoms/Price/Conversion.tsx +++ b/src/components/atoms/Price/Conversion.tsx @@ -40,7 +40,7 @@ export default function Conversion({ const fiatValue = values[currency.toLowerCase()] const converted = fiatValue * Number(price) const convertedFormatted = Number( - formatCurrency(converted, currency, undefined, true) + formatCurrency(converted, currency, 'en', true) ).toFixed(2) setPriceConverted(`${convertedFormatted}`) diff --git a/src/components/atoms/Price/PriceUnit.tsx b/src/components/atoms/Price/PriceUnit.tsx index 1236bb9a1..d2c71a9bd 100644 --- a/src/components/atoms/Price/PriceUnit.tsx +++ b/src/components/atoms/Price/PriceUnit.tsx @@ -27,11 +27,14 @@ export default function PriceUnit({ return (
- {Number.isInteger(Number(price)) - ? price - : Number.isNaN(Number(price)) + {Number.isNaN(Number(price)) ? '-' - : formatCurrency(Number(price), '', undefined, false, true)}{' '} + : formatCurrency(Number(price), '', 'en', false, { + // Not exactly clear what `significant figures` are for this library, + // but setting this seems to give us the formatting we want. + // See https://github.com/oceanprotocol/market/issues/70 + significantFigures: 4 + })}{' '} {symbol || 'OCEAN'} {conversion && }
diff --git a/src/components/molecules/Wallet/Details.tsx b/src/components/molecules/Wallet/Details.tsx index 149fb214a..ab4a2466e 100644 --- a/src/components/molecules/Wallet/Details.tsx +++ b/src/components/molecules/Wallet/Details.tsx @@ -17,7 +17,9 @@ export default function Details(): ReactElement { {Object.entries(balance).map(([key, value]) => (
  • {key.toUpperCase()}{' '} - {formatCurrency(value, '', undefined, true, true)} + {formatCurrency(Number(value), '', 'en', false, { + significantFigures: 4 + })} {key === 'ocean' && }
  • ))}