diff --git a/src/constants/wallet.ts b/src/constants/wallet.ts index 2728c0f25..f3f81286e 100644 --- a/src/constants/wallet.ts +++ b/src/constants/wallet.ts @@ -53,7 +53,15 @@ export const SUPPORTED_WALLETS: { [key: string]: WalletInfo } = { description: 'Use Coinbase Wallet app on mobile device', href: null, color: '#315CF5', + }, + COINBASE_LINK: { + name: 'Open in Coinbase Wallet', + iconURL: COINBASE_ICON_URL, + description: 'Open in Coinbase Wallet app.', + href: 'https://go.cb-w.com/mtUDhEZPy1', + color: '#315CF5', mobile: true, + mobileOnly: true, }, FORTMATIC: { connector: fortmatic, diff --git a/src/custom/constants/index.ts b/src/custom/constants/index.ts index 257d0f20a..cdbae7d66 100644 --- a/src/custom/constants/index.ts +++ b/src/custom/constants/index.ts @@ -26,7 +26,13 @@ export const APP_DATA_HASH = getAppDataHash() export const PRODUCTION_URL = 'cowswap.exchange' export const BARN_URL = `barn.${PRODUCTION_URL}` -const DISABLED_WALLETS = /^(?:Portis)$/i +// Allow WALLET_LINK to be activated on mobile +// since COINBASE_LINK is limited to use only 1 deeplink on mobile +SUPPORTED_WALLETS_UNISWAP.WALLET_LINK = { + ...SUPPORTED_WALLETS_UNISWAP.WALLET_LINK, + mobile: true, +} +const DISABLED_WALLETS = /^(?:Portis|COINBASE_LINK)$/i // Re-export only the supported wallets export const SUPPORTED_WALLETS = Object.keys(SUPPORTED_WALLETS_UNISWAP).reduce((acc, key) => { @@ -115,6 +121,7 @@ export const AMOUNT_OF_ORDERS_TO_FETCH = 100 // last wallet provider key used in local storage export const STORAGE_KEY_LAST_PROVIDER = 'lastProvider' +export const WAITING_TIME_RECONNECT_LAST_PROVIDER = 15000 // 15s // Default price strategy to use for getting app prices // COWSWAP = new quote endpoint diff --git a/src/custom/hooks/web3.ts b/src/custom/hooks/web3.ts index 2967f7c50..d0bcc2a08 100644 --- a/src/custom/hooks/web3.ts +++ b/src/custom/hooks/web3.ts @@ -3,7 +3,7 @@ import { AbstractConnector } from '@web3-react/abstract-connector' import { useEffect, useState, useCallback } from 'react' import { isMobile } from 'react-device-detect' import { injected, walletconnect, getProviderType, WalletProvider, fortmatic, walletlink } from 'connectors' -import { STORAGE_KEY_LAST_PROVIDER } from 'constants/index' +import { STORAGE_KEY_LAST_PROVIDER, WAITING_TIME_RECONNECT_LAST_PROVIDER } from 'constants/index' // exports from the original file export { useActiveWeb3React, useInactiveListener } from '@src/hooks/web3' @@ -58,7 +58,7 @@ export function useEagerConnect() { setTried(true) }) }, - [activate, setTried] + [activate] ) useEffect(() => { @@ -85,9 +85,18 @@ export function useEagerConnect() { // if the connection worked, wait until we get confirmation of that to flip the flag useEffect(() => { + let timeout: NodeJS.Timeout | undefined + if (active) { setTried(true) + } else { + timeout = setTimeout(() => { + localStorage.removeItem(STORAGE_KEY_LAST_PROVIDER) + setTried(true) + }, WAITING_TIME_RECONNECT_LAST_PROVIDER) } + + return () => timeout && clearTimeout(timeout) }, [active]) useEffect(() => {