fix: dedupe matic native token (#7485)

* fix: dedupe matic native token, wip

* use precompile address

* prefill swap currency with page chain, not connected chain

* fix token-explore test

cypress/e2e/token-explore.test.ts

@@ -59,9 +59,7 @@ describe('Token explore', () => {
     // in metamask modal using plain cypress. this is a workaround.
     cy.visit('/tokens/polygon')
     cy.get(getTestSelector('tokens-network-filter-selected')).should('contain', 'Polygon')
-    cy.get(getTestSelector('token-table-row-NATIVE'))
-      .find(getTestSelector('name-cell'))
-      .should('include.text', 'Polygon Matic')
+    cy.get(getTestSelector('token-table-row-NATIVE')).find(getTestSelector('name-cell')).should('include.text', 'Matic')
   })
 
   it('should update when token explore table network changed', () => {

src/components/FiatOnrampModal/utils.test.ts

 import { ChainId, WETH9 } from '@uniswap/sdk-core'
 import {
-  MATIC,
+  MATIC_MAINNET,
   USDC_ARBITRUM,
   USDC_MAINNET,
   USDC_OPTIMISM,
@@ -32,7 +32,7 @@ describe('getDefaultCurrencyCode', () => {
     expect(getDefaultCurrencyCode('NATIVE', 'polygon')).toBe('matic_polygon')
   })
   it('MATIC/ethereum should return the correct currency code', () => {
-    expect(getDefaultCurrencyCode(MATIC.address, 'ethereum')).toBe('polygon')
+    expect(getDefaultCurrencyCode(MATIC_MAINNET.address, 'ethereum')).toBe('polygon')
   })
   it('USDC/arbitrum should return the correct currency code', () => {
     expect(getDefaultCurrencyCode(USDC_ARBITRUM.address, 'arbitrum')).toBe('usdc_arbitrum')
@@ -56,7 +56,7 @@ describe('getDefaultCurrencyCode', () => {
     expect(getDefaultCurrencyCode(USDC_ARBITRUM.address, 'ethereum')).toBe('eth')
     expect(getDefaultCurrencyCode(USDC_OPTIMISM.address, 'ethereum')).toBe('eth')
     expect(getDefaultCurrencyCode(USDC_POLYGON.address, 'ethereum')).toBe('eth')
-    expect(getDefaultCurrencyCode(MATIC.address, 'arbitrum')).toBe('eth')
+    expect(getDefaultCurrencyCode(MATIC_MAINNET.address, 'arbitrum')).toBe('eth')
   })
 })
 

src/components/FiatOnrampModal/utils.ts

 import { ChainId, WETH9 } from '@uniswap/sdk-core'
 import {
-  MATIC,
+  MATIC_MAINNET,
   USDC_ARBITRUM,
   USDC_MAINNET,
   USDC_OPTIMISM,
@@ -28,7 +28,7 @@ const CURRENCY_CODES: {
     [USDC_MAINNET.address.toLowerCase()]: 'usdc',
     [USDT.address.toLowerCase()]: 'usdt',
     [WBTC.address.toLowerCase()]: 'wbtc',
-    [MATIC.address.toLowerCase()]: 'polygon',
+    [MATIC_MAINNET.address.toLowerCase()]: 'polygon',
     native: 'eth',
   },
   [Chain.Arbitrum]: {

src/constants/tokens.ts

@@ -90,13 +90,14 @@ export const DAI_OPTIMISM = new Token(
   'DAI',
   'Dai stable coin'
 )
-export const MATIC = new Token(
+export const MATIC_MAINNET = new Token(
   ChainId.MAINNET,
   '0x7d1afa7b718fb893db30a3abc0cfc608aacfebb0',
   18,
   'MATIC',
   'Polygon Matic'
 )
+const MATIC_POLYGON = new Token(ChainId.POLYGON, '0x0000000000000000000000000000000000001010', 18, 'MATIC', 'Matic')
 export const DAI_POLYGON = new Token(
   ChainId.POLYGON,
   '0x8f3Cf7ad23Cd3CaDbD9735AFf958023239c6A063',
@@ -149,7 +150,13 @@ export const WBTC_OPTIMISM = new Token(
   'WBTC',
   'Wrapped BTC'
 )
-
+const MATIC_POLYGON_MUMBAI = new Token(
+  ChainId.POLYGON_MUMBAI,
+  '0x0000000000000000000000000000000000001010',
+  18,
+  'MATIC',
+  'Matic'
+)
 export const WETH_POLYGON_MUMBAI = new Token(
   ChainId.POLYGON_MUMBAI,
   '0xa6fa4fb5f76172d178d61b04b0ecd319c5d1c0aa',
@@ -355,25 +362,18 @@ function getCeloNativeCurrency(chainId: number) {
   }
 }
 
-export function isMatic(chainId: number): chainId is ChainId.POLYGON | ChainId.POLYGON_MUMBAI {
+export function isPolygon(chainId: number): chainId is ChainId.POLYGON | ChainId.POLYGON_MUMBAI {
   return chainId === ChainId.POLYGON_MUMBAI || chainId === ChainId.POLYGON
 }
 
-class MaticNativeCurrency extends NativeCurrency {
-  equals(other: Currency): boolean {
-    return other.isNative && other.chainId === this.chainId
-  }
-
-  get wrapped(): Token {
-    if (!isMatic(this.chainId)) throw new Error('Not matic')
-    const wrapped = WRAPPED_NATIVE_CURRENCY[this.chainId]
-    invariant(wrapped instanceof Token)
-    return wrapped
-  }
-
-  public constructor(chainId: number) {
-    if (!isMatic(chainId)) throw new Error('Not matic')
-    super(chainId, 18, 'MATIC', 'Polygon Matic')
+function getPolygonNativeCurrency(chainId: number) {
+  switch (chainId) {
+    case ChainId.POLYGON:
+      return MATIC_POLYGON
+    case ChainId.POLYGON_MUMBAI:
+      return MATIC_POLYGON_MUMBAI
+    default:
+      throw new Error('Not polygon')
   }
 }
 
@@ -439,8 +439,8 @@ const cachedNativeCurrency: { [chainId: number]: NativeCurrency | Token } = {}
 export function nativeOnChain(chainId: number): NativeCurrency | Token {
   if (cachedNativeCurrency[chainId]) return cachedNativeCurrency[chainId]
   let nativeCurrency: NativeCurrency | Token
-  if (isMatic(chainId)) {
-    nativeCurrency = new MaticNativeCurrency(chainId)
+  if (isPolygon(chainId)) {
+    nativeCurrency = getPolygonNativeCurrency(chainId)
   } else if (isCelo(chainId)) {
     nativeCurrency = getCeloNativeCurrency(chainId)
   } else if (isBsc(chainId)) {

src/pages/Swap/index.tsx

@@ -193,8 +193,8 @@ export function Swap({
   const trace = useTrace()
 
   // token warning stuff
-  const prefilledInputCurrency = useCurrency(initialInputCurrencyId)
-  const prefilledOutputCurrency = useCurrency(initialOutputCurrencyId)
+  const prefilledInputCurrency = useCurrency(initialInputCurrencyId, chainId)
+  const prefilledOutputCurrency = useCurrency(initialOutputCurrencyId, chainId)
 
   const [loadedInputCurrency, setLoadedInputCurrency] = useState(prefilledInputCurrency)
   const [loadedOutputCurrency, setLoadedOutputCurrency] = useState(prefilledOutputCurrency)

src/state/routing/utils.ts

@@ -5,7 +5,7 @@ import { DutchOrderInfo, DutchOrderInfoJSON } from '@uniswap/uniswapx-sdk'
 import { Pair, Route as V2Route } from '@uniswap/v2-sdk'
 import { FeeAmount, Pool, Route as V3Route } from '@uniswap/v3-sdk'
 import { BIPS_BASE } from 'constants/misc'
-import { isAvalanche, isBsc, isMatic, nativeOnChain } from 'constants/tokens'
+import { isAvalanche, isBsc, isPolygon, nativeOnChain } from 'constants/tokens'
 import { toSlippagePercent } from 'utils/slippage'
 
 import { getApproveInfo, getWrapInfo } from './gas'
@@ -338,7 +338,7 @@ export function isExactInput(tradeType: TradeType): boolean {
 
 export function currencyAddressForSwapQuote(currency: Currency): string {
   if (currency.isNative) {
-    if (isMatic(currency.chainId)) return SwapRouterNativeAssets.MATIC
+    if (isPolygon(currency.chainId)) return SwapRouterNativeAssets.MATIC
     if (isBsc(currency.chainId)) return SwapRouterNativeAssets.BNB
     if (isAvalanche(currency.chainId)) return SwapRouterNativeAssets.AVAX
     return SwapRouterNativeAssets.ETH

src/utils/nativeTokens.ts

@@ -8,6 +8,7 @@ export function getNativeTokenDBAddress(chain: Chain): string | undefined {
     return undefined
   }
   switch (chain) {
+    // Celo & Polygon have precompiles for their native tokens
     case Chain.Celo:
     case Chain.Polygon:
       return nativeOnChain(pageChainId).wrapped.address