diff --git a/src/components/atoms/Price/Conversion.module.css b/src/components/atoms/Price/Conversion.module.css
index e7df076f4..0d1849ae8 100644
--- a/src/components/atoms/Price/Conversion.module.css
+++ b/src/components/atoms/Price/Conversion.module.css
@@ -6,6 +6,9 @@
font-weight: var(--font-weight-base);
}
+.removeTvlPadding {
+ padding-left: 0 !important;
+}
/* fiat currency symbol */
.conversion strong span {
font-weight: var(--font-weight-base);
diff --git a/src/components/atoms/Price/Conversion.tsx b/src/components/atoms/Price/Conversion.tsx
index 558d9d073..7dfe22761 100644
--- a/src/components/atoms/Price/Conversion.tsx
+++ b/src/components/atoms/Price/Conversion.tsx
@@ -10,11 +10,13 @@ const cx = classNames.bind(styles)
export default function Conversion({
price,
className,
- hideApproximateSymbol
+ hideApproximateSymbol,
+ showTVLLabel
}: {
price: string // expects price in OCEAN, not wei
className?: string
hideApproximateSymbol?: boolean
+ showTVLLabel?: boolean
}): ReactElement {
const { prices } = usePrices()
const { currency, locale } = useUserPreferences()
@@ -27,6 +29,7 @@ export default function Conversion({
const styleClasses = cx({
conversion: true,
+ removeTvlPadding: showTVLLabel,
[className]: className
})
@@ -61,6 +64,7 @@ export default function Conversion({
className={styleClasses}
title="Approximation based on current OCEAN spot price on Coingecko"
>
+ {showTVLLabel && 'TVL'}
{!hideApproximateSymbol && '≈ '}
{' '}
{!isFiat && currency}
diff --git a/src/components/organisms/AssetActions/Pool/TokenList.tsx b/src/components/organisms/AssetActions/Pool/TokenList.tsx
index a04fcc790..50cafa339 100644
--- a/src/components/organisms/AssetActions/Pool/TokenList.tsx
+++ b/src/components/organisms/AssetActions/Pool/TokenList.tsx
@@ -11,7 +11,8 @@ export default function TokenList({
dtSymbol,
poolShares,
conversion,
- highlight
+ highlight,
+ showTVLLabel
}: {
title: string | ReactNode
children: ReactNode
@@ -21,6 +22,7 @@ export default function TokenList({
poolShares: string
conversion: number
highlight?: boolean
+ showTVLLabel?: boolean
}): ReactElement {
return (
@@ -33,6 +35,7 @@ export default function TokenList({
)}
diff --git a/src/components/organisms/AssetActions/Pool/index.tsx b/src/components/organisms/AssetActions/Pool/index.tsx
index c06fbe4d4..a413beed8 100644
--- a/src/components/organisms/AssetActions/Pool/index.tsx
+++ b/src/components/organisms/AssetActions/Pool/index.tsx
@@ -288,7 +288,7 @@ export default function Pool(): ReactElement {
diff --git a/src/components/pages/Home.tsx b/src/components/pages/Home.tsx
index 401b1eae8..2b3019a62 100644
--- a/src/components/pages/Home.tsx
+++ b/src/components/pages/Home.tsx
@@ -24,11 +24,9 @@ async function getQueryHighest(
chainIds: number[]
): Promise<[SearchQuery, string]> {
const dids = await getHighestLiquidityDIDs(chainIds)
-
- // TODO: this query needs to adapt to chainIds
const queryHighest = {
page: 1,
- offset: 9,
+ offset: dids.length,
query: {
query_string: {
query: `(${dids}) AND (${transformChainIdsListToQuery(
@@ -43,7 +41,6 @@ async function getQueryHighest(
}
function getQueryLatest(chainIds: number[]): SearchQuery {
- // TODO: this query needs to adapt to chainIds
return {
page: 1,
offset: 9,
@@ -89,12 +86,9 @@ function SectionQueryResult({
try {
setLoading(true)
const result = await queryMetadata(query, source.token)
- if (queryData && result.totalResults > 0 && result.totalResults <= 15) {
+ if (queryData && result.totalResults > 0) {
const searchDIDs = queryData.split(' ')
const sortedAssets = sortElements(result.results, searchDIDs)
- // We take more assets than we need from the subgraph (to make sure
- // all the 9 assets with highest liquidity we need are in OceanDB)
- // so we need to get rid of the surplus
const overflow = sortedAssets.length - 9
sortedAssets.splice(sortedAssets.length - overflow, overflow)
result.results = sortedAssets
diff --git a/src/utils/subgraph.ts b/src/utils/subgraph.ts
index 5c68dc685..dbafc0b34 100644
--- a/src/utils/subgraph.ts
+++ b/src/utils/subgraph.ts
@@ -16,6 +16,10 @@ import {
AssetsFreePrice_dispensers as AssetFreePriceDispenser
} from '../@types/apollo/AssetsFreePrice'
import { AssetPreviousOrder } from '../@types/apollo/AssetPreviousOrder'
+import {
+ HighestLiquidityAssets_pools as HighestLiquidityAssetsPools,
+ HighestLiquidityAssets as HighestLiquidityGraphAssets
+} from '../@types/apollo/HighestLiquidityAssets'
export interface PriceList {
[key: string]: string
@@ -122,16 +126,17 @@ const PreviousOrderQuery = gql`
}
`
const HighestLiquidityAssets = gql`
- query HighestLiquidiyAssets {
+ query HighestLiquidityAssets {
pools(
where: { datatokenReserve_gte: 1 }
- orderBy: valueLocked
+ orderBy: oceanReserve
orderDirection: desc
first: 15
) {
id
datatokenAddress
valueLocked
+ oceanReserve
}
}
`
@@ -426,6 +431,7 @@ export async function getHighestLiquidityDIDs(
chainIds: number[]
): Promise {
const didList: string[] = []
+ let highestLiquidiyAssets: HighestLiquidityAssetsPools[] = []
for (const chain of chainIds) {
const queryContext: OperationContext = {
url: `${getSubgrahUri(
@@ -433,19 +439,21 @@ export async function getHighestLiquidityDIDs(
)}/subgraphs/name/oceanprotocol/ocean-subgraph`,
requestPolicy: 'network-only'
}
- const fetchedPools = await fetchData(
- HighestLiquidityAssets,
- null,
- queryContext
+ const fetchedPools: OperationResult =
+ await fetchData(HighestLiquidityAssets, null, queryContext)
+ highestLiquidiyAssets = highestLiquidiyAssets.concat(
+ fetchedPools.data.pools
)
- if (fetchedPools.data?.pools?.length === 0) return null
- for (let i = 0; i < fetchedPools.data.pools.length; i++) {
- if (!fetchedPools.data.pools[i].datatokenAddress) continue
- const did = web3.utils
- .toChecksumAddress(fetchedPools.data.pools[i].datatokenAddress)
- .replace('0x', 'did:op:')
- didList.push(did)
- }
+ }
+ highestLiquidiyAssets
+ .sort((a, b) => a.oceanReserve - b.oceanReserve)
+ .reverse()
+ for (let i = 0; i < highestLiquidiyAssets.length; i++) {
+ if (!highestLiquidiyAssets[i].datatokenAddress) continue
+ const did = web3.utils
+ .toChecksumAddress(highestLiquidiyAssets[i].datatokenAddress)
+ .replace('0x', 'did:op:')
+ didList.push(did)
}
const searchDids = JSON.stringify(didList)
.replace(/,/g, ' ')