Skip to content

Commit 6f06fb3

Browse files
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
1 parent 4b62cc5 commit 6f06fb3

File tree

4 files changed

+58
-46
lines changed

4 files changed

+58
-46
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "bnc-onboard",
3-
"version": "1.34.2-0.0.7",
3+
"version": "1.34.2-0.0.8",
44
"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.",
55
"keywords": [
66
"ethereum",

src/modules/select/index.ts

Lines changed: 51 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import { getProviderName } from '../../utilities'
99
// wallets that qualify for default wallets need to have no
1010
// init parameters that are required for full functionality
1111
const desktopDefaultWalletNames = [
12-
'detectedwallet',
1312
'metamask',
1413
'binance',
1514
'frame',
@@ -19,7 +18,6 @@ const desktopDefaultWalletNames = [
1918
]
2019

2120
const mobileDefaultWalletNames = [
22-
'detectedwallet',
2321
'metamask',
2422
'coinbase',
2523
'trust',
@@ -39,48 +37,65 @@ const mobileDefaultWalletNames = [
3937
'tp'
4038
]
4139

42-
const injectedWalletDetected = () =>
43-
window.ethereum && getProviderName(window.ethereum) === undefined
40+
const providerNameToWalletName = (providerName: string) =>
41+
providerName === 'imToken'
42+
? providerName
43+
: providerName === 'WalletConnect'
44+
? 'walletConnect'
45+
: providerName.toLocaleLowerCase()
4446

4547
function select(
4648
wallets: Array<WalletInitOptions | WalletModule> | undefined,
4749
networkId: number,
4850
isMobile: boolean
4951
) {
52+
// If we detect an injected wallet then place the detected wallet
53+
// at the beginning of the list e.g. the top of the wallet select modal
54+
let detectedProviderName: string | undefined
55+
let detectedWalletName: string | undefined
56+
if (window?.ethereum) {
57+
detectedProviderName = getProviderName(window.ethereum)
58+
if (detectedProviderName) {
59+
detectedWalletName = providerNameToWalletName(detectedProviderName)
60+
}
61+
}
62+
5063
if (wallets) {
5164
const hideWallet = (wallet: WalletInitOptions) =>
5265
wallet?.display &&
5366
wallet?.display[isMobile ? 'mobile' : 'desktop'] === false
5467

55-
// For backwards compatibility if a user is still using 'detectedwallet' in the onboard wallet select array
56-
// it will be filtered out so there are no duplicates
57-
wallets = wallets.filter(
58-
wallet =>
59-
'walletName' in wallet
60-
? wallet.walletName !== 'detectedwallet' && !hideWallet(wallet)
61-
: true // It is not a WalletInitOption but rather a WalletModule so let it through
62-
)
63-
64-
// If we detect an injected wallet then place the detected wallet
65-
// at the beginning of the list e.g. the top of the wallet select modal
66-
if (injectedWalletDetected()) {
68+
if (detectedWalletName) {
69+
// This wallet is built into onboard so add the walletName and
70+
// the code below will load it as a wallet module
71+
wallets.unshift({ walletName: detectedWalletName })
72+
} else if (detectedProviderName) {
73+
// A provider has been detected but there is not a walletName therefore
74+
// this wallet is not built into onboard so add it as a generic injected wallet
6775
wallets.unshift({ walletName: 'detectedwallet' })
6876
}
6977

78+
const setOfWallets = new Set<string>()
7079
return Promise.all(
7180
wallets.map(wallet => {
7281
// If this is a wallet init object then load the built-in wallet module
73-
if (isWalletInit(wallet)) {
82+
if (isWalletInit(wallet) && !hideWallet(wallet)) {
7483
const { walletName, ...initParams } = wallet
75-
try {
76-
return getModule(walletName).then((m: any) =>
77-
m.default({ ...initParams, networkId, isMobile })
78-
)
79-
} catch (error) {
80-
if (error.name === 'DeprecatedWalletError') {
81-
console.warn(error.message)
82-
} else {
83-
throw error
84+
// Check to see if we have seen this wallet before
85+
// prevents duplicated injected wallet from being added
86+
if (!setOfWallets.has(walletName)) {
87+
try {
88+
const module = getModule(walletName).then((m: any) =>
89+
m.default({ ...initParams, networkId, isMobile })
90+
)
91+
setOfWallets.add(walletName)
92+
return module
93+
} catch (error) {
94+
if (error.name === 'DeprecatedWalletError') {
95+
console.warn(error.message)
96+
} else {
97+
throw error
98+
}
8499
}
85100
}
86101
}
@@ -94,17 +109,17 @@ function select(
94109
const defaultWalletNames = isMobile
95110
? mobileDefaultWalletNames
96111
: desktopDefaultWalletNames
97-
112+
// If we have detected a builtin wallet that is not already in the list of default wallets so add it
113+
if (detectedWalletName && !defaultWalletNames.includes(detectedWalletName)) {
114+
defaultWalletNames.unshift(detectedWalletName)
115+
// If we detected a provider but it is not builtin add the generic injected provider
116+
} else if (!detectedWalletName && detectedProviderName) {
117+
defaultWalletNames.unshift('detectedwallet')
118+
}
98119
return Promise.all(
99-
defaultWalletNames
100-
// Include the detected wallet only if an injected wallet is detected
101-
.filter(
102-
walletName =>
103-
walletName !== 'detectedwallet' || injectedWalletDetected()
104-
)
105-
.map(walletName =>
106-
getModule(walletName).then((m: any) => m.default({ networkId }))
107-
)
120+
defaultWalletNames.map(walletName =>
121+
getModule(walletName).then((m: any) => m.default({ networkId }))
122+
)
108123
)
109124
}
110125

src/modules/select/wallets/detectedwallet.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,12 @@ function injected(options: CommonWalletOptions): WalletModule {
1212
const name =
1313
label ||
1414
Object.keys(provider)
15-
.find(key => key.startsWith('is') && !key.includes('MetaMask'))
15+
.find(
16+
key =>
17+
key.startsWith('is') &&
18+
!key.includes('MetaMask') &&
19+
!key.includes('Connected')
20+
)
1621
?.split('is')[1] ||
1722
'Detected Wallet'
1823

src/utilities.ts

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -297,14 +297,6 @@ export function getProviderName(provider: any): string | undefined {
297297
return 'Coinbase'
298298
}
299299

300-
if (provider.isToshi) {
301-
return 'Toshi'
302-
}
303-
304-
if (provider.isCipher) {
305-
return 'Cipher'
306-
}
307-
308300
if (provider.isOpera) {
309301
return 'Opera'
310302
}

0 commit comments

Comments
 (0)