update subgraph service querying implementation

.github/workflows/ci.yml

@@ -46,6 +46,7 @@ jobs:
           POSTHOG_HOSTNAME_HTTP: ${{ secrets.MAINNET_POSTHOG_HOSTNAME_HTTP }}
           GATSBY_GTM_SUPPORT: true
           GATSBY_GTM_ID: ${{ secrets.GTM_ID }}
+          SUBGRAPH_API_KEY: ${{ secrets.SUBGRAPH_API_KEY }}
 
       - uses: actions/upload-artifact@v3
         with:

src/config/subgraph.ts

@@ -1,5 +1,9 @@
 export const T_NETWORK_SUBGRAPH_URL =
   "https://api.studio.thegraph.com/query/24143/threshold/0.0.4"
 
-export const TBTC_SUBGRAPH_URL =
-  "https://api.thegraph.com/subgraphs/name/suntzu93/threshold-tbtc"
+export const T_NETWORK_SUBGRAPH_ID =
+  "5TJAMbsRwm1avUTV4CofaLT4apfQoAiNcysEit9BWr6R"
+
+export const TBTC_SUBGRAPH_ID = "DETCX5Xm6tJfctRcZAxhQB9q3aK8P4BXLbujHmzEBXYV"
+
+export const SUBGRAPH_GATEWAY_URL = `https://gateway-arbitrum.network.thegraph.com/api/${process.env.SUBGRAPH_API_KEY}/subgraphs/id/`

src/hooks/tBTC/useTotalMints.ts

@@ -1,5 +1,5 @@
 import { gql, request } from "graphql-request"
-import { TBTC_SUBGRAPH_URL } from "../../config/subgraph"
+import { TBTC_SUBGRAPH_ID, SUBGRAPH_GATEWAY_URL } from "../../config/subgraph"
 import { useEffect, useState } from "react"
 
 export const useTotalMints = () => {
@@ -22,11 +22,10 @@ export const useTotalMints = () => {
         ) {
           id
         }
-      }
-    `
+      }`
 
       const result: { transactions: { id: string }[] } = await request(
-        TBTC_SUBGRAPH_URL,
+        SUBGRAPH_GATEWAY_URL + TBTC_SUBGRAPH_ID,
         query
       )
 

src/hooks/useQuery.ts

@@ -1,3 +1,4 @@
+import { SUBGRAPH_GATEWAY_URL } from "../config/subgraph"
 import { useEffect, useReducer, useRef, Reducer } from "react"
 import { request } from "graphql-request"
 
@@ -34,10 +35,7 @@ const fetchReducer = <T>(state: State<T>, action: Action<T>): State<T> => {
   }
 }
 
-function useQuery<T = unknown>(
-  graphEndpoint: string,
-  query?: string
-): State<T> {
+function useQuery<T = unknown>(subgraphId: string, query?: string): State<T> {
   const shouldUpdateState = useRef<boolean>(true)
   const initialState: State<T> = {
     error: undefined,
@@ -59,7 +57,7 @@ function useQuery<T = unknown>(
       dispatch({ type: Actions.Start })
 
       try {
-        const response = await request(graphEndpoint, query)
+        const response = await request(SUBGRAPH_GATEWAY_URL + subgraphId, query)
         if (!shouldUpdateState.current) return
 
         dispatch({ type: Actions.Success, payload: response })

src/templates/earn-page/btc/index.tsx

@@ -7,7 +7,7 @@ import { BodyLg, H4, H5 } from "../../../components"
 import { LPCardGroup } from "../../../components/LPCard"
 import { TBTCStats } from "./TBTCStats"
 import { gql } from "graphql-request"
-import { TBTC_SUBGRAPH_URL } from "../../../config/subgraph"
+import { TBTC_SUBGRAPH_ID } from "../../../config/subgraph"
 import useQuery from "../../../hooks/useQuery"
 import { LatestMint, LatestMints } from "./LatestMints"
 import ExternalButtonLink from "../../../components/Buttons/ExternalButtonLink"
@@ -32,7 +32,7 @@ const BTCPageTemplate: FC<any> = ({ data }) => {
     tbtctoken: { currentTokenHolders: string; totalSupply: string }
     transactions: LatestMint[]
   }>(
-    TBTC_SUBGRAPH_URL,
+    TBTC_SUBGRAPH_ID,
     gql`
       query {
         tbtctoken(id: "TBTCToken") {

src/templates/earn-page/staker/NetworkDistribution/index.tsx

@@ -4,7 +4,7 @@ import Card from "../../../../components/Card"
 import TStakedChart from "./TStakedChart"
 import { BodyLg, H2, H3, H5, LabelMd } from "../../../../components"
 import useQuery from "../../../../hooks/useQuery"
-import { T_NETWORK_SUBGRAPH_URL } from "../../../../config/subgraph"
+import { T_NETWORK_SUBGRAPH_ID } from "../../../../config/subgraph"
 import {
   exchangeAPI,
   formatFiatCurrencyAmount,
@@ -20,33 +20,33 @@ import {
 
 function NetworkDistribution() {
   const { isFetching, data, error } = useQuery<{
-    epoches: { totalStaked: string }[]
+    daometric: { stakedTotal: string }
     minStakeAmounts: { amount: string }[]
   }>(
-    T_NETWORK_SUBGRAPH_URL,
+    T_NETWORK_SUBGRAPH_ID,
     gql`
       query {
-        epoches(orderBy: startTime, orderDirection: desc, first: 1) {
-          totalStaked
+        daometric(id: "dao-metrics") {
+          stakedTotal
         }
         minStakeAmounts(first: 1, orderBy: updatedAt, orderDirection: desc) {
           amount
         }
       }
     `
   )
-  const { epoches, minStakeAmounts } = data || {
-    epoches: [{ totalStaked: "0" }],
+  const { daometric, minStakeAmounts } = data || {
+    daometric: { stakedTotal: "0" },
     minStakeAmounts: [{ amount: "0" }],
   }
-  const totalStaked = !error ? epoches[0].totalStaked : "0"
-  const forrmattedTotalStaked = formatTokenAmount(totalStaked)
+  const stakedTotal = !error ? daometric.stakedTotal : "0"
+  const forrmattedTotalStaked = formatTokenAmount(stakedTotal)
   const minStakeAmount = formatTokenAmount(
     !error ? minStakeAmounts[0].amount : "0"
   )
   const tPrice = useTTokenPrice()
   const totalValueStakedInUSD = formatFiatCurrencyAmount(
-    exchangeAPI.toUsdBalance(formatUnits(totalStaked), tPrice).toString()
+    exchangeAPI.toUsdBalance(formatUnits(stakedTotal), tPrice).toString()
   )
 
   return (

src/templates/governance-page/ThresholdDaoDataSection.tsx

@@ -8,7 +8,7 @@ import { PageSection } from "../../components/PageSection"
 import { H2, H3, LabelMd } from "../../components"
 import { ExternalLinkHref } from "../../components/Navbar/types"
 import { StatBoxGroup } from "../../components/StatBox"
-import { T_NETWORK_SUBGRAPH_URL } from "../../config/subgraph"
+import { T_NETWORK_SUBGRAPH_ID } from "../../config/subgraph"
 import useQuery from "../../hooks/useQuery"
 import { formatFiatCurrencyAmount, formatTokenAmount } from "../../utils"
 import { useBalanceOfDAOTreasury } from "../../hooks/useBalanceOfDAOTreasury"
@@ -21,7 +21,7 @@ const ThresholdDaoDataSection = () => {
     tokenholderDelegations: { id: string }[]
     stakeDelegations: { id: string }[]
   }>(
-    T_NETWORK_SUBGRAPH_URL,
+    T_NETWORK_SUBGRAPH_ID,
     gql`
       query {
         daometric(id: "dao-metrics") {

src/templates/home-page/Hero/index.tsx

@@ -8,8 +8,8 @@ import { TrackComponent } from "../../../components/Posthog/TrackComponent"
 import { Analytics } from "./Analytics"
 import { gql } from "graphql-request"
 import {
-  TBTC_SUBGRAPH_URL,
-  T_NETWORK_SUBGRAPH_URL,
+  TBTC_SUBGRAPH_ID,
+  T_NETWORK_SUBGRAPH_ID,
 } from "../../../config/subgraph"
 import useQuery from "../../../hooks/useQuery"
 import { exchangeAPI, formatUnits } from "../../../utils"
@@ -33,14 +33,14 @@ const Hero: FC<{
     data: totalStakedData,
     error: totalStakedError,
   } = useQuery<{
-    epoches: { totalStaked: string }[]
+    daometric: { stakedTotal: string }
     minStakeAmounts: { amount: string }[]
   }>(
-    T_NETWORK_SUBGRAPH_URL,
+    T_NETWORK_SUBGRAPH_ID,
     gql`
       query {
-        epoches(orderBy: startTime, orderDirection: desc, first: 1) {
-          totalStaked
+        daometric(id: "dao-metrics") {
+          stakedTotal
         }
       }
     `
@@ -49,7 +49,7 @@ const Hero: FC<{
   const { isFetching, data, error } = useQuery<{
     tbtctoken: { currentTokenHolders: string; totalSupply: string }
   }>(
-    TBTC_SUBGRAPH_URL,
+    TBTC_SUBGRAPH_ID,
     gql`
       query {
         tbtctoken(id: "TBTCToken") {
@@ -60,10 +60,10 @@ const Hero: FC<{
     `
   )
 
-  const { epoches } = totalStakedData || {
-    epoches: [{ totalStaked: "0" }],
+  const { daometric } = totalStakedData || {
+    daometric: { stakedTotal: "0" },
   }
-  const totalStaked = !error ? epoches[0].totalStaked : "0"
+  const totalStaked = !error ? daometric.stakedTotal : "0"
   const tPrice = useTTokenPrice()
   const totalValueStakedInUSD = exchangeAPI
     .toUsdBalance(formatUnits(totalStaked), tPrice)