poc: type-safety

shapeshift · Jun 7, 2024 · b950ec5 · b950ec5
1 parent e4961cb
commit b950ec5
Show file tree

Hide file tree

Showing 2 changed files with 76 additions and 25 deletions.
diff --git a/src/pages/RFOX/components/Stake/Bridge/hooks/useRfoxBridge.ts b/src/pages/RFOX/components/Stake/Bridge/hooks/useRfoxBridge.ts
@@ -1,15 +1,15 @@
 import { fromAccountId, fromAssetId } from '@shapeshiftoss/caip'
-import type { EvmChainId } from '@shapeshiftoss/chain-adapters'
-import { bnOrZero, CONTRACT_INTERACTION } from '@shapeshiftoss/chain-adapters'
+import { bnOrZero, CONTRACT_INTERACTION, isEvmChainId } from '@shapeshiftoss/chain-adapters'
 import { supportsETH } from '@shapeshiftoss/hdwallet-core'
 import type { SwapErrorRight, TradeQuote } from '@shapeshiftoss/swapper'
 import type { Asset, MarketData } from '@shapeshiftoss/types'
 import { TxStatus } from '@shapeshiftoss/unchained-client'
 import type { Result } from '@sniptt/monads'
 import type { UseQueryResult } from '@tanstack/react-query'
-import { useMutation, useQuery } from '@tanstack/react-query'
+import { skipToken, useMutation, useQuery } from '@tanstack/react-query'
 import { useEffect, useMemo, useState } from 'react'
 import { reactQueries } from 'react-queries'
+import { arbitrumBridgeTradeQuoteQueryFn, swapper } from 'react-queries/queries/swapper'
 import { useWallet } from 'hooks/useWallet/useWallet'
 import { fromBaseUnit } from 'lib/math'
 import { arbitrumBridgeApi } from 'lib/swapper/swappers/ArbitrumBridgeSwapper/endpoints'
@@ -72,6 +72,7 @@ export const useRfoxBridge: UseRfoxBridge = ({ confirmedQuote }) => {
 
   const wallet = useWallet().state.wallet
   const sellAsset = useAppSelector(state => selectAssetById(state, confirmedQuote.sellAssetId))
+  const chainId = useMemo(() => sellAsset?.chainId, [sellAsset])
   const buyAsset = useAppSelector(state => selectAssetById(state, confirmedQuote.buyAssetId))
   const feeAsset = useAppSelector(state =>
     selectFeeAssetByChainId(state, fromAssetId(confirmedQuote.sellAssetId).chainId),
@@ -103,25 +104,55 @@ export const useRfoxBridge: UseRfoxBridge = ({ confirmedQuote }) => {
     selectAccountNumberByAccountId(state, sellAssetAccountNumberFilter),
   )
 
-  const isTradeQuoteQueryEnabled = Boolean(
-    sellAsset && buyAsset && sellAssetAccountNumber !== undefined && wallet,
-  )
-
-  const tradeQuoteQuery = useQuery({
-    ...reactQueries.swapper.arbitrumBridgeTradeQuote({
-      sellAsset: sellAsset!, // see isTradeQuoteQueryEnabled
-      buyAsset: buyAsset!, // see isTradeQuoteQueryEnabled
-      chainId: sellAsset!.chainId as EvmChainId, // see isTradeQuoteQueryEnabled
+  const { queryKey: tradeQuoteQueryKey } = useMemo(() => {
+    return swapper.arbitrumBridgeTradeQuote({
+      sellAsset,
+      buyAsset,
+      chainId: sellAsset?.chainId,
       sellAmountIncludingProtocolFeesCryptoBaseUnit: confirmedQuote.bridgeAmountCryptoBaseUnit,
       affiliateBps: '0',
       potentialAffiliateBps: '0',
       allowMultiHop: true,
       receiveAddress: fromAccountId(confirmedQuote.buyAssetAccountId).account,
       sendAddress: fromAccountId(confirmedQuote.sellAssetAccountId).account,
-      accountNumber: sellAssetAccountNumber!,
-      wallet: wallet!,
-    }),
-    enabled: isTradeQuoteQueryEnabled,
+      accountNumber: sellAssetAccountNumber,
+    })
+  }, [
+    buyAsset,
+    confirmedQuote.bridgeAmountCryptoBaseUnit,
+    confirmedQuote.buyAssetAccountId,
+    confirmedQuote.sellAssetAccountId,
+    sellAsset,
+    sellAssetAccountNumber,
+  ])
+
+  const isTradeQuoteQueryEnabled =
+    sellAsset &&
+    buyAsset &&
+    chainId &&
+    isEvmChainId(chainId) &&
+    sellAssetAccountNumber !== undefined &&
+    wallet
+
+  const tradeQuoteQuery = useQuery({
+    queryKey: tradeQuoteQueryKey,
+    queryFn: isTradeQuoteQueryEnabled
+      ? () =>
+          arbitrumBridgeTradeQuoteQueryFn({
+            sellAsset,
+            buyAsset,
+            chainId,
+            sellAmountIncludingProtocolFeesCryptoBaseUnit:
+              confirmedQuote.bridgeAmountCryptoBaseUnit,
+            affiliateBps: '0',
+            potentialAffiliateBps: '0',
+            allowMultiHop: true,
+            receiveAddress: fromAccountId(confirmedQuote.buyAssetAccountId).account,
+            sendAddress: fromAccountId(confirmedQuote.sellAssetAccountId).account,
+            accountNumber: sellAssetAccountNumber,
+            wallet,
+          })
+      : skipToken,
   })
 
   const allowanceContract = useMemo(() => {

diff --git a/src/react-queries/queries/swapper.ts b/src/react-queries/queries/swapper.ts
@@ -2,26 +2,46 @@ import { createQueryKeys } from '@lukemorales/query-key-factory'
 import type { ChainId } from '@shapeshiftoss/caip'
 import { type HDWallet, supportsETH } from '@shapeshiftoss/hdwallet-core'
 import type { GetEvmTradeQuoteInput } from '@shapeshiftoss/swapper'
+import type { Asset } from '@shapeshiftoss/types'
 import { arbitrumBridgeApi } from 'lib/swapper/swappers/ArbitrumBridgeSwapper/endpoints'
 import { getTradeQuote } from 'lib/swapper/swappers/ArbitrumBridgeSwapper/getTradeQuote/getTradeQuote'
 
+// Escape-hatch query-key-factory for type safety, and probably ditch it altogether/only keep it for query-keys for now on:
+// https://github.com/lukemorales/query-key-factory/issues/77
+export const arbitrumBridgeTradeQuoteQueryFn = async (
+  inputWithWallet: Omit<GetEvmTradeQuoteInput, 'supportsEIP1559'> & { wallet: HDWallet },
+) => {
+  const { wallet, ...input } = inputWithWallet
+  const supportsEIP1559 = supportsETH(wallet) && (await wallet.ethSupportsEIP1559())
+
+  return getTradeQuote({
+    ...input,
+    sellAsset: input.sellAsset,
+    buyAsset: input.buyAsset,
+    accountNumber: input.accountNumber,
+    supportsEIP1559,
+  })
+}
+
 // Only used for arbitrum bridge swapper use outside of swapper for now
 export const swapper = createQueryKeys('swapper', {
   arbitrumBridgeTradeQuote: (
-    inputWithWallet: Omit<GetEvmTradeQuoteInput, 'supportsEIP1559'> & { wallet: HDWallet },
+    input: Omit<
+      GetEvmTradeQuoteInput,
+      'supportsEIP1559' | 'sellAsset' | 'buyAsset' | 'accountNumber' | 'chainId'
+    > & {
+      sellAsset: Asset | undefined
+      buyAsset: Asset | undefined
+      accountNumber: number | undefined
+      chainId: ChainId | undefined
+    },
   ) => {
-    const { wallet, ...input } = inputWithWallet
     return {
-      queryKey: ['arbitrumBridgeTradeQuote', input],
-      queryFn: async () => {
-        const supportsEIP1559 = supportsETH(wallet) && (await wallet.ethSupportsEIP1559())
-
-        return getTradeQuote({ ...input, supportsEIP1559 })
-      },
+      queryKey: [input],
     }
   },
   arbitrumBridgeTradeStatus: (txHash: string, chainId: ChainId) => ({
-    queryKey: ['arbitrumBridgeTradeStatus', txHash, chainId],
+    queryKey: [txHash, chainId],
     queryFn: () =>
       arbitrumBridgeApi.checkTradeStatus({
         txHash,