usePoolRegistry wagmi

package.json

@@ -12,6 +12,7 @@
     "@mui/lab": "^5.0.0-alpha.76",
     "@mui/material": "^5.4.0",
     "@mui/x-date-pickers": "^5.0.0-alpha.2",
+    "@rainbow-me/rainbowkit": "^0.7.4",
     "@reduxjs/toolkit": "^1.4.0",
     "@sentry/react": "^6.16.1",
     "@sentry/tracing": "^6.16.1",
@@ -36,13 +37,14 @@
     "copy-to-clipboard": "^3.3.1",
     "date-fns": "^2.29.1",
     "ethcall": "^4.6.3",
-    "ethers": "^5.5.3",
+    "ethers": "^5.7.2",
     "framer-motion": "^4.0.3",
     "history": "^5.0.0",
     "i18next": "^19.8.3",
     "i18next-browser-languagedetector": "^6.0.1",
     "i18next-fetch-backend": "^3.0.0",
     "lodash": "^4.17.20",
+    "lodash.merge": "^4.6.2",
     "match-sorter": "^6.3.1",
     "react": "^18.2.0",
     "react-device-detect": "^2.2.2",
@@ -55,6 +57,7 @@
     "react-use-intercom": "^1.5.0",
     "redux": "^4.1.0",
     "redux-localstorage-simple": "^2.4.0",
+    "wagmi": "^0.7.13",
     "web-vitals": "^2.1.4"
   },
   "devDependencies": {
@@ -73,6 +76,7 @@
     "@testing-library/user-event": "^13.5.0",
     "@typechain/ethers-v5": "^6.0.5",
     "@types/async-retry": "^1.4.2",
+    "@types/lodash.merge": "^4.6.7",
     "@types/react-dom": "^18.0.6",
     "@typescript-eslint/eslint-plugin": "^5.30.4",
     "@typescript-eslint/parser": "^5.30.4",

src/constants/networks.ts

@@ -1,5 +1,24 @@
+import { Chain, getDefaultWallets } from "@rainbow-me/rainbowkit"
+import {
+  chain,
+  configureChains,
+  createClient as createWagmiClient,
+} from "wagmi"
+
 import { ChainId } from "./index"
+// import { InjectedConnector } from "wagmi/connectors/injected"
 import { hexlify } from "@ethersproject/bytes"
+import { publicProvider } from "wagmi/providers/public"
+
+// import {
+//   coinbaseWallet,
+//   injectedWallet,
+//   metaMaskWallet,
+//   rainbowWallet,
+//   walletConnectWallet,
+// } from "@rainbow-me/rainbowkit/wallets"
+
+// import tallyIcon from "../assets/icons/tally.svg"
 
 export const NETWORK_LABEL: Partial<Record<ChainId, string>> = {
   [ChainId.MAINNET]: "Ethereum",
@@ -151,3 +170,133 @@ export const DEV_SUPPORTED_NETWORKS: SupportedNetworks = {
     blockExplorerUrls: ["https://explorer.evm-alpha.kava.io"],
   },
 }
+
+const evmosChain: Chain = {
+  id: ChainId.EVMOS,
+  iconUrl:
+    "https://assets.coingecko.com/coins/images/24023/small/evmos.png?1653958927",
+  iconBackground: "#fff",
+  name: "Evmos",
+  nativeCurrency: {
+    name: "Evmos",
+    symbol: "EVMOS",
+    decimals: 18,
+  },
+  network: "evmos",
+  rpcUrls: { default: "https://eth.bd.evmos.org:8545" },
+  blockExplorers: {
+    default: { name: "Evmos", url: "https://evm.evmos.org" },
+  },
+  testnet: false,
+}
+const fantomChain: Chain = {
+  id: ChainId.FANTOM,
+  iconUrl:
+    "https://assets.coingecko.com/coins/images/4001/small/Fantom.png?1558015016",
+  iconBackground: "#fff",
+  name: "Fantom",
+  nativeCurrency: {
+    name: "Fantom",
+    symbol: "FTM",
+    decimals: 18,
+  },
+  network: "evmos",
+  rpcUrls: { default: "https://rpc.ftm.tools" },
+  blockExplorers: {
+    default: { name: "Fantom Scan", url: "https://ftmscan.com" },
+  },
+  testnet: false,
+}
+const kavaChain: Chain = {
+  id: ChainId.KAVA,
+  iconUrl:
+    "https://assets.coingecko.com/coins/images/9761/small/kava.jpg?1639703080",
+  iconBackground: "#fff",
+  name: "Kava",
+  nativeCurrency: {
+    name: "Kava",
+    symbol: "KAVA",
+    decimals: 18,
+  },
+  network: "kava",
+  rpcUrls: { default: "https://evm.kava.io" },
+  blockExplorers: {
+    default: { name: "Kava", url: "https://explorer.kava.io" },
+  },
+  testnet: false,
+}
+
+export const rainbowChains = [
+  chain.mainnet,
+  chain.optimism,
+  chain.arbitrum,
+  chain.hardhat,
+  evmosChain,
+  fantomChain,
+  kavaChain,
+]
+
+export const { chains, provider } = configureChains(rainbowChains, [
+  publicProvider(),
+])
+
+// const tallyConnector = new InjectedConnector({
+//   chains: [chain.mainnet],
+//   options: {
+//     shimDisconnect: true,
+//     name: (detectedName) =>
+//       `Injected (${
+//         typeof detectedName === "string"
+//           ? detectedName
+//           : detectedName.join(", ")
+//       })`,
+//   },
+// })
+
+// const tally = (): Wallet => ({
+//   id: "tally-wallet",
+//   name: "Tally Wallet",
+//   iconUrl: tallyIcon,
+//   iconBackground: "#0c2f78",
+//   downloadUrls: {
+//     browserExtension: "https://tally.cash/download",
+//   },
+//   createConnector: () => {
+//     const connector = tallyConnector
+//     return {
+//       connector: connector,
+//     }
+//   },
+// })
+
+// const needsInjectedWalletFallback =
+//   typeof window !== "undefined" &&
+//   !window.ethereum?.isMetaMask &&
+//   !window.ethereum?.isTally
+
+const { connectors } = getDefaultWallets({ appName: "Saddle", chains })
+// connectorsForWallets([
+//   {
+//     groupName: "Recommended",
+//     wallets: [
+//       metaMaskWallet({ chains }),
+//       rainbowWallet({ chains }),
+//       walletConnectWallet({ chains }),
+//       coinbaseWallet({ appName: "Saddle", chains }),
+//       tally(),
+//       ...(needsInjectedWalletFallback
+//         ? [injectedWallet({ chains: [chain.mainnet] })]
+//         : []),
+//     ],
+//   },
+// ])
+
+export const wagmiClient = createWagmiClient({
+  autoConnect: true,
+  connectors,
+  provider,
+})
+
+export interface MyWalletOptions {
+  chains: Chain[]
+}

src/hooks/useContract.ts

@@ -1,6 +1,7 @@
 import {
   BRIDGE_CONTRACT_ADDRESSES,
   BTC_POOL_NAME,
+  ChainId,
   FEE_DISTRIBUTOR_ADDRESSES,
   GAUGE_CONTROLLER_ADDRESSES,
   GAUGE_MINTER_ADDRESSES,
@@ -18,6 +19,7 @@ import {
 import { Contract, ContractInterface } from "@ethersproject/contracts"
 import { createMultiCallContract, getContract, getSwapContract } from "../utils"
 import { useContext, useEffect, useMemo, useState } from "react"
+import { useContract, useContractRead, useNetwork, useProvider } from "wagmi"
 
 import { AddressZero } from "@ethersproject/constants"
 import BRIDGE_CONTRACT_ABI from "../constants/abis/bridge.json"
@@ -71,7 +73,7 @@ export const POOL_REGISTRY_NAME = "PoolRegistry"
 export const CHILD_GAUGE_FACTORY_NAME = "ChildGaugeFactory"
 
 // returns null on errors
-function useContract(
+function useContractOld(
   address: string | undefined,
   ABI: ContractInterface,
   withSignerIfPossible = true,
@@ -94,18 +96,47 @@ function useContract(
   }, [address, ABI, library, withSignerIfPossible, account])
 }
 
+export function useMasterRegistry2() {
+  const { chain } = useNetwork()
+  const provider = useProvider()
+  const contractAddress =
+    MASTER_REGISTRY_CONTRACT_ADDRESSES[(chain?.id as ChainId) ?? 1]
+
+  return useContract({
+    address: contractAddress,
+    abi: MASTER_REGISTRY_ABI,
+    signerOrProvider: provider,
+  })
+}
+
 export function useMasterRegistry(): MasterRegistry | null {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId
     ? MASTER_REGISTRY_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(
+
+  return useContractOld(
     contractAddress,
     MASTER_REGISTRY_ABI,
     false,
   ) as MasterRegistry
 }
 
+export const poolRegistryNameFormatted = formatBytes32String("PoolRegistry")
+
+export const usePoolRegistryAddr = (): string => {
+  const masterRegistryContract = useMasterRegistry2()
+  const { data: contractAddress } = useContractRead({
+    address: masterRegistryContract?.address ?? AddressZero,
+    abi: MASTER_REGISTRY_ABI,
+    functionName: "resolveNameToLatestAddress",
+    args: [poolRegistryNameFormatted],
+    enabled: !!masterRegistryContract,
+  })
+
+  return contractAddress as string
+}
+
 export function usePoolRegistry(): PoolRegistry | null {
   const { library } = useActiveWeb3React()
   const masterRegistryContract = useMasterRegistry()
@@ -210,7 +241,7 @@ export function useGeneralizedSwapMigratorContract(): GeneralizedSwapMigrator |
   const contractAddress = chainId
     ? GENERALIZED_SWAP_MIGRATOR_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(
+  return useContractOld(
     contractAddress,
     GENERALIZED_SWAP_MIGRATOR_CONTRACT_ABI,
   ) as GeneralizedSwapMigrator
@@ -221,23 +252,23 @@ export function useBridgeContract(): Bridge | null {
   const contractAddress = chainId
     ? BRIDGE_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(contractAddress, BRIDGE_CONTRACT_ABI) as Bridge
+  return useContractOld(contractAddress, BRIDGE_CONTRACT_ABI) as Bridge
 }
 
 export function useMiniChefContract(): MiniChef | null {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId
     ? MINICHEF_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(contractAddress, MINICHEF_CONTRACT_ABI) as MiniChef
+  return useContractOld(contractAddress, MINICHEF_CONTRACT_ABI) as MiniChef
 }
 
 export function useRetroactiveVestingContract(): RetroactiveVesting | null {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId
     ? RETROACTIVE_VESTING_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(
+  return useContractOld(
     contractAddress,
     RETROACTIVE_VESTING_CONTRACT_ABI,
   ) as RetroactiveVesting
@@ -248,7 +279,7 @@ export function useSynthetixContract(): SynthetixNetworkToken | null {
   const contractAddress = chainId
     ? SYNTHETIX_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(
+  return useContractOld(
     contractAddress,
     SYNTHETIX_NETWORK_TOKEN_CONTRACT_ABI,
   ) as SynthetixNetworkToken
@@ -259,7 +290,7 @@ export function useSynthetixExchangeRatesContract(): SynthetixExchangeRate | nul
   const contractAddress = chainId
     ? SYNTHETIX_EXCHANGE_RATES_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(
+  return useContractOld(
     contractAddress,
     SYNTHETIX_EXCHANGE_RATE_CONTRACT_ABI,
     false,
@@ -272,7 +303,7 @@ export function useTokenContract(
 ): Contract | null {
   const { chainId } = useActiveWeb3React()
   const tokenAddress = chainId ? t.addresses[chainId] : undefined
-  return useContract(tokenAddress, ERC20_ABI, withSignerIfPossible)
+  return useContractOld(tokenAddress, ERC20_ABI, withSignerIfPossible)
 }
 
 export function useSwapContract<T extends string>(
@@ -340,7 +371,7 @@ export function useGaugeControllerContract(): GaugeController | null {
   const contractAddress = chainId
     ? GAUGE_CONTROLLER_ADDRESSES[chainId]
     : undefined
-  return useContract(
+  return useContractOld(
     contractAddress,
     GAUGE_CONTROLLER_ABI,
     true,
@@ -350,7 +381,7 @@ export function useGaugeControllerContract(): GaugeController | null {
 export const useSdlContract = (): Sdl => {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId ? SDL_TOKEN_ADDRESSES[chainId] : undefined
-  return useContract(contractAddress, SDL_TOKEN_ABI) as Sdl
+  return useContractOld(contractAddress, SDL_TOKEN_ABI) as Sdl
 }
 
 export const useVotingEscrowContract = (): VotingEscrow => {
@@ -359,7 +390,7 @@ export const useVotingEscrowContract = (): VotingEscrow => {
     ? VOTING_ESCROW_CONTRACT_ADDRESS[chainId]
     : undefined
 
-  return useContract(
+  return useContractOld(
     contractAddress,
     VOTING_ESCROW_CONTRACT_ABI,
   ) as VotingEscrow
@@ -369,25 +400,28 @@ export const useFeeDistributor = (): FeeDistributor | null => {
   const { chainId } = useActiveWeb3React()
   const contractAddress =
     chainId && IS_VESDL_LIVE ? FEE_DISTRIBUTOR_ADDRESSES[chainId] : undefined
-  return useContract(contractAddress, FEE_DISTRIBUTOR_ABI) as FeeDistributor
+  return useContractOld(contractAddress, FEE_DISTRIBUTOR_ABI) as FeeDistributor
 }
 
 export const useGaugeMinterContract = (): Minter | null => {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId ? GAUGE_MINTER_ADDRESSES[chainId] : undefined
-  return useContract(contractAddress, GAUGE_MINTER_ABI) as Minter
+  return useContractOld(contractAddress, GAUGE_MINTER_ABI) as Minter
 }
 
 export const useSdlWethSushiPairContract = (): SushiPool | null => {
   const { chainId } = useActiveWeb3React()
   const contractAddress = chainId
     ? SDL_WETH_SUSHI_LP_CONTRACT_ADDRESSES[chainId]
     : undefined
-  return useContract(contractAddress, SUSHI_POOL_ABI, false) as SushiPool
+  return useContractOld(contractAddress, SUSHI_POOL_ABI, false) as SushiPool
 }
 
 export function useLiquidityGaugeContract(
   gaugeAddress?: string,
 ): LiquidityGaugeV5 | null {
-  return useContract(gaugeAddress, LIQUIDITY_V5_GAUGE_ABI) as LiquidityGaugeV5
+  return useContractOld(
+    gaugeAddress,
+    LIQUIDITY_V5_GAUGE_ABI,
+  ) as LiquidityGaugeV5
 }