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' && }
))}