diff --git a/src/components/atoms/Price/Conversion.tsx b/src/components/atoms/Price/Conversion.tsx
index 4682abe25..4f308c9db 100644
--- a/src/components/atoms/Price/Conversion.tsx
+++ b/src/components/atoms/Price/Conversion.tsx
@@ -68,9 +68,9 @@ export default function Conversion({
return (
- ≈ {priceConverted} {currency}
+ ≈ {priceConverted} {currency}
)
}
diff --git a/src/components/organisms/AssetActions/Pool/PoolStatistics.module.css b/src/components/organisms/AssetActions/Pool/PoolStatistics.module.css
index b0529e91c..e7935648e 100644
--- a/src/components/organisms/AssetActions/Pool/PoolStatistics.module.css
+++ b/src/components/organisms/AssetActions/Pool/PoolStatistics.module.css
@@ -4,3 +4,7 @@
.title {
composes: title from './index.module.css';
}
+
+.totalLiquidity {
+ composes: totalLiquidity from './index.module.css';
+}
diff --git a/src/components/organisms/AssetActions/Pool/PoolStatistics.tsx b/src/components/organisms/AssetActions/Pool/PoolStatistics.tsx
index f69cd5e1c..d400c650a 100644
--- a/src/components/organisms/AssetActions/Pool/PoolStatistics.tsx
+++ b/src/components/organisms/AssetActions/Pool/PoolStatistics.tsx
@@ -21,7 +21,7 @@ export default function PoolStatistics({
const { debug } = useUserPreferences()
const totalLiquidityInOcean =
- Number(totalBalance.ocean) + Number(totalBalance.datatoken) * Number(price)
+ totalBalance.ocean + totalBalance.datatoken * Number(price)
return (
@@ -29,8 +29,11 @@ export default function PoolStatistics({
{debug === true && }
+
-
)
}
diff --git a/src/components/organisms/AssetActions/Pool/index.module.css b/src/components/organisms/AssetActions/Pool/index.module.css
index 9d190af8a..7bcfebba6 100644
--- a/src/components/organisms/AssetActions/Pool/index.module.css
+++ b/src/components/organisms/AssetActions/Pool/index.module.css
@@ -32,3 +32,16 @@
font-size: var(--font-size-base);
margin-bottom: calc(var(--spacer) / 1.5);
}
+
+.totalLiquidity {
+ composes: token from './Token.module.css';
+ font-weight: var(--font-weight-base) !important;
+ font-size: var(--font-size-small);
+ padding-left: var(--font-size-base);
+}
+
+.totalLiquidity strong {
+ font-size: var(--font-size-base);
+ color: var(--brand-grey-dark);
+ line-height: 1;
+}
diff --git a/src/components/organisms/AssetActions/Pool/index.tsx b/src/components/organisms/AssetActions/Pool/index.tsx
index ee1a7d724..6338a2480 100644
--- a/src/components/organisms/AssetActions/Pool/index.tsx
+++ b/src/components/organisms/AssetActions/Pool/index.tsx
@@ -32,7 +32,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
const [poolTokens, setPoolTokens] = useState()
const [totalPoolTokens, setTotalPoolTokens] = useState()
const [dtSymbol, setDtSymbol] = useState()
- const [userLiquidity, setUserBalance] = useState()
+ const [userLiquidity, setUserLiquidity] = useState()
const [swapFee, setSwapFee] = useState()
const [showAdd, setShowAdd] = useState(false)
@@ -40,8 +40,7 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
const [isLoading, setIsLoading] = useState(true)
const hasAddedLiquidity =
- userLiquidity &&
- (Number(userLiquidity.ocean) > 0 || Number(userLiquidity.datatoken) > 0)
+ userLiquidity && (userLiquidity.ocean > 0 || userLiquidity.datatoken > 0)
const poolShare =
price?.ocean &&
@@ -49,6 +48,9 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
userLiquidity &&
((Number(poolTokens) / Number(totalPoolTokens)) * 100).toFixed(2)
+ const totalUserLiquidityInOcean =
+ userLiquidity?.ocean + userLiquidity?.datatoken * price?.value
+
useEffect(() => {
if (!ocean || !accountId || !price || !price.value) return
@@ -79,18 +81,17 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
// calculate user's provided liquidity based on pool tokens
const userOceanBalance =
- (Number(poolTokens) / Number(totalPoolTokens)) * Number(price.ocean)
+ (Number(poolTokens) / Number(totalPoolTokens)) * price.ocean
const userDtBalance =
- (Number(poolTokens) / Number(totalPoolTokens)) *
- Number(price.datatoken)
+ (Number(poolTokens) / Number(totalPoolTokens)) * price.datatoken
const userLiquidity = {
ocean: userOceanBalance,
datatoken: userDtBalance
}
- setUserBalance(userLiquidity)
+ setUserLiquidity(userLiquidity)
// Get swap fee
// swapFee is tricky: to get 0.1% you need to convert from 0.001
@@ -155,6 +156,10 @@ export default function Pool({ ddo }: { ddo: DDO }): ReactElement {
{debug === true && }
+
diff --git a/src/components/organisms/AssetContent/index.module.css b/src/components/organisms/AssetContent/index.module.css
index aed5069f6..874cc5810 100644
--- a/src/components/organisms/AssetContent/index.module.css
+++ b/src/components/organisms/AssetContent/index.module.css
@@ -12,8 +12,7 @@
@media (min-width: 60rem) {
.grid {
- /* lazy golden ratio */
- grid-template-columns: 1.618fr minmax(0, 1fr);
+ grid-template-columns: 1.5fr minmax(0, 1fr);
}
.sticky {
diff --git a/src/components/pages/Home.tsx b/src/components/pages/Home.tsx
index 6e627de5c..45989bf6a 100644
--- a/src/components/pages/Home.tsx
+++ b/src/components/pages/Home.tsx
@@ -14,7 +14,7 @@ import { useOcean } from '@oceanprotocol/react'
const queryHighest = {
page: 1,
offset: 3,
- query: { 'price.ocean': [0, 99999] },
+ query: { 'price.type': ['pool'] },
sort: { 'price.value': 1 }
}