ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: remove fortmatic (#4167)

Browse Source 
* rm fortmatic (wip for test)

* remove isChainAllowed

* handle unexpected connector

* clear on catch

* Revert "remove isChainAllowed"

This reverts commit d505cac39a446cb2c273016d03896469ba39eb60.

* fix to actually use ALLOWED_CHAIN_IDS

* fix
This commit is contained in:
Vignesh Mohankumar 2022-08-19 12:06:14 -04:00 committed by GitHub
parent 21649967aa
commit ffe670923e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 34 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -181,7 +181,6 @@
"ethers": "^5.1.4",
"firebase": "^9.1.3",
"focus-visible": "^5.2.0",
"fortmatic": "^2.4.0",
"graphql": "^16.5.0",
"graphql-request": "^3.4.0",
"immer": "^9.0.6",

1
public/index.html
View File

@ -16,7 +16,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="theme-color" content="#ff007a" />
<meta name="fortmatic-site-verification" content="j93LgcVZk79qcgyo" />
<!--
manifest.json provides metadata used when the app is installed as a PWA.

4
src/components/Header/NetworkSelector.tsx
View File

@ -281,7 +281,7 @@ const NETWORK_SELECTOR_CHAINS = [
]
export default function NetworkSelector() {
const { chainId, provider, connector } = useWeb3React()
const { chainId, provider } = useWeb3React()
const node = useRef<HTMLDivElement>(null)
const isOpen = useModalIsOpen(ApplicationModal.NETWORK_SELECTOR)
@ -329,7 +329,7 @@ export default function NetworkSelector() {
<Trans>Select a {!onSupportedChain ? ' supported ' : ''}network</Trans>
</FlyoutHeader>
{NETWORK_SELECTOR_CHAINS.map((chainId: SupportedChainId) =>
isChainAllowed(connector, chainId) ? (
isChainAllowed(chainId) ? (
<Row
onSelectChain={async (targetChainId: SupportedChainId) => {
await selectChain(targetChainId)

4
src/components/Identicon/StatusIcon.tsx
View File

@ -2,7 +2,6 @@ import { ConnectionType } from 'connection'
import styled from 'styled-components/macro'
import CoinbaseWalletIcon from '../../assets/images/coinbaseWalletIcon.svg'
import FortmaticIcon from '../../assets/images/fortmaticIcon.png'
import WalletConnectIcon from '../../assets/images/walletConnectIcon.svg'
import Identicon from '../Identicon'
@ -33,9 +32,6 @@ export default function StatusIcon({ connectionType, size }: { connectionType: C
case ConnectionType.COINBASE_WALLET:
image = <img src={CoinbaseWalletIcon} alt="Coinbase Wallet" />
break
case ConnectionType.FORTMATIC:
image = <img src={FortmaticIcon} alt="Fortmatic" />
break
}
return <IconWrapper size={size ?? 16}>{image}</IconWrapper>

4
src/components/NavBar/ChainSwitcher.tsx
View File

@ -57,7 +57,7 @@ interface ChainSwitcherProps {
}
export const ChainSwitcher = ({ isMobile }: ChainSwitcherProps) => {
const { chainId, connector } = useWeb3React()
const { chainId } = useWeb3React()
const [isOpen, toggleOpen] = useReducer((s) => !s, false)
const ref = useRef<HTMLDivElement>(null)
@ -89,7 +89,7 @@ export const ChainSwitcher = ({ isMobile }: ChainSwitcherProps) => {
<NavDropdown top={60} leftAligned={isMobile}>
<Column gap="4">
{NETWORK_SELECTOR_CHAINS.map((chainId: SupportedChainId) =>
isChainAllowed(connector, chainId) ? (
isChainAllowed(chainId) ? (
<ChainRow
onSelectChain={async (targetChainId: SupportedChainId) => {
await selectChain(targetChainId)

24
src/components/WalletModal/FortmaticOption.tsx
View File

@ -1,24 +0,0 @@
import { Connector } from '@web3-react/types'
import FORTMATIC_ICON_URL from 'assets/images/fortmaticIcon.png'
import { ConnectionType, fortmaticConnection } from 'connection'
import { getConnectionName } from 'connection/utils'
import Option from './Option'
const BASE_PROPS = {
color: '#6748FF',
icon: FORTMATIC_ICON_URL,
id: 'fortmatic',
}
export function FortmaticOption({ tryActivation }: { tryActivation: (connector: Connector) => void }) {
const isActive = fortmaticConnection.hooks.useIsActive()
return (
<Option
{...BASE_PROPS}
isActive={isActive}
onClick={() => tryActivation(fortmaticConnection.connector)}
header={getConnectionName(ConnectionType.FORTMATIC)}
/>
)
}

12
src/components/WalletModal/index.test.tsx
View File

@ -81,8 +81,7 @@ it('loads Wallet Modal on desktop', async () => {
expect(screen.getByText('Install MetaMask')).toBeInTheDocument()
expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument()
expect(screen.getByText('WalletConnect')).toBeInTheDocument()
expect(screen.getByText('Fortmatic')).toBeInTheDocument()
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(4)
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(3)
})
it('loads Wallet Modal on desktop with generic Injected', async () => {
@ -94,8 +93,7 @@ it('loads Wallet Modal on desktop with generic Injected', async () => {
expect(screen.getByText('Injected')).toBeInTheDocument()
expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument()
expect(screen.getByText('WalletConnect')).toBeInTheDocument()
expect(screen.getByText('Fortmatic')).toBeInTheDocument()
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(4)
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(3)
})
it('loads Wallet Modal on desktop with MetaMask installed', async () => {
@ -107,8 +105,7 @@ it('loads Wallet Modal on desktop with MetaMask installed', async () => {
expect(screen.getByText('MetaMask')).toBeInTheDocument()
expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument()
expect(screen.getByText('WalletConnect')).toBeInTheDocument()
expect(screen.getByText('Fortmatic')).toBeInTheDocument()
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(4)
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(3)
})
it('loads Wallet Modal on mobile', async () => {
@ -121,8 +118,7 @@ it('loads Wallet Modal on mobile', async () => {
render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />)
expect(screen.getByText('Open in Coinbase Wallet')).toBeInTheDocument()
expect(screen.getByText('WalletConnect')).toBeInTheDocument()
expect(screen.getByText('Fortmatic')).toBeInTheDocument()
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(3)
expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(2)
})
it('loads Wallet Modal on MetaMask browser', async () => {

13
src/components/WalletModal/index.tsx
View File

@ -13,7 +13,6 @@ import { formatToDecimal, getTokenAddress } from 'components/AmplitudeAnalytics/
import { sendEvent } from 'components/analytics'
import { AutoColumn } from 'components/Column'
import { AutoRow } from 'components/Row'
import { ConnectionType } from 'connection'
import { getConnection, getConnectionName, getIsCoinbaseWallet, getIsInjected, getIsMetaMask } from 'connection/utils'
import { RedesignVariant, useRedesignFlag } from 'featureFlags/flags/redesign'
import { useStablecoinValue } from 'hooks/useStablecoinPrice'
@ -39,7 +38,6 @@ import AccountDetails from '../AccountDetails'
import { LightCard } from '../Card'
import Modal from '../Modal'
import { CoinbaseWalletOption, OpenCoinbaseWalletOption } from './CoinbaseWalletOption'
import { FortmaticOption } from './FortmaticOption'
import { InjectedOption, InstallMetaMaskOption, MetaMaskOption } from './InjectedOption'
import PendingView from './PendingView'
import { WalletConnectOption } from './WalletConnectOption'
@ -281,12 +279,6 @@ export default function WalletModal({
})
try {
// Fortmatic opens it's own modal on activation to log in. This modal has a tabIndex
// collision into the WalletModal, so we special case by closing the modal.
if (connectionType === ConnectionType.FORTMATIC) {
toggleWalletModal()
}
setPendingConnector(connector)
setWalletView(WALLET_VIEWS.PENDING)
dispatch(updateConnectionError({ connectionType, error: undefined }))
@ -304,7 +296,7 @@ export default function WalletModal({
})
}
},
[dispatch, toggleWalletModal]
[dispatch]
)
function getOptions() {
@ -339,14 +331,11 @@ export default function WalletModal({
const walletConnectionOption =
(!isInjectedMobileBrowser && <WalletConnectOption tryActivation={tryActivation} />) ?? null
const fortmaticOption = (!isInjectedMobileBrowser && <FortmaticOption tryActivation={tryActivation} />) ?? null
return (
<>
{injectedOption}
{coinbaseWalletOption}
{walletConnectionOption}
{fortmaticOption}
</>
)
}

12
src/connection/index.ts
View File

@ -1,13 +1,11 @@
import { CoinbaseWallet } from '@web3-react/coinbase-wallet'
import { initializeConnector, Web3ReactHooks } from '@web3-react/core'
import { EIP1193 } from '@web3-react/eip1193'
import { GnosisSafe } from '@web3-react/gnosis-safe'
import { MetaMask } from '@web3-react/metamask'
import { Network } from '@web3-react/network'
import { Connector } from '@web3-react/types'
import { WalletConnect } from '@web3-react/walletconnect'
import { SupportedChainId } from 'constants/chains'
import Fortmatic from 'fortmatic'
import UNISWAP_LOGO_URL from '../assets/svg/logo.svg'
import { RPC_URLS } from '../constants/networks'
@ -16,7 +14,6 @@ export enum ConnectionType {
INJECTED = 'INJECTED',
COINBASE_WALLET = 'COINBASE_WALLET',
WALLET_CONNECT = 'WALLET_CONNECT',
FORTMATIC = 'FORTMATIC',
NETWORK = 'NETWORK',
GNOSIS_SAFE = 'GNOSIS_SAFE',
}
@ -71,15 +68,6 @@ export const walletConnectConnection: Connection = {
type: ConnectionType.WALLET_CONNECT,
}
const [web3Fortmatic, web3FortmaticHooks] = initializeConnector<EIP1193>(
(actions) => new EIP1193({ actions, provider: new Fortmatic(process.env.REACT_APP_FORTMATIC_KEY).getProvider() })
)
export const fortmaticConnection: Connection = {
connector: web3Fortmatic,
hooks: web3FortmaticHooks,
type: ConnectionType.FORTMATIC,
}
const [web3CoinbaseWallet, web3CoinbaseWalletHooks] = initializeConnector<CoinbaseWallet>(
(actions) =>
new CoinbaseWallet({

6
src/connection/utils.ts
View File

@ -2,7 +2,6 @@ import { Connector } from '@web3-react/types'
import {
coinbaseWalletConnection,
ConnectionType,
fortmaticConnection,
gnosisSafeConnection,
injectedConnection,
networkConnection,
@ -26,7 +25,6 @@ const CONNECTIONS = [
injectedConnection,
coinbaseWalletConnection,
walletConnectConnection,
fortmaticConnection,
networkConnection,
]
export function getConnection(c: Connector | ConnectionType) {
@ -44,8 +42,6 @@ export function getConnection(c: Connector | ConnectionType) {
return coinbaseWalletConnection
case ConnectionType.WALLET_CONNECT:
return walletConnectConnection
case ConnectionType.FORTMATIC:
return fortmaticConnection
case ConnectionType.NETWORK:
return networkConnection
case ConnectionType.GNOSIS_SAFE:
@ -62,8 +58,6 @@ export function getConnectionName(connectionType: ConnectionType, isMetaMask?: b
return 'Coinbase Wallet'
case ConnectionType.WALLET_CONNECT:
return 'WalletConnect'
case ConnectionType.FORTMATIC:
return 'Fortmatic'
case ConnectionType.NETWORK:
return 'Network'
case ConnectionType.GNOSIS_SAFE:

20
src/hooks/useEagerlyConnect.ts
View File

@ -1,8 +1,9 @@
import { Connector } from '@web3-react/types'
import { gnosisSafeConnection, networkConnection } from 'connection'
import { Connection, gnosisSafeConnection, networkConnection } from 'connection'
import { getConnection } from 'connection/utils'
import { useEffect } from 'react'
import { useAppSelector } from 'state/hooks'
import { useAppDispatch, useAppSelector } from 'state/hooks'
import { updateSelectedWallet } from 'state/user/reducer'
async function connect(connector: Connector) {
try {
@ -17,14 +18,25 @@ async function connect(connector: Connector) {
}
export default function useEagerlyConnect() {
const dispatch = useAppDispatch()
const selectedWallet = useAppSelector((state) => state.user.selectedWallet)
let selectedConnection: Connection | undefined
if (selectedWallet) {
try {
selectedConnection = getConnection(selectedWallet)
} catch {
dispatch(updateSelectedWallet({ wallet: undefined }))
}
}
useEffect(() => {
connect(gnosisSafeConnection.connector)
connect(networkConnection.connector)
if (selectedWallet) {
connect(getConnection(selectedWallet).connector)
if (selectedConnection) {
connect(selectedConnection.connector)
} // The dependency list is empty so this is only run once on mount
}, []) // eslint-disable-line react-hooks/exhaustive-deps
}

7
src/hooks/useOrderedConnections.ts
View File

@ -3,12 +3,7 @@ import { getConnection } from 'connection/utils'
import { useMemo } from 'react'
import { useAppSelector } from 'state/hooks'
const SELECTABLE_WALLETS = [
ConnectionType.INJECTED,
ConnectionType.COINBASE_WALLET,
ConnectionType.WALLET_CONNECT,
ConnectionType.FORTMATIC,
]
const SELECTABLE_WALLETS = [ConnectionType.INJECTED, ConnectionType.COINBASE_WALLET, ConnectionType.WALLET_CONNECT]
export default function useOrderedConnections() {
const selectedWallet = useAppSelector((state) => state.user.selectedWallet)

8
src/lib/hooks/useCurrency.ts
View File

@ -30,8 +30,8 @@ function parseStringOrBytes32(str: string | undefined, bytes32: string | undefin
* Returns undefined if tokenAddress is invalid or token does not exist.
*/
export function useTokenFromNetwork(tokenAddress: string | null | undefined): Token | null | undefined {
const { chainId, connector } = useWeb3React()
const chainAllowed = chainId && isChainAllowed(connector, chainId)
const { chainId } = useWeb3React()
const chainAllowed = chainId && isChainAllowed(chainId)
const formattedAddress = isAddress(tokenAddress)
@ -96,7 +96,7 @@ export function useTokenFromMapOrNetwork(tokens: TokenMap, tokenAddress?: string
*/
export function useCurrencyFromMap(tokens: TokenMap, currencyId?: string | null): Currency | null | undefined {
const nativeCurrency = useNativeCurrency()
const { chainId, connector } = useWeb3React()
const { chainId } = useWeb3React()
const isNative = Boolean(nativeCurrency && currencyId?.toUpperCase() === 'ETH')
const shorthandMatchAddress = useMemo(() => {
const chain = supportedChainId(chainId)
@ -105,7 +105,7 @@ export function useCurrencyFromMap(tokens: TokenMap, currencyId?: string | null)
const token = useTokenFromMapOrNetwork(tokens, isNative ? undefined : shorthandMatchAddress ?? currencyId)
const chainAllowed = chainId && isChainAllowed(connector, chainId)
const chainAllowed = chainId && isChainAllowed(chainId)
if (currencyId === null || currencyId === undefined || !chainAllowed) return null
// this case so we use our builtin wrapped token instead of wrapped tokens on token lists

2
src/react-app-env.d.ts vendored
View File

@ -4,8 +4,6 @@ declare module '@metamask/jazzicon' {
export default function (diameter: number, seed: number): HTMLElement
}
declare module 'fortmatic'
interface Window {
// walletLinkExtension is injected by the Coinbase Wallet extension
walletLinkExtension?: any

1
src/state/connection/reducer.ts
View File

@ -8,7 +8,6 @@ export interface ConnectionState {
export const initialState: ConnectionState = {
errorByConnectionType: {
[ConnectionType.INJECTED]: undefined,
[ConnectionType.FORTMATIC]: undefined,
[ConnectionType.WALLET_CONNECT]: undefined,
[ConnectionType.COINBASE_WALLET]: undefined,
[ConnectionType.NETWORK]: undefined,

26
src/utils/switchChain.ts
View File

@ -1,12 +1,5 @@
import { Connector } from '@web3-react/types'
import {
coinbaseWalletConnection,
fortmaticConnection,
gnosisSafeConnection,
injectedConnection,
networkConnection,
walletConnectConnection,
} from 'connection'
import { networkConnection, walletConnectConnection } from 'connection'
import { getChainInfo } from 'constants/chainInfo'
import { ALL_SUPPORTED_CHAIN_IDS, SupportedChainId } from 'constants/chains'
import { RPC_URLS } from 'constants/networks'
@ -41,23 +34,12 @@ function getRpcUrls(chainId: SupportedChainId): [string] {
throw new Error('RPC URLs must use public endpoints')
}
export function isChainAllowed(connector: Connector, chainId: number) {
switch (connector) {
case fortmaticConnection.connector:
return chainId === SupportedChainId.MAINNET
case injectedConnection.connector:
case coinbaseWalletConnection.connector:
case walletConnectConnection.connector:
case networkConnection.connector:
case gnosisSafeConnection.connector:
return ALL_SUPPORTED_CHAIN_IDS.includes(chainId)
default:
return false
}
export function isChainAllowed(chainId: number) {
return ALL_SUPPORTED_CHAIN_IDS.includes(chainId)
}
export const switchChain = async (connector: Connector, chainId: SupportedChainId) => {
if (!isChainAllowed(connector, chainId)) {
if (!isChainAllowed(chainId)) {
throw new Error(`Chain ${chainId} not supported for connector (${typeof connector})`)
} else if (connector === walletConnectConnection.connector || connector === networkConnection.connector) {
await connector.activate(chainId)

5
yarn.lock
View File

@ -10284,11 +10284,6 @@ form-data@~2.3.2:
combined-stream "^1.0.6"
mime-types "^2.1.12"
fortmatic@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/fortmatic/-/fortmatic-2.4.0.tgz#0546803d5c6187c06b3367eba66235cf4a195ece"
integrity sha512-4LVxybyWcz8eFkTjIW12JRyRCUV9/qih435l0+5ncTVIb+zzXjvjQ5dZU0eBAXXyAgmV9BIRYkQL9H/lc76w/w==
forwarded@0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.2.0.tgz#2269936428aad4c15c7ebe9779a84bf0b2a81811"