Skip to content

Commit c0206f4

Browse files
authored
Enhancement: Hardware Wallet Filtering (#1244)
* Add filter init option to hardware wallets * Increment demo versions
1 parent 5efc1cc commit c0206f4

File tree

16 files changed

+320
-32
lines changed

16 files changed

+320
-32
lines changed

packages/dcent/README.md

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,3 +25,48 @@ const onboard = Onboard({
2525
const connectedWallets = await onboard.connectWallet()
2626
console.log(connectedWallets)
2727
```
28+
29+
### Filtering Platforms
30+
31+
You may decide that on certain platforms you do not want to display this wallet as a selectable option. To do that you can use the `filter` init option which is an array of platforms that you would like this wallet to **not** be displayed to the end user:
32+
33+
```typescript
34+
import Onboard from '@web3-onboard/core'
35+
import dcentModule from '@web3-onboard/dcent'
36+
37+
const dcent = dcentModule({ filter: ['Safari'] })
38+
39+
const onboard = Onboard({
40+
// ... other Onboard options
41+
wallets: [
42+
dcent
43+
//... other wallets
44+
]
45+
})
46+
47+
const connectedWallets = await onboard.connectWallet()
48+
console.log(connectedWallets)
49+
```
50+
51+
The following is a list of the platforms that can be filtered:
52+
53+
```typescript
54+
type Platform =
55+
| 'Windows Phone'
56+
| 'Windows'
57+
| 'macOS'
58+
| 'iOS'
59+
| 'Android'
60+
| 'Linux'
61+
| 'Chrome OS'
62+
| 'Android Browser'
63+
| 'Chrome'
64+
| 'Chromium'
65+
| 'Firefox'
66+
| 'Microsoft Edge'
67+
| 'Opera'
68+
| 'Safari'
69+
| 'desktop'
70+
| 'mobile'
71+
| 'tablet'
72+
```

packages/dcent/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/dcent",
3-
"version": "2.1.1",
3+
"version": "2.2.0-alpha.1",
44
"description": "D'CENT wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",

packages/dcent/src/index.ts

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
1-
import type { Chain, WalletInit, EIP1193Provider } from '@web3-onboard/common'
1+
import type {
2+
Chain,
3+
WalletInit,
4+
EIP1193Provider,
5+
Platform
6+
} from '@web3-onboard/common'
7+
28
import type { providers } from 'ethers'
39

410
import type {
@@ -51,15 +57,24 @@ const generateAccounts = async (
5157
}
5258

5359
function dcent({
54-
customNetwork
60+
customNetwork,
61+
filter
5562
}: {
5663
customNetwork?: CustomNetwork
64+
filter?: Platform[]
5765
} = {}): WalletInit {
5866
const getIcon = async () => (await import('./icon.js')).default
59-
return helpers => {
60-
const { device } = helpers
67+
68+
return ({ device }) => {
69+
const filtered =
70+
Array.isArray(filter) &&
71+
(filter.includes(device.type) || filter.includes(device.os.name))
72+
73+
if (filtered) return null
74+
6175
const isMobile = device.type === 'mobile'
6276
let accounts: Account[] | undefined
77+
6378
return {
6479
label: "D'CENT",
6580
getIcon,

packages/demo/package.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,19 +24,19 @@
2424
"dependencies": {
2525
"@web3-onboard/coinbase": "^2.1.1",
2626
"@web3-onboard/core": "^2.8.1",
27-
"@web3-onboard/dcent": "^2.1.1",
27+
"@web3-onboard/dcent": "^2.2.0-alpha.1",
2828
"@web3-onboard/fortmatic": "^2.0.12",
2929
"@web3-onboard/gas": "^2.1.1",
3030
"@web3-onboard/gnosis": "^2.1.1",
3131
"@web3-onboard/injected-wallets": "^2.2.0",
32-
"@web3-onboard/keepkey": "^2.2.1",
33-
"@web3-onboard/keystone": "^2.2.1",
34-
"@web3-onboard/ledger": "^2.2.1",
32+
"@web3-onboard/keepkey": "^2.3.0-alpha.1",
33+
"@web3-onboard/keystone": "^2.3.0-alpha.1",
34+
"@web3-onboard/ledger": "^2.3.0-alpha.1",
3535
"@web3-onboard/magic": "^2.1.1",
3636
"@web3-onboard/portis": "^2.1.1",
3737
"@web3-onboard/sequence": "^2.0.0",
3838
"@web3-onboard/torus": "^2.1.1",
39-
"@web3-onboard/trezor": "^2.2.1",
39+
"@web3-onboard/trezor": "^2.3.0-alpha.1",
4040
"@web3-onboard/walletconnect": "^2.1.1",
4141
"@web3-onboard/web3auth": "^2.1.1",
4242
"vconsole": "^3.9.5"

packages/keepkey/README.md

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,3 +25,48 @@ const onboard = Onboard({
2525
const connectedWallets = await onboard.connectWallet()
2626
console.log(connectedWallets)
2727
```
28+
29+
### Filtering Platforms
30+
31+
You may decide that on certain platforms you do not want to display this wallet as a selectable option. To do that you can use the `filter` init option which is an array of platforms that you would like this wallet to **not** be displayed to the end user:
32+
33+
```typescript
34+
import Onboard from '@web3-onboard/core'
35+
import keepkeyModule from '@web3-onboard/keepkey'
36+
37+
const keepkey = keepkeyModule({ filter: ['Safari'] })
38+
39+
const onboard = Onboard({
40+
// ... other Onboard options
41+
wallets: [
42+
keepkey
43+
//... other wallets
44+
]
45+
})
46+
47+
const connectedWallets = await onboard.connectWallet()
48+
console.log(connectedWallets)
49+
```
50+
51+
The following is a list of the platforms that can be filtered:
52+
53+
```typescript
54+
type Platform =
55+
| 'Windows Phone'
56+
| 'Windows'
57+
| 'macOS'
58+
| 'iOS'
59+
| 'Android'
60+
| 'Linux'
61+
| 'Chrome OS'
62+
| 'Android Browser'
63+
| 'Chrome'
64+
| 'Chromium'
65+
| 'Firefox'
66+
| 'Microsoft Edge'
67+
| 'Opera'
68+
| 'Safari'
69+
| 'desktop'
70+
| 'mobile'
71+
| 'tablet'
72+
```

packages/keepkey/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/keepkey",
3-
"version": "2.2.1",
3+
"version": "2.3.0-alpha.1",
44
"description": "KeepKey hardware wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",

packages/keepkey/src/index.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { Chain, WalletInit } from '@web3-onboard/common'
1+
import type { Chain, Platform, WalletInit } from '@web3-onboard/common'
22
import type { StaticJsonRpcProvider } from '@ethersproject/providers'
33
import type { ETHAccountPath } from '@shapeshiftoss/hdwallet-core'
44
import type { KeepKeyHDWallet } from '@shapeshiftoss/hdwallet-keepkey'
@@ -36,12 +36,18 @@ const errorMessages = {
3636

3737
type ErrorCode = 'busy' | 'pairing'
3838

39-
function keepkey(): WalletInit {
39+
function keepkey({ filter }: { filter?: Platform[] } = {}): WalletInit {
4040
const getIcon = async () => (await import('./icon.js')).default
4141

42-
return () => {
42+
return ({ device }) => {
4343
let accounts: Account[] | undefined
4444

45+
const filtered =
46+
Array.isArray(filter) &&
47+
(filter.includes(device.type) || filter.includes(device.os.name))
48+
49+
if (filtered) return null
50+
4551
return {
4652
label: 'KeepKey',
4753
getIcon,

packages/keystone/README.md

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,3 +65,48 @@ const onboard = Onboard({
6565
const connectedWallets = await onboard.connectWallet()
6666
console.log(connectedWallets)
6767
```
68+
69+
### Filtering Platforms
70+
71+
You may decide that on certain platforms you do not want to display this wallet as a selectable option. To do that you can use the `filter` init option which is an array of platforms that you would like this wallet to **not** be displayed to the end user:
72+
73+
```typescript
74+
import Onboard from '@web3-onboard/core'
75+
import keystoneModule from '@web3-onboard/keystone'
76+
77+
const keystone = keystoneModule({ filter: ['Safari'] })
78+
79+
const onboard = Onboard({
80+
// ... other Onboard options
81+
wallets: [
82+
keystone
83+
//... other wallets
84+
]
85+
})
86+
87+
const connectedWallets = await onboard.connectWallet()
88+
console.log(connectedWallets)
89+
```
90+
91+
The following is a list of the platforms that can be filtered:
92+
93+
```typescript
94+
type Platform =
95+
| 'Windows Phone'
96+
| 'Windows'
97+
| 'macOS'
98+
| 'iOS'
99+
| 'Android'
100+
| 'Linux'
101+
| 'Chrome OS'
102+
| 'Android Browser'
103+
| 'Chrome'
104+
| 'Chromium'
105+
| 'Firefox'
106+
| 'Microsoft Edge'
107+
| 'Opera'
108+
| 'Safari'
109+
| 'desktop'
110+
| 'mobile'
111+
| 'tablet'
112+
```

packages/keystone/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/keystone",
3-
"version": "2.2.1",
3+
"version": "2.3.0-alpha.1",
44
"description": "Keystone hardware wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",

packages/keystone/src/index.ts

Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
1-
import type { Chain, CustomNetwork, WalletInit } from '@web3-onboard/common'
1+
import type {
2+
Chain,
3+
CustomNetwork,
4+
Platform,
5+
WalletInit
6+
} from '@web3-onboard/common'
7+
28
import type { Account, ScanAccountsOptions } from '@web3-onboard/hw-common'
39
import type { StaticJsonRpcProvider } from '@ethersproject/providers'
410

@@ -58,13 +64,23 @@ const generateAccounts = async (
5864
}
5965

6066
function keystone({
61-
customNetwork
67+
customNetwork,
68+
filter
6269
}: {
6370
customNetwork?: CustomNetwork
71+
filter?: Platform[]
6472
} = {}): WalletInit {
6573
const getIcon = async () => (await import('./icon.js')).default
66-
return () => {
74+
75+
return ({ device }) => {
6776
let accounts: Account[] | undefined
77+
78+
const filtered =
79+
Array.isArray(filter) &&
80+
(filter.includes(device.type) || filter.includes(device.os.name))
81+
82+
if (filtered) return null
83+
6884
return {
6985
label: 'Keystone',
7086
getIcon,

0 commit comments

Comments
 (0)