getQueryContext abstraction

src/components/organisms/AssetActions/Pool/Graph.tsx

@@ -8,7 +8,6 @@ import {
   ChartTooltipItem,
   ChartTooltipOptions
 } from 'chart.js'
-import styles from './Graph.module.css'
 import Loader from '../../../atoms/Loader'
 import { formatPrice } from '../../../atoms/Price/PriceUnit'
 import { useUserPreferences } from '../../../../providers/UserPreferences'
@@ -17,9 +16,10 @@ import { darkModeConfig } from '../../../../../app.config'
 import Button from '../../../atoms/Button'
 import { Logger } from '@oceanprotocol/lib'
 import { useAsset } from '../../../../providers/Asset'
-import { gql, OperationContext, OperationResult } from 'urql'
+import { gql, OperationResult } from 'urql'
 import { PoolHistory } from '../../../../@types/apollo/PoolHistory'
-import { getSubgrahUri, fetchData } from '../../../../utils/subgraph'
+import { fetchData, getQueryContext } from '../../../../utils/subgraph'
+import styles from './Graph.module.css'
 
 declare type GraphType = 'liquidity' | 'price'
 
@@ -138,12 +138,7 @@ export default function Graph(): ReactElement {
 
   async function getPoolHistory() {
     try {
-      const queryContext: OperationContext = {
+      const queryContext = getQueryContext(ddo.chainId)
-        url: `${getSubgrahUri(
-          Number(ddo.chainId)
-        )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-        requestPolicy: 'network-only'
-      }
       const queryVariables = {
         id: price.address.toLowerCase(),
         block: lastBlock

src/components/organisms/AssetActions/Pool/index.tsx

@@ -15,11 +15,11 @@ import { PoolBalance } from '../../../../@types/TokenBalance'
 import Transactions from './Transactions'
 import Graph from './Graph'
 import { useAsset } from '../../../../providers/Asset'
-import { gql, OperationResult, OperationContext } from 'urql'
+import { gql, OperationResult } from 'urql'
 import { PoolLiquidity } from '../../../../@types/apollo/PoolLiquidity'
 import { useOcean } from '../../../../providers/Ocean'
 import { useWeb3 } from '../../../../providers/Web3'
-import { getSubgrahUri, fetchData } from '../../../../utils/subgraph'
+import { fetchData, getQueryContext } from '../../../../utils/subgraph'
 
 const REFETCH_INTERVAL = 5000
 
@@ -100,12 +100,7 @@ export default function Pool(): ReactElement {
   const [refreshPool, setRefreshPool] = useState(false)
 
   async function getPoolLiquidity() {
-    const queryContext: OperationContext = {
+    const queryContext = getQueryContext(ddo.chainId)
-      url: `${getSubgrahUri(
-        Number(ddo.chainId)
-      )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-      requestPolicy: 'network-only'
-    }
     const queryVariables = {
       id: price.address.toLowerCase(),
       shareId: `${price.address.toLowerCase()}-${ddo.publicKey[0].owner.toLowerCase()}`

src/utils/subgraph.ts

@@ -146,6 +146,17 @@ export function getSubgrahUri(chainId: number): string {
   return config.subgraphUri
 }
 
+export function getQueryContext(chainId: number): OperationContext {
+  const queryContext: OperationContext = {
+    url: `${getSubgrahUri(
+      Number(chainId)
+    )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
+    requestPolicy: 'network-only'
+  }
+
+  return queryContext
+}
+
 export async function fetchData(
   query: TypedDocumentNode,
   variables: any,
@@ -285,12 +296,7 @@ async function getAssetsPoolsExchangesAndDatatokenMap(
       datatoken_in: chainAssetLists[chainKey]
     }
 
-    const queryContext: OperationContext = {
+    const queryContext = getQueryContext(Number(chainKey))
-      url: `${getSubgrahUri(
-        Number(chainKey)
-      )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-      requestPolicy: 'network-only'
-    }
 
     const chainPoolPriceResponse: OperationResult<AssetsPoolPrice> =
       await fetchData(PoolQuery, poolVariables, queryContext)
@@ -354,13 +360,8 @@ export async function getPrice(asset: DDO): Promise<BestPrice> {
   const poolVariables = {
     datatokenAddress: asset?.dataToken.toLowerCase()
   }
+  const queryContext = getQueryContext(Number(asset.chainId))
 
-  const queryContext: OperationContext = {
-    url: `${getSubgrahUri(
-      asset.chainId
-    )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-    requestPolicy: 'network-only'
-  }
   const poolPriceResponse: OperationResult<AssetsPoolPrice> = await fetchData(
     AssetPoolPriceQuerry,
     poolVariables,
@@ -434,12 +435,7 @@ export async function getHighestLiquidityDIDs(
   const didList: string[] = []
   let highestLiquidiyAssets: HighestLiquidityAssetsPools[] = []
   for (const chain of chainIds) {
-    const queryContext: OperationContext = {
+    const queryContext = getQueryContext(Number(chain))
-      url: `${getSubgrahUri(
-        Number(chain)
-      )}/subgraphs/name/oceanprotocol/ocean-subgraph`,
-      requestPolicy: 'network-only'
-    }
     const fetchedPools: OperationResult<HighestLiquidityGraphAssets, any> =
       await fetchData(HighestLiquidityAssets, null, queryContext)
     highestLiquidiyAssets = highestLiquidiyAssets.concat(