Deposit history (#427)

Depends on: #371 

This PR adds support for fetching the deposits in SDK. We must fetch
data from both sources tbtc API and Acre subgraph because the tbtc API
includes additional `queued` deposits - this means they have not yet
been initialized or finalized. The subgraph only indexes initialized and
finalized deposits, so we need to combine them.

dapp/.env

@@ -13,7 +13,5 @@ VITE_REFERRAL=123
 # TODO: Pass this value as an environment variable during the build process.
 VITE_DEFENDER_RELAYER_WEBHOOK_URL="https://api.defender.openzeppelin.com/actions/a0d6d2e2-ce9c-4619-aa2b-6c874fe97af7/runs/webhook/b1f17c89-8230-46e3-866f-a3213887974c/Sbddsy54cJ6sPg2bLPyuHJ"
 
-VITE_ACRE_SUBGRAPH_URL="https://api.studio.thegraph.com/query/73600/acre/version/latest"
-
 # TODO: Set this env variable in CI.
 VITE_TBTC_API_ENDPOINT=""

dapp/ledger-manifest-testnet.json

@@ -23,7 +23,8 @@
     "account.list",
     "message.sign",
     "transaction.sign",
-    "transaction.signAndBroadcast"
+    "transaction.signAndBroadcast",
+    "bitcoin.getXPub"
   ],
   "domains": ["http://*"],
   "type": "walletApp"

dapp/src/components/TransactionModal/ActiveStakingStep/DepositBTCModal.tsx

@@ -34,7 +34,7 @@ export default function DepositBTCModal() {
   const fetchDeposits = useFetchDeposits()
 
   const onStakeBTCSuccess = useCallback(() => {
-    fetchDeposits()
+    logPromiseFailure(fetchDeposits())
     dispatch(setStatus(PROCESS_STATUSES.SUCCEEDED))
   }, [dispatch, fetchDeposits])
 

dapp/src/components/TransactionModal/ActiveStakingStep/StakingErrorModal/index.tsx

@@ -21,7 +21,7 @@ export default function StakingErrorModal() {
   const [isServerError, setIsServerError] = useState(false)
 
   const onStakeBTCSuccess = useCallback(() => {
-    fetchDeposits()
+    logPromiseFailure(fetchDeposits())
     dispatch(setStatus(PROCESS_STATUSES.SUCCEEDED))
   }, [dispatch, fetchDeposits])
 

dapp/src/components/shared/ActivitiesList/ActivitiesListItem.tsx

@@ -25,25 +25,27 @@ type ActivitiesListItemProps = Omit<AlertProps, "status"> &
 function ActivitiesListItem(props: ActivitiesListItemProps) {
   const { amount, status, txHash, type, handleDismiss, ...restProps } = props
 
+  const isCompleted = status === "completed"
+
   return (
     <Alert as={HStack} variant="process" {...restProps}>
       <AlertIcon
         color="brand.400"
-        as={status === "completed" ? LoadingSpinnerSuccessIcon : Spinner}
+        as={isCompleted ? LoadingSpinnerSuccessIcon : Spinner}
       />
 
       <VStack flex={1} spacing={0} align="stretch">
         <HStack justify="space-between" as={AlertTitle}>
           <Text as="span">
-            {status === "completed"
+            {isCompleted
               ? `${type === "withdraw" ? "Unstaking" : "Staking"} completed`
               : `${type === "withdraw" ? "Unstaking" : "Staking"}...`}
           </Text>
 
           <CurrencyBalance amount={amount} currency="bitcoin" />
         </HStack>
         <HStack justify="space-between" as={AlertDescription}>
-          {status === "completed" ? (
+          {isCompleted ? (
             <Button
               variant="link"
               fontSize="sm"

dapp/src/hooks/sdk/useFetchDeposits.ts

@@ -1,27 +1,26 @@
 import { useCallback } from "react"
 import { setActivities } from "#/store/wallet"
-import { logPromiseFailure, subgraphAPI } from "#/utils"
+import { useAcreContext } from "#/acre-react/hooks"
+import { Activity } from "#/types"
+import { DepositStatus } from "@acre-btc/sdk"
 import { useAppDispatch } from "../store/useAppDispatch"
-import { useWalletContext } from "../useWalletContext"
-
-// TODO: Use the correct function from SDK
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const calculateEthAddress = (btcAddress: string) =>
-  "0x45e2e415989477ea5450e440405f6ac858019e6b"
 
 export function useFetchDeposits() {
   const dispatch = useAppDispatch()
-  const { btcAccount } = useWalletContext()
+  const { acre } = useAcreContext()
 
-  const fetchDeposits = useCallback(async () => {
-    if (!btcAccount) return
+  return useCallback(async () => {
+    if (!acre) return
 
-    // TODO: Use function from the SDK.
-    const ethAddress = calculateEthAddress(btcAccount.address)
-    const result = await subgraphAPI.fetchActivityData(ethAddress)
+    const result: Activity[] = (await acre.staking.getDeposits()).map(
+      (deposit) => ({
+        ...deposit,
+        status:
+          deposit.status === DepositStatus.Finalized ? "completed" : "pending",
+        type: "deposit",
+      }),
+    )
 
     dispatch(setActivities(result))
-  }, [btcAccount, dispatch])
-
-  return useCallback(() => logPromiseFailure(fetchDeposits()), [fetchDeposits])
+  }, [acre, dispatch])
 }

dapp/src/hooks/sdk/useInitDataFromSdk.ts

@@ -1,10 +1,11 @@
 import { useEffect } from "react"
 import { useInterval } from "@chakra-ui/react"
 import { ONE_MINUTE_IN_SECONDS, ONE_SEC_IN_MILLISECONDS } from "#/constants"
+import { logPromiseFailure } from "#/utils"
+import { useWalletContext } from "../useWalletContext"
 import { useFetchBTCBalance } from "./useFetchBTCBalance"
 import { useFetchMinDepositAmount } from "./useFetchMinDepositAmount"
 import { useFetchDeposits } from "./useFetchDeposits"
-import { useWalletContext } from "../useWalletContext"
 
 const INTERVAL_TIME = ONE_SEC_IN_MILLISECONDS * ONE_MINUTE_IN_SECONDS * 30
 
@@ -14,11 +15,11 @@ export function useInitDataFromSdk() {
 
   useEffect(() => {
     if (btcAccount) {
-      fetchDeposits()
+      logPromiseFailure(fetchDeposits())
     }
   }, [btcAccount, fetchDeposits])
 
   useFetchBTCBalance()
   useFetchMinDepositAmount()
-  useInterval(fetchDeposits, INTERVAL_TIME)
+  useInterval(() => logPromiseFailure(fetchDeposits()), INTERVAL_TIME)
 }

dapp/src/types/activity.ts

@@ -18,8 +18,8 @@ export type Activity = {
   timestamp: number
   txHash: string
   amount: bigint
+  status: Exclude<ActivityInfoStatus, "syncing">
   type: "deposit" | "withdraw"
-  status: "completed" | "pending"
 }
 
 export type ActivitiesByIds = {

dapp/src/types/index.ts

@@ -17,5 +17,4 @@ export * from "./core"
 export * from "./fee"
 export * from "./modal"
 export * from "./navigation"
-export * from "./subgraphAPI"
 export * from "./form"

dapp/src/utils/index.ts

@@ -9,5 +9,4 @@ export * from "./promise"
 export * from "./exchangeApi"
 export * from "./verifyDepositAddress"
 export * from "./json"
-export * from "./subgraphAPI"
 export * from "./activities"

dapp/src/vite-env.d.ts

@@ -5,7 +5,6 @@ interface ImportMetaEnv {
   readonly VITE_ETH_HOSTNAME_HTTP: string
   readonly VITE_REFERRAL: number
   readonly VITE_TBTC_API_ENDPOINT: string
-  readonly VITE_ACRE_SUBGRAPH_URL: string
   readonly VITE_TBTC_API_ENDPOINT: string
 }
 

sdk/src/acre.ts

@@ -7,6 +7,7 @@ import Tbtc from "./modules/tbtc"
 import { VoidSigner } from "./lib/utils"
 import { BitcoinProvider, BitcoinNetwork } from "./lib/bitcoin"
 import { getChainIdByNetwork } from "./lib/ethereum/network"
+import AcreSubgraphApi from "./lib/api/AcreSubgraphApi"
 
 class Acre {
   readonly #tbtc: Tbtc
@@ -19,21 +20,26 @@ class Acre {
 
   public readonly staking: StakingModule
 
+  readonly #acreSubgraph: AcreSubgraphApi
+
   private constructor(
     contracts: AcreContracts,
     bitcoinProvider: BitcoinProvider,
     orangeKit: OrangeKitSdk,
     tbtc: Tbtc,
+    acreSubgraphApi: AcreSubgraphApi,
   ) {
     this.contracts = contracts
     this.#tbtc = tbtc
     this.#orangeKit = orangeKit
+    this.#acreSubgraph = acreSubgraphApi
     this.#bitcoinProvider = bitcoinProvider
     this.staking = new StakingModule(
       this.contracts,
       this.#bitcoinProvider,
       this.#orangeKit,
       this.#tbtc,
+      this.#acreSubgraph,
     )
   }
 
@@ -76,8 +82,12 @@ class Acre {
       tbtcApiUrl,
       contracts.bitcoinDepositor,
     )
+    const subgraph = new AcreSubgraphApi(
+      // TODO: Set correct url based on the network
+      "https://api.studio.thegraph.com/query/73600/acre/version/latest",
+    )
 
-    return new Acre(contracts, bitcoinProvider, orangeKit, tbtc)
+    return new Acre(contracts, bitcoinProvider, orangeKit, tbtc, subgraph)
   }
 }
 

sdk/src/index.ts

@@ -3,6 +3,7 @@ export * from "./lib/contracts"
 export * from "./lib/eip712-signer"
 export * from "./lib/ethereum"
 export * from "./lib/utils"
+export { DepositStatus } from "./lib/api/TbtcApi"
 
 export * from "./modules/staking"