From 6f06fb353f510c4bd566fb84ddbfe70b8467c4aa Mon Sep 17 00:00:00 2001 From: Taylor Dawson Date: Mon, 27 Sep 2021 17:25:45 -0700 Subject: [PATCH] 1.34.2-0.0.8: [fix] EIP-1193 support in onboard (#701) * 1.34.2-0.0.6: [fix] EIP-1193 support in onboard - refactors detection to include builtin wallets - removes unused providers * version bump * Fix duplicate detected wallets * Fix linting --- package.json | 2 +- src/modules/select/index.ts | 87 ++++++++++++-------- src/modules/select/wallets/detectedwallet.ts | 7 +- src/utilities.ts | 8 -- 4 files changed, 58 insertions(+), 46 deletions(-) diff --git a/package.json b/package.json index 663fd623c..7c2fe1c7e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bnc-onboard", - "version": "1.34.2-0.0.7", + "version": "1.34.2-0.0.8", "description": "Onboard users to web3 by allowing them to select a wallet, get that wallet ready to transact and have access to synced wallet state.", "keywords": [ "ethereum", diff --git a/src/modules/select/index.ts b/src/modules/select/index.ts index f0be37593..46fdbf635 100644 --- a/src/modules/select/index.ts +++ b/src/modules/select/index.ts @@ -9,7 +9,6 @@ import { getProviderName } from '../../utilities' // wallets that qualify for default wallets need to have no // init parameters that are required for full functionality const desktopDefaultWalletNames = [ - 'detectedwallet', 'metamask', 'binance', 'frame', @@ -19,7 +18,6 @@ const desktopDefaultWalletNames = [ ] const mobileDefaultWalletNames = [ - 'detectedwallet', 'metamask', 'coinbase', 'trust', @@ -39,48 +37,65 @@ const mobileDefaultWalletNames = [ 'tp' ] -const injectedWalletDetected = () => - window.ethereum && getProviderName(window.ethereum) === undefined +const providerNameToWalletName = (providerName: string) => + providerName === 'imToken' + ? providerName + : providerName === 'WalletConnect' + ? 'walletConnect' + : providerName.toLocaleLowerCase() function select( wallets: Array | undefined, networkId: number, isMobile: boolean ) { + // If we detect an injected wallet then place the detected wallet + // at the beginning of the list e.g. the top of the wallet select modal + let detectedProviderName: string | undefined + let detectedWalletName: string | undefined + if (window?.ethereum) { + detectedProviderName = getProviderName(window.ethereum) + if (detectedProviderName) { + detectedWalletName = providerNameToWalletName(detectedProviderName) + } + } + if (wallets) { const hideWallet = (wallet: WalletInitOptions) => wallet?.display && wallet?.display[isMobile ? 'mobile' : 'desktop'] === false - // For backwards compatibility if a user is still using 'detectedwallet' in the onboard wallet select array - // it will be filtered out so there are no duplicates - wallets = wallets.filter( - wallet => - 'walletName' in wallet - ? wallet.walletName !== 'detectedwallet' && !hideWallet(wallet) - : true // It is not a WalletInitOption but rather a WalletModule so let it through - ) - - // If we detect an injected wallet then place the detected wallet - // at the beginning of the list e.g. the top of the wallet select modal - if (injectedWalletDetected()) { + if (detectedWalletName) { + // This wallet is built into onboard so add the walletName and + // the code below will load it as a wallet module + wallets.unshift({ walletName: detectedWalletName }) + } else if (detectedProviderName) { + // A provider has been detected but there is not a walletName therefore + // this wallet is not built into onboard so add it as a generic injected wallet wallets.unshift({ walletName: 'detectedwallet' }) } + const setOfWallets = new Set() return Promise.all( wallets.map(wallet => { // If this is a wallet init object then load the built-in wallet module - if (isWalletInit(wallet)) { + if (isWalletInit(wallet) && !hideWallet(wallet)) { const { walletName, ...initParams } = wallet - try { - return getModule(walletName).then((m: any) => - m.default({ ...initParams, networkId, isMobile }) - ) - } catch (error) { - if (error.name === 'DeprecatedWalletError') { - console.warn(error.message) - } else { - throw error + // Check to see if we have seen this wallet before + // prevents duplicated injected wallet from being added + if (!setOfWallets.has(walletName)) { + try { + const module = getModule(walletName).then((m: any) => + m.default({ ...initParams, networkId, isMobile }) + ) + setOfWallets.add(walletName) + return module + } catch (error) { + if (error.name === 'DeprecatedWalletError') { + console.warn(error.message) + } else { + throw error + } } } } @@ -94,17 +109,17 @@ function select( const defaultWalletNames = isMobile ? mobileDefaultWalletNames : desktopDefaultWalletNames - + // If we have detected a builtin wallet that is not already in the list of default wallets so add it + if (detectedWalletName && !defaultWalletNames.includes(detectedWalletName)) { + defaultWalletNames.unshift(detectedWalletName) + // If we detected a provider but it is not builtin add the generic injected provider + } else if (!detectedWalletName && detectedProviderName) { + defaultWalletNames.unshift('detectedwallet') + } return Promise.all( - defaultWalletNames - // Include the detected wallet only if an injected wallet is detected - .filter( - walletName => - walletName !== 'detectedwallet' || injectedWalletDetected() - ) - .map(walletName => - getModule(walletName).then((m: any) => m.default({ networkId })) - ) + defaultWalletNames.map(walletName => + getModule(walletName).then((m: any) => m.default({ networkId })) + ) ) } diff --git a/src/modules/select/wallets/detectedwallet.ts b/src/modules/select/wallets/detectedwallet.ts index 56281f493..3143b6415 100644 --- a/src/modules/select/wallets/detectedwallet.ts +++ b/src/modules/select/wallets/detectedwallet.ts @@ -12,7 +12,12 @@ function injected(options: CommonWalletOptions): WalletModule { const name = label || Object.keys(provider) - .find(key => key.startsWith('is') && !key.includes('MetaMask')) + .find( + key => + key.startsWith('is') && + !key.includes('MetaMask') && + !key.includes('Connected') + ) ?.split('is')[1] || 'Detected Wallet' diff --git a/src/utilities.ts b/src/utilities.ts index 1afd21dad..0b0d87dc1 100644 --- a/src/utilities.ts +++ b/src/utilities.ts @@ -297,14 +297,6 @@ export function getProviderName(provider: any): string | undefined { return 'Coinbase' } - if (provider.isToshi) { - return 'Toshi' - } - - if (provider.isCipher) { - return 'Cipher' - } - if (provider.isOpera) { return 'Opera' }