diff --git a/package.json b/package.json index 264cb1dc3..5db15f353 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,6 @@ "@web3-onboard/react": "^2.8.13", "@web3-onboard/walletconnect": "^2.4.6", "axios": "^0.27.2", - "bnc-notify": "^1.9.8", "copy-to-clipboard": "^3.3.3", "ethers": "5.7.2", "framer-motion": "^11.3.19", diff --git a/src/hooks/index.ts b/src/hooks/index.ts index 6fdaea2dd..ae9e47b5d 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -6,7 +6,6 @@ export * from "./useQueryParams"; export * from "./useError"; export * from "./useWindowSize"; export * from "./useScrollPosition"; -export * from "./useNotify"; export * from "./useCenteredInViewport"; export * from "./useConnection"; export * from "./useIsWrongNetwork"; diff --git a/src/hooks/useApprove.ts b/src/hooks/useApprove.ts index 2235c9030..86160b170 100644 --- a/src/hooks/useApprove.ts +++ b/src/hooks/useApprove.ts @@ -14,7 +14,7 @@ import { useIsWrongNetwork } from "hooks"; const config = getConfig(); export function useApprove(requiredChainId = hubPoolChainId) { - const { account, signer, notify } = useConnection(); + const { account, signer } = useConnection(); const { isWrongNetwork, isWrongNetworkHandler } = useIsWrongNetwork(requiredChainId); @@ -59,14 +59,14 @@ export function useApprove(requiredChainId = hubPoolChainId) { args.allowedContractAddress, 0 ); - await waitOnTransaction(requiredChainId, zeroAmountApprovalTx, notify); + await waitOnTransaction(requiredChainId, zeroAmountApprovalTx); } const txResponse = await erc20.approve( args.allowedContractAddress, MAX_APPROVAL_AMOUNT ); - await waitOnTransaction(requiredChainId, txResponse, notify); + await waitOnTransaction(requiredChainId, txResponse); }; return useMutation({ diff --git a/src/hooks/useConnection.ts b/src/hooks/useConnection.ts index 84151ceda..a7a41199a 100644 --- a/src/hooks/useConnection.ts +++ b/src/hooks/useConnection.ts @@ -10,13 +10,11 @@ export function useConnection() { isConnected, connect, disconnect, - notify, account, chainId, wallet, error, setChain, - setNotifyConfig, didAttemptAutoSelect, } = useOnboard(); @@ -29,8 +27,6 @@ export function useConnection() { provider, signer, isConnected, - notify, - setNotifyConfig, connect, disconnect, error, diff --git a/src/hooks/useNotify.ts b/src/hooks/useNotify.ts deleted file mode 100644 index 88a83ed9b..000000000 --- a/src/hooks/useNotify.ts +++ /dev/null @@ -1,77 +0,0 @@ -import { useEffect, useState, useCallback } from "react"; -import { ContractTransaction } from "ethers"; - -import { useConnection } from "hooks"; -import { supportedNotifyChainIds } from "utils/constants"; -import { getChainInfo } from "utils"; - -type TxStatus = "idle" | "pending" | "success" | "error"; - -export function useNotify() { - const [chainId, setChainId] = useState(); - const [txResponse, setTxResponse] = useState< - ContractTransaction | undefined - >(); - const [txStatus, setTxStatus] = useState("idle"); - const [txErrorMsg, setTxErrorMsg] = useState(); - - const { notify, setNotifyConfig } = useConnection(); - - const cleanup = useCallback(() => { - if (txResponse) { - notify.unsubscribe(txResponse.hash); - setChainId(undefined); - setTxResponse(undefined); - setNotifyConfig({ - networkId: 1, - }); - } - }, [txResponse, notify, setNotifyConfig]); - - useEffect(() => { - if (txResponse && chainId) { - setTxStatus("pending"); - - if (supportedNotifyChainIds.includes(chainId)) { - const { emitter } = notify.hash(txResponse.hash); - setNotifyConfig({ - networkId: chainId, - }); - - emitter.on("txSent", () => { - return { - link: getChainInfo(chainId).constructExplorerLink(txResponse.hash), - }; - }); - emitter.on("txConfirmed", () => { - setTxStatus("success"); - cleanup(); - }); - emitter.on("txFailed", () => { - setTxStatus("error"); - setTxErrorMsg("Tx failed"); - cleanup(); - }); - } else { - // TODO: We could still trigger notifications for chains that are not supported by Notify. - // See https://docs.blocknative.com/notify#notification - txResponse - .wait() - .then(() => { - setTxStatus("success"); - }) - .catch((error) => { - setTxStatus("error"); - setTxErrorMsg(error.message); - }); - } - } - }, [txResponse, cleanup, setNotifyConfig, chainId, notify]); - - return { - setChainId, - setTxResponse, - txStatus, - txErrorMsg, - }; -} diff --git a/src/hooks/useOnboard.tsx b/src/hooks/useOnboard.tsx index 3c707bbcc..c8fb68a37 100644 --- a/src/hooks/useOnboard.tsx +++ b/src/hooks/useOnboard.tsx @@ -10,7 +10,6 @@ import { UnsupportedChainIdError, isSupportedChainId, insideStorybookRuntime, - hubPoolChainId, trackIfWalletSelected, trackConnectWalletButtonClicked, trackDisconnectWalletButtonClicked, @@ -31,7 +30,6 @@ import { Account } from "@web3-onboard/core/dist/types"; import { useConnectWallet, useSetChain } from "@web3-onboard/react"; import { Chain } from "@web3-onboard/common"; import { ethers } from "ethers"; -import Notify, { API as NotifyAPI, ConfigOptions } from "bnc-notify"; import { ampli, ConnectWalletButtonClickedProperties, @@ -72,20 +70,12 @@ type OnboardContextValue = { isConnected: boolean; signer: ethers.providers.JsonRpcSigner | undefined; provider: ethers.providers.Web3Provider | null; - notify: NotifyAPI; - setNotifyConfig: (opts: ConfigOptions) => void; account: Account | null; chainId: ChainId; error?: Error; didAttemptAutoSelect: boolean; }; -const notify = Notify({ - dappId: process.env.REACT_APP_PUBLIC_ONBOARD_API_KEY, - networkId: hubPoolChainId, - desktopPosition: "topRight", -}); - export function useOnboardManager() { const [onboard, setOnboard] = useState(null); const [provider, setProvider] = @@ -250,8 +240,6 @@ export function useOnboardManager() { isConnected: !!connectedChain, signer, provider, - notify, - setNotifyConfig: (config: ConfigOptions) => notify.config(config), account, chainId: (Number(wallet?.chains[0].id) as ChainId) || 0, error, diff --git a/src/utils/constants.ts b/src/utils/constants.ts index 849f1b64d..e70147662 100644 --- a/src/utils/constants.ts +++ b/src/utils/constants.ts @@ -383,8 +383,6 @@ export function stringValueInArray(value: string, arr: string[]) { } export const maxRelayFee = 0.25; // 25% export const minRelayFee = 0.0001; // 0.01% -// Chains where Blocknative Notify can be used. See https://docs.blocknative.com/notify#initialization -export const supportedNotifyChainIds = [1, 3, 4, 5, 42, 56, 100, 137, 250]; export const mockServerlessAPI = process.env.REACT_APP_MOCK_SERVERLESS === "true"; diff --git a/src/utils/notify.ts b/src/utils/notify.ts index 460ac4293..663285207 100644 --- a/src/utils/notify.ts +++ b/src/utils/notify.ts @@ -1,81 +1,23 @@ -import { API as NotifyAPI } from "bnc-notify"; import { ContractTransaction } from "ethers"; -import { getChainInfo, supportedNotifyChainIds, getProvider } from "utils"; - -/** - * Calls and waits on the Notify API to resolve the status of a TX - * @param requiredChainId Notify supported chain id. - * @param txHash The transaction hash to wait for - * @param notify The BNC Notify API that is used to handle the UI visualization - * @param timingBuffer An optional waiting time in milliseconds to wait to resolve this promise on a successful tx confirmation. (Default: 5000ms) - * @param ignoreErrors An optional parameter to ignore tx failure and return successful - * @returns Nothing. - */ -export const notificationEmitter = async ( - requiredChainId: number, - txHash: string, - notify: NotifyAPI, - timingBuffer?: number, - ignoreErrors?: boolean -): Promise => { - return new Promise((resolve, reject) => { - notify.config({ - networkId: requiredChainId, - }); - - const { emitter } = notify.hash(txHash); - emitter.on("all", () => { - return { - link: getChainInfo(requiredChainId).constructExplorerLink(txHash), - }; - }); - emitter.on("txConfirmed", () => { - notify.unsubscribe(txHash); - setTimeout(() => { - resolve(); - }, timingBuffer ?? 0); - }); - emitter.on("txFailed", () => { - notify.unsubscribe(txHash); - if (ignoreErrors) { - resolve(); - } else { - reject(); - } - }); - }); -}; +import { getProvider } from "utils"; /** * Calls and waits on the Notify API to resolve the status of a TX if the chain is supported by Onboard * @param tx The transaction to wait for * @param notify The BNC Notify API that is used to handle the UI visualization - * @param timingBuffer An optional waiting time in milliseconds to wait to resolve this promise on a successful tx confirmation in Notify (Default: 5000ms) * @param ignoreErrors An optional parameter to ignore tx failure and return successful **/ export const waitOnTransaction = async ( requiredChainId: number, tx: ContractTransaction, - notify: NotifyAPI, - timingBuffer?: number, ignoreErrors?: boolean ): Promise => { - if (supportedNotifyChainIds.includes(requiredChainId)) { - await notificationEmitter( - requiredChainId, - tx.hash, - notify, - timingBuffer, - ignoreErrors - ); - } else { - try { - const provider = getProvider(requiredChainId); - await provider.waitForTransaction(tx.hash); - } catch (e) { - if (!ignoreErrors) { - throw e; - } + try { + const provider = getProvider(requiredChainId); + await provider.waitForTransaction(tx.hash); + } catch (e) { + if (!ignoreErrors) { + throw e; } } }; diff --git a/src/utils/onboard.ts b/src/utils/onboard.ts index de9e783ed..f24ce5184 100644 --- a/src/utils/onboard.ts +++ b/src/utils/onboard.ts @@ -52,8 +52,5 @@ export function onboardInit() { enabled: false, }, }, - notify: { - enabled: false, - }, }); } diff --git a/src/views/LiquidityPool/hooks/useLiquidityAction.ts b/src/views/LiquidityPool/hooks/useLiquidityAction.ts index 3862d5a14..98401dd8e 100644 --- a/src/views/LiquidityPool/hooks/useLiquidityAction.ts +++ b/src/views/LiquidityPool/hooks/useLiquidityAction.ts @@ -18,7 +18,7 @@ import { parseAndValidateAmountInput } from "../utils"; const config = getConfig(); export function useAddLiquidity(tokenSymbol?: string, l1TokenAddress?: string) { - const { account, signer, notify } = useConnection(); + const { account, signer } = useConnection(); const { isWrongNetwork, isWrongNetworkHandler } = useIsWrongNetwork(); const userLiquidityPoolQuery = useUserLiquidityPool(tokenSymbol); @@ -68,7 +68,7 @@ export function useAddLiquidity(tokenSymbol?: string, l1TokenAddress?: string) { value: isEth ? parsedAndValidAmount : undefined, } ); - await waitOnTransaction(hubPoolChainId, txResponse, notify); + await waitOnTransaction(hubPoolChainId, txResponse); }; return useMutation({ @@ -85,7 +85,7 @@ export function useRemoveLiquidity( tokenSymbol?: string, tokenAddress?: string ) { - const { account, signer, notify } = useConnection(); + const { account, signer } = useConnection(); const { isWrongNetwork, isWrongNetworkHandler } = useIsWrongNetwork(); const userLiquidityPoolQuery = useUserLiquidityPool(tokenSymbol); @@ -127,7 +127,7 @@ export function useRemoveLiquidity( amountToRemoveInLP, isEth ); - await waitOnTransaction(hubPoolChainId, txResponse, notify); + await waitOnTransaction(hubPoolChainId, txResponse); }; return useMutation({ diff --git a/src/views/RewardsProgram/hooks/useClaimReferralRewards.ts b/src/views/RewardsProgram/hooks/useClaimReferralRewards.ts index 1ce579e42..63f67a7bb 100644 --- a/src/views/RewardsProgram/hooks/useClaimReferralRewards.ts +++ b/src/views/RewardsProgram/hooks/useClaimReferralRewards.ts @@ -14,7 +14,7 @@ import { useUnclaimedProofs } from "hooks/useUnclaimedProofs"; const config = getConfig(); export function useClaimRewards(program: rewardProgramTypes) { - const { account, signer, notify } = useConnection(); + const { account, signer } = useConnection(); const baseChainId = program === "arb-rebates" ? ChainId.ARBITRUM : ChainId.OPTIMISM; const { isWrongNetwork, isWrongNetworkHandler } = @@ -39,7 +39,7 @@ export function useClaimRewards(program: rewardProgramTypes) { account, })) ); - await waitOnTransaction(hubPoolChainId, claimMultiTx, notify); + await waitOnTransaction(hubPoolChainId, claimMultiTx); }; return useMutation({ mutationFn: handleClaim, diff --git a/src/views/Staking/hooks/useClaimStakeRewardAction.ts b/src/views/Staking/hooks/useClaimStakeRewardAction.ts index f34c217c4..130cd5dd0 100644 --- a/src/views/Staking/hooks/useClaimStakeRewardAction.ts +++ b/src/views/Staking/hooks/useClaimStakeRewardAction.ts @@ -1,4 +1,3 @@ -import { API } from "bnc-notify"; import { Signer } from "ethers"; import { useConnection, useStakingPool } from "hooks"; import { useMutation } from "@tanstack/react-query"; @@ -6,13 +5,13 @@ import { getConfig, hubPoolChainId, waitOnTransaction } from "utils"; import { sendWithPaddedGas } from "utils/transactions"; export function useClaimStakeRewardAction(tokenAddress?: string) { - const { signer, notify } = useConnection(); + const { signer } = useConnection(); const stakingPoolQuery = useStakingPool(tokenAddress); const claimStakeRewardFn = async () => { if (stakingPoolQuery.data && signer && tokenAddress) { const { lpTokenAddress } = stakingPoolQuery.data; - await performClaimingAction(lpTokenAddress, signer, notify); + await performClaimingAction(lpTokenAddress, signer); } }; return useMutation({ @@ -25,13 +24,11 @@ export function useClaimStakeRewardAction(tokenAddress?: string) { * A function builder which returns a closure of a function that can be used to claim rewards with the AcceleratingDistributor contract * @param lpTokenAddress The ERC20 address of the LP Token * @param signer A valid ethers signer - * @param notify A BNC notification API that will be used to visually notify the user of a successful/rejected transaction * @returns A closure function that is designed to stake or unstake a given LP token with the AcceleratingDistributor contract */ const performClaimingAction = async ( lpTokenAddress: string, - signer: Signer, - notify: API + signer: Signer ) => { // Instantiate a contract instance of the AcceleratingDistributor with the user's signer const acceleratingDistributor = @@ -42,8 +39,7 @@ const performClaimingAction = async ( acceleratingDistributor, "withdrawReward" )(lpTokenAddress); - // Send this to onboard's notify API to track the TX - await waitOnTransaction(hubPoolChainId, resultingTx, notify, 0, true); + await waitOnTransaction(hubPoolChainId, resultingTx, true); } catch (_e) { // We currently don't handle the error case other than to exit gracefully. } diff --git a/src/views/Staking/hooks/useStakingAction.ts b/src/views/Staking/hooks/useStakingAction.ts index 50940b8a4..c58c305dd 100644 --- a/src/views/Staking/hooks/useStakingAction.ts +++ b/src/views/Staking/hooks/useStakingAction.ts @@ -1,6 +1,5 @@ import { useMutation } from "@tanstack/react-query"; import { BigNumber, Signer } from "ethers"; -import { API } from "bnc-notify"; import { useConnection, useStakingPool } from "hooks"; import { @@ -18,7 +17,7 @@ export type StakingActionFunctionType = ( ) => Promise; export function useStakeAction(tokenAddress?: string) { - const { signer, notify } = useConnection(); + const { signer } = useConnection(); const stakingPoolQuery = useStakingPool(tokenAddress); const stakeActionFn: StakingActionFunctionType = async ( @@ -30,8 +29,7 @@ export function useStakeAction(tokenAddress?: string) { lpTokenAddress, signer, "stake", - requiresApproval, - notify + requiresApproval )(args.amount); } }; @@ -42,7 +40,7 @@ export function useStakeAction(tokenAddress?: string) { } export function useUnstakeAction(tokenAddress?: string) { - const { signer, notify } = useConnection(); + const { signer } = useConnection(); const stakingPoolQuery = useStakingPool(tokenAddress); const unstakeActionFn: StakingActionFunctionType = async ( @@ -54,8 +52,7 @@ export function useUnstakeAction(tokenAddress?: string) { lpTokenAddress, signer, "unstake", - requiresApproval, - notify + requiresApproval )(args.amount); } }; @@ -71,15 +68,13 @@ export function useUnstakeAction(tokenAddress?: string) { * @param signer A valid ethers signer * @param action The action that will build this function. Either 'stake' or 'unstake' * @param requiresApproval Whether or not this function will first attempt have the user set an allowance with the AcceleratingDistributor contract - * @param notify A BNC notification API that will be used to visually notify the user of a successful/rejected transaction * @returns A closure function that is designed to stake or unstake a given LP token with the AcceleratingDistributor contract */ const performStakingActionBuilderFn = ( lpTokenAddress: string, signer: Signer, action: "stake" | "unstake", - requiresApproval: boolean, - notify: API + requiresApproval: boolean ) => { // The purpose of this variable is to keep track of whether or not // the closure needs to request approval from the ERC20 token to be @@ -111,7 +106,7 @@ const performStakingActionBuilderFn = ( MAX_APPROVAL_AMOUNT ); // Wait for the transaction to return successful - await waitOnTransaction(hubPoolChainId, approvalResult, notify); + await waitOnTransaction(hubPoolChainId, approvalResult); innerApprovalRequired = false; } catch (_e) { // If this function fails to resolve (or the user rejects), we don't proceed. @@ -125,7 +120,7 @@ const performStakingActionBuilderFn = ( // wait until the tx has been resolved try { const result = await callingFn(lpTokenAddress, amountAsBigNumber); - await waitOnTransaction(hubPoolChainId, result, notify, 5000, true); + await waitOnTransaction(hubPoolChainId, result, true); } catch (_e) { // We currently don't handle the error case other than to exit gracefully. } diff --git a/src/views/Transactions/hooks/useSpeedUp.tsx b/src/views/Transactions/hooks/useSpeedUp.tsx index c0acb07d0..c9c7149ea 100644 --- a/src/views/Transactions/hooks/useSpeedUp.tsx +++ b/src/views/Transactions/hooks/useSpeedUp.tsx @@ -17,7 +17,7 @@ import type { Deposit } from "hooks/useDeposits"; const config = getConfig(); export function useSpeedUp(transfer: Deposit, token: Token) { - const { signer, notify, account } = useConnection(); + const { signer, account } = useConnection(); const { isWrongNetwork, isWrongNetworkHandler } = useIsWrongNetwork( transfer.sourceChainId ); @@ -96,7 +96,7 @@ export function useSpeedUp(transfer: Deposit, token: Token) { txResponse.hash ) ); - await waitOnTransaction(transfer.sourceChainId, txResponse, notify); + await waitOnTransaction(transfer.sourceChainId, txResponse); }, }); diff --git a/yarn.lock b/yarn.lock index 557b8c3bb..0ae266641 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9840,18 +9840,7 @@ bn.js@^5.0.0, bn.js@^5.1.1, bn.js@^5.1.2, bn.js@^5.1.3, bn.js@^5.2.0, bn.js@^5.2 resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-5.2.1.tgz#0bc527a6a0d18d0aa8d5b0538ce4a77dccfa7b70" integrity sha512-eXRvHzWyYPBuB4NBy0cmYQjGitUrtqwbvlzP3G6VFnNRbsZQIxQ10PbKKHt8gZ/HW/D/747aDl+QkDqg3KQLMQ== -bnc-notify@^1.9.8: - version "1.9.8" - resolved "https://registry.yarnpkg.com/bnc-notify/-/bnc-notify-1.9.8.tgz#8e0464428ddc5245a223a5814af39a7b03f74669" - integrity sha512-CTEuKZ/nkeBFYhusU2prl+w62+CF9io5DEEtXPCywzYh5t8+obD0f/eZ3yD146DGVPANhltgkCXE3oNspGvBug== - dependencies: - bignumber.js "^9.0.0" - bnc-sdk "^4.6.4" - lodash.debounce "^4.0.8" - regenerator-runtime "^0.13.3" - uuid "^3.3.3" - -bnc-sdk@^4.6.4, bnc-sdk@^4.6.7: +bnc-sdk@^4.6.7: version "4.6.7" resolved "https://registry.yarnpkg.com/bnc-sdk/-/bnc-sdk-4.6.7.tgz#138a22e04c95c2c697fb836092358d21957e2114" integrity sha512-jIQ6cmeRBgvH/YDLuYRr2+kxDGcAAi0SOvjlO5nQ5cWdbslw+ASWftd1HmxiVLNCiwEH5bSc/t8a0agZ5njTUQ== @@ -20807,7 +20796,7 @@ regenerator-runtime@^0.11.0: resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9" integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg== -regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.3: +regenerator-runtime@^0.13.11: version "0.13.11" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz#f6dca3e7ceec20590d07ada785636a90cdca17f9" integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg== @@ -23751,7 +23740,7 @@ uuid@3.3.2: resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131" integrity sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA== -uuid@^3.3.2, uuid@^3.3.3: +uuid@^3.3.2: version "3.4.0" resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee" integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==