fix: adds messaging for unsupported V2 pool networks (#3762 #3777) (#3913)

Fix: Unsupported V2 Pool network messaging

#3762: Added error messaging for unsupported V2 pool networks (Polygon, Optimism, Arbitrum)
This commit is contained in:
Kaylee George 2022-06-14 16:20:31 -04:00 committed by GitHub
parent c16e49e774
commit 5325d0cbe5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 6 deletions

@ -46,6 +46,15 @@ export const SUPPORTED_GAS_ESTIMATE_CHAIN_IDS = [
SupportedChainId.ARBITRUM_ONE,
]
/**
* Unsupported networks for V2 pool behavior.
*/
export const UNSUPPORTED_V2POOL_CHAIN_IDS = [
SupportedChainId.POLYGON,
SupportedChainId.OPTIMISM,
SupportedChainId.ARBITRUM_ONE,
]
/**
* All the chain IDs that are running the Ethereum protocol.
*/

@ -1,6 +1,6 @@
import { Trans } from '@lingui/macro'
import { Pair } from '@uniswap/v2-sdk'
import { L2_CHAIN_IDS } from 'constants/chains'
import { UNSUPPORTED_V2POOL_CHAIN_IDS } from 'constants/chains'
import useActiveWeb3React from 'hooks/useActiveWeb3React'
import JSBI from 'jsbi'
import { useContext, useMemo } from 'react'
@ -85,9 +85,11 @@ const Layer2Prompt = styled(EmptyProposals)`
export default function Pool() {
const theme = useContext(ThemeContext)
const { account, chainId } = useActiveWeb3React()
const unsupportedV2Network = chainId && UNSUPPORTED_V2POOL_CHAIN_IDS.includes(chainId)
// fetch the user's balances of all tracked V2 LP tokens
const trackedTokenPairs = useTrackedTokenPairs()
let trackedTokenPairs = useTrackedTokenPairs()
if (unsupportedV2Network) trackedTokenPairs = []
const tokenPairsWithLiquidityTokens = useMemo(
() => trackedTokenPairs.map((tokens) => ({ liquidityToken: toV2LiquidityToken(tokens), tokens })),
[trackedTokenPairs]
@ -132,8 +134,6 @@ export default function Pool() {
)
})
const ON_L2 = chainId && L2_CHAIN_IDS.includes(chainId)
return (
<>
<PageWrapper>
@ -171,12 +171,12 @@ export default function Pool() {
<CardNoise />
</VoteCard>
{ON_L2 ? (
{unsupportedV2Network ? (
<AutoColumn gap="lg" justify="center">
<AutoColumn gap="md" style={{ width: '100%' }}>
<Layer2Prompt>
<ThemedText.Body color={theme.text3} textAlign="center">
<Trans>V2 is not available on Layer 2. Switch to Layer 1 Ethereum.</Trans>
<Trans>V2 Pool is not available on Layer 2. Switch to Layer 1 Ethereum.</Trans>
</ThemedText.Body>
</Layer2Prompt>
</AutoColumn>