Display highest liquidity assets fix (#802)

* correct offset set, empty result for no network selected

* network-only policy used, logs deleted

* cache and network policy used

* Update src/components/pages/Home.tsx

Co-authored-by: Matthias Kretschmann <m@kretschmann.io>

Co-authored-by: Matthias Kretschmann <m@kretschmann.io>

src/components/pages/Home.tsx

@@ -21,10 +21,10 @@ import styles from './Home.module.css'
 async function getQueryHighest(
   chainIds: number[]
 ): Promise<[SearchQuery, string]> {
-  const dids = await getHighestLiquidityDIDs(chainIds)
+  const [dids, didsLength] = await getHighestLiquidityDIDs(chainIds)
   const queryHighest = {
     page: 1,
-    offset: dids.length,
+    offset: didsLength,
     query: {
       query_string: {
         query: `(${dids}) AND (${transformChainIdsListToQuery(
@@ -72,6 +72,7 @@ function SectionQueryResult({
   queryData?: string
 }) {
   const { appConfig } = useSiteMetadata()
+  const { chainIds } = useUserPreferences()
   const [result, setResult] = useState<QueryResult>()
   const [loading, setLoading] = useState<boolean>()
 
@@ -80,20 +81,31 @@ function SectionQueryResult({
     const source = axios.CancelToken.source()
 
     async function init() {
-      try {
+      if (chainIds.length === 0) {
-        setLoading(true)
+        const result: QueryResult = {
-        const result = await queryMetadata(query, source.token)
+          results: [],
-        if (queryData && result.totalResults > 0) {
+          page: 0,
-          const searchDIDs = queryData.split(' ')
+          totalPages: 0,
-          const sortedAssets = sortElements(result.results, searchDIDs)
+          totalResults: 0
-          const overflow = sortedAssets.length - 9
-          sortedAssets.splice(sortedAssets.length - overflow, overflow)
-          result.results = sortedAssets
         }
         setResult(result)
         setLoading(false)
-      } catch (error) {
+      } else {
-        Logger.log(error.message)
+        try {
+          setLoading(true)
+          const result = await queryMetadata(query, source.token)
+          if (queryData && result.totalResults > 0) {
+            const searchDIDs = queryData.split(' ')
+            const sortedAssets = sortElements(result.results, searchDIDs)
+            const overflow = sortedAssets.length - 9
+            sortedAssets.splice(sortedAssets.length - overflow, overflow)
+            result.results = sortedAssets
+          }
+          setResult(result)
+          setLoading(false)
+        } catch (error) {
+          Logger.error(error.message)
+        }
       }
     }
     init()

src/utils/subgraph.ts

@@ -151,7 +151,7 @@ export function getQueryContext(chainId: number): OperationContext {
     url: `${getSubgraphUri(
       Number(chainId)
     )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-    requestPolicy: 'cache-first'
+    requestPolicy: 'cache-and-network'
   }
 
   return queryContext
@@ -469,7 +469,7 @@ export async function getAssetsBestPrices(
 
 export async function getHighestLiquidityDIDs(
   chainIds: number[]
-): Promise<string> {
+): Promise<[string, number]> {
   const didList: string[] = []
   let highestLiquidiyAssets: HighestLiquidityAssetsPools[] = []
   for (const chain of chainIds) {
@@ -495,5 +495,5 @@ export async function getHighestLiquidityDIDs(
     .replace(/"/g, '')
     .replace(/(\[|\])/g, '')
     .replace(/(did:op:)/g, '0x')
-  return searchDids
+  return [searchDids, didList.length]
 }