Skip to content

Commit 348dcbf

Browse files
authored
feat: add blocto wallet (#1699)
1 parent d399e0b commit 348dcbf

File tree

36 files changed

+667
-18
lines changed

36 files changed

+667
-18
lines changed

.circleci/config.yml

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -395,6 +395,12 @@ jobs:
395395
working_directory: ~/web3-onboard-monorepo/packages/cede-store
396396
steps:
397397
- node-build-steps
398+
build-blocto:
399+
docker:
400+
- image: cimg/node:16.13.1
401+
working_directory: ~/web3-onboard-monorepo/packages/blocto
402+
steps:
403+
- node-build-steps
398404
build-venly:
399405
docker:
400406
- image: cimg/node:16.13.1
@@ -631,6 +637,12 @@ jobs:
631637
working_directory: ~/web3-onboard-monorepo/packages/cede-store
632638
steps:
633639
- node-staging-build-steps
640+
build-staging-blocto:
641+
docker:
642+
- image: cimg/node:16.13.1
643+
working_directory: ~/web3-onboard-monorepo/packages/blocto
644+
steps:
645+
- node-staging-build-steps
634646
build-staging-venly:
635647
docker:
636648
- image: cimg/node:16.13.1
@@ -869,6 +881,12 @@ workflows:
869881
<<: *deploy_production_filters
870882
- build-staging-cede-store:
871883
<<: *deploy_staging_filters
884+
blocto:
885+
jobs:
886+
- build-blocto:
887+
<<: *deploy_production_filters
888+
- build-staging-blocto:
889+
<<: *deploy_staging_filters
872890
venly:
873891
jobs:
874892
- build-venly:

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,7 @@ For full documentation, check out the README.md for each package or the [docs pa
104104
- [XDEFI](packages/xdefi/README.md)
105105
- [Infinity Wallet](packages/infinity-wallet/README.md)
106106
- [Frame](packages/frame/README.md)
107+
- [Blocto](packages/blocto/README.md)
107108

108109
**Hardware Wallets**
109110

docs/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@
1212
"format": "prettier --plugin-search-dir . --write .",
1313
"prepare": "svelte-kit sync",
1414
"test": "playwright test",
15-
"w3o-latest-prod": "yarn add '@web3-onboard/core' '@web3-onboard/coinbase' '@web3-onboard/transaction-preview' '@web3-onboard/dcent' '@web3-onboard/frontier' '@web3-onboard/fortmatic' '@web3-onboard/frame' '@web3-onboard/gas' '@web3-onboard/gnosis' '@web3-onboard/keepkey' '@web3-onboard/keystone' '@web3-onboard/ledger' '@web3-onboard/infinity-wallet' '@web3-onboard/injected-wallets' '@web3-onboard/magic' '@web3-onboard/phantom' '@web3-onboard/portis' '@web3-onboard/sequence' '@web3-onboard/trezor' '@web3-onboard/trust' '@web3-onboard/torus' '@web3-onboard/taho' '@web3-onboard/web3auth' '@web3-onboard/walletconnect' '@web3-onboard/enkrypt' '@web3-onboard/mew-wallet' '@web3-onboard/xdefi' '@web3-onboard/uauth' '@web3-onboard/zeal' '@web3-onboard/cede-store'",
16-
"w3o-latest-alpha": "yarn add '@web3-onboard/core@next' '@web3-onboard/coinbase@next' '@web3-onboard/transaction-preview@next' '@web3-onboard/dcent@next' '@web3-onboard/frontier@next' '@web3-onboard/fortmatic@next' '@web3-onboard/frame@next' '@web3-onboard/gas@next' '@web3-onboard/gnosis@next' '@web3-onboard/keepkey@next' '@web3-onboard/keystone@next' '@web3-onboard/ledger@next' '@web3-onboard/infinity-wallet@next' '@web3-onboard/injected-wallets@next' '@web3-onboard/magic@next' '@web3-onboard/phantom@next' '@web3-onboard/portis@next' '@web3-onboard/sequence@next' '@web3-onboard/trezor@next' '@web3-onboard/trust@next' '@web3-onboard/torus@next' '@web3-onboard/taho@next' '@web3-onboard/web3auth@next' '@web3-onboard/walletconnect@next' '@web3-onboard/enkrypt@next' '@web3-onboard/mew-wallet@next' '@web3-onboard/xdefi@next' '@web3-onboard/uauth@next' '@web3-onboard/zeal@next' '@web3-onboard/cede-store@next'"
15+
"w3o-latest-prod": "yarn add '@web3-onboard/core' '@web3-onboard/coinbase' '@web3-onboard/transaction-preview' '@web3-onboard/dcent' '@web3-onboard/frontier' '@web3-onboard/fortmatic' '@web3-onboard/frame' '@web3-onboard/gas' '@web3-onboard/gnosis' '@web3-onboard/keepkey' '@web3-onboard/keystone' '@web3-onboard/ledger' '@web3-onboard/infinity-wallet' '@web3-onboard/injected-wallets' '@web3-onboard/magic' '@web3-onboard/phantom' '@web3-onboard/portis' '@web3-onboard/sequence' '@web3-onboard/trezor' '@web3-onboard/trust' '@web3-onboard/torus' '@web3-onboard/taho' '@web3-onboard/web3auth' '@web3-onboard/walletconnect' '@web3-onboard/enkrypt' '@web3-onboard/mew-wallet' '@web3-onboard/xdefi' '@web3-onboard/uauth' '@web3-onboard/zeal' '@web3-onboard/cede-store' '@web3-onboard/blocto'",
16+
"w3o-latest-alpha": "yarn add '@web3-onboard/core@next' '@web3-onboard/coinbase@next' '@web3-onboard/transaction-preview@next' '@web3-onboard/dcent@next' '@web3-onboard/frontier@next' '@web3-onboard/fortmatic@next' '@web3-onboard/frame@next' '@web3-onboard/gas@next' '@web3-onboard/gnosis@next' '@web3-onboard/keepkey@next' '@web3-onboard/keystone@next' '@web3-onboard/ledger@next' '@web3-onboard/infinity-wallet@next' '@web3-onboard/injected-wallets@next' '@web3-onboard/magic@next' '@web3-onboard/phantom@next' '@web3-onboard/portis@next' '@web3-onboard/sequence@next' '@web3-onboard/trezor@next' '@web3-onboard/trust@next' '@web3-onboard/torus@next' '@web3-onboard/taho@next' '@web3-onboard/web3auth@next' '@web3-onboard/walletconnect@next' '@web3-onboard/enkrypt@next' '@web3-onboard/mew-wallet@next' '@web3-onboard/xdefi@next' '@web3-onboard/uauth@next' '@web3-onboard/zeal@next' '@web3-onboard/cede-store@next' '@web3-onboard/blocto@next'"
1717
},
1818
"devDependencies": {
1919
"@algolia/client-search": "^4.17.0",

docs/src/lib/services/onboard.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ const intiOnboard = async (theme) => {
5353
const { default: xdefiModule } = await import('@web3-onboard/xdefi')
5454
const { default: cedeModule } = await import('@web3-onboard/cede-store')
5555
const { default: frameModule } = await import('@web3-onboard/frame')
56+
const { default: bloctoModule } = await import('@web3-onboard/blocto')
5657
const { default: venlyModule } = await import('@web3-onboard/venly')
5758
const INFURA_ID = '8b60d52405694345a99bcb82e722e0af'
5859

@@ -108,6 +109,7 @@ const intiOnboard = async (theme) => {
108109

109110
const frame = frameModule()
110111

112+
const blocto = bloctoModule()
111113
const venly = venlyModule({
112114
clientId: 'blocknative',
113115
environment: 'staging'
@@ -138,6 +140,7 @@ const intiOnboard = async (theme) => {
138140
portis,
139141
frame,
140142
infinityWallet,
143+
blocto
141144
// venly
142145
],
143146
chains: [

docs/src/routes/docs/[...1]overview/[...1]introduction/+page.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -157,6 +157,7 @@ We recommend you add the [Core Repo](../../modules/core.md#install) and consider
157157
- [Portis](../../wallets/portis.md#install)
158158
- [Web3Auth](../../wallets/web3auth.md#install)
159159
- [Frame](../../wallets/frame.md#install)
160+
- [Blocto](../../docs/wallets/blocto.md#install)
160161

161162
**Hardware Wallets**
162163

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
---
2+
title: Blocto
3+
---
4+
5+
# {$frontmatter.title}
6+
7+
Wallet module for connecting Blocto SDK to web3-onboard. Check out the [Blocto Developer Docs](https://docs.blocto.app/blocto-sdk/javascript-sdk/evm-sdk) for more information.
8+
9+
## Install
10+
11+
<Tabs values={['yarn', 'npm']}>
12+
<TabPanel value="yarn">
13+
14+
```sh copy
15+
yarn add @web3-onboard/blocto
16+
```
17+
18+
</TabPanel>
19+
<TabPanel value="npm">
20+
21+
```sh copy
22+
npm install @web3-onboard/blocto
23+
```
24+
25+
</TabPanel>
26+
</Tabs>
27+
28+
## Usage
29+
30+
```typescript
31+
import Onboard from '@web3-onboard/core'
32+
import bloctoModule from '@web3-onboard/blocto'
33+
34+
// initialize the module with options
35+
const blocto = bloctoModule()
36+
37+
const onboard = Onboard({
38+
// ... other Onboard options
39+
wallets: [
40+
blocto
41+
//... other wallets
42+
]
43+
})
44+
45+
const connectedWallets = await onboard.connectWallet()
46+
console.log(connectedWallets)
47+
```
48+
49+
## Build Environments
50+
51+
For build env configurations and setups please see the Build Env section [here](/docs/modules/core#build-environments)
52+
53+
### Webpack 4
54+
55+
Node built-ins are automatically bundled in v4 so that portion is handled automatically.
56+
57+
**Blocto** support will require a Babel to compile from es6 if not already supported. See config for Babel and Webpack4 as follows
58+
59+
`npm i --save-dev @babel/cli @babel/core @babel/node @babel/plugin-proposal-nullish-coalescing-operator @babel/plugin-proposal-optional-chaining @babel/plugin-syntax-bigint @babel/register`
60+
**AND**
61+
`npm i babel-loader`
62+
63+
**babel.config.js**
64+
65+
```javascript
66+
module.exports = (api) => {
67+
api.cache(true)
68+
const plugins = [
69+
'@babel/plugin-proposal-optional-chaining',
70+
'@babel/plugin-proposal-nullish-coalescing-operator',
71+
'@babel/plugin-syntax-bigint'
72+
]
73+
return { plugins }
74+
}
75+
```
76+
77+
**webpack.config.js**
78+
79+
```javascript
80+
config.module.rules = [
81+
...otherModuleRules,
82+
{
83+
test: /\.js$/,
84+
exclude: (_) => !/node_modules\/(@web3auth|@ethereumjs)/.test(_),
85+
loader: 'babel-loader'
86+
}
87+
]
88+
```

packages/blocto/README.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# @web3-onboard/blocto
2+
3+
## Wallet module for connecting Blocto SDK to web3-onboard
4+
5+
See [Blocto Developer Docs](https://docs.blocto.app/blocto-sdk/javascript-sdk/evm-sdk)
6+
7+
### Install
8+
9+
`npm i @web3-onboard/blocto`
10+
11+
## Usage
12+
13+
```typescript
14+
import Onboard from '@web3-onboard/core'
15+
import bloctoModule from '@web3-onboard/blocto'
16+
17+
// initialize the module with options
18+
const blocto = bloctoModule()
19+
20+
const onboard = Onboard({
21+
// ... other Onboard options
22+
wallets: [
23+
blocto
24+
//... other wallets
25+
]
26+
})
27+
28+
const connectedWallets = await onboard.connectWallet()
29+
console.log(connectedWallets)
30+
```

packages/blocto/package.json

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
{
2+
"name": "@web3-onboard/blocto",
3+
"version": "2.0.0-alpha.1",
4+
"description": "Blocto SDK 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.",
5+
"keywords": [
6+
"Ethereum",
7+
"Web3",
8+
"EVM",
9+
"dapp",
10+
"Multichain",
11+
"Wallet",
12+
"Transaction",
13+
"Provider",
14+
"Hardware Wallet",
15+
"Notifications",
16+
"React",
17+
"Svelte",
18+
"Vue",
19+
"Next",
20+
"Nuxt",
21+
"MetaMask",
22+
"Coinbase",
23+
"WalletConnect",
24+
"Ledger",
25+
"Trezor",
26+
"Connect Wallet",
27+
"Ethereum Hooks",
28+
"Blocknative",
29+
"Mempool",
30+
"pending",
31+
"confirmed",
32+
"Injected Wallet",
33+
"Crypto",
34+
"Crypto Wallet",
35+
"Tally Ho",
36+
"Blocto"
37+
],
38+
"repository": {
39+
"type": "git",
40+
"url": "https://github.com/blocknative/web3-onboard.git",
41+
"directory": "packages/core"
42+
},
43+
"homepage": "https://onboard.blocknative.com",
44+
"bugs": "https://github.com/blocknative/web3-onboard/issues",
45+
"module": "dist/index.js",
46+
"browser": "dist/index.js",
47+
"main": "dist/index.js",
48+
"type": "module",
49+
"typings": "dist/index.d.ts",
50+
"files": [
51+
"dist"
52+
],
53+
"scripts": {
54+
"build": "tsc",
55+
"dev": "tsc -w",
56+
"type-check": "tsc --noEmit"
57+
},
58+
"license": "MIT",
59+
"devDependencies": {
60+
"@ethersproject/providers": "^5.5.0",
61+
"@types/lodash.uniqby": "^4.7.6",
62+
"@types/node": "^17.0.21",
63+
"ts-node": "^10.2.1",
64+
"typescript": "^4.5.5",
65+
"window": "^4.2.7"
66+
},
67+
"dependencies": {
68+
"@web3-onboard/common": "^2.3.1",
69+
"@blocto/sdk": "^0.4.6"
70+
}
71+
}

packages/blocto/src/icon.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
export default `
2+
<svg width="32" height="32" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
3+
<g clip-path="url(#clip0_2233_2387)">
4+
<rect width="60" height="60" rx="12" fill="white"/>
5+
<path d="M32.9028 18.3063C28.3911 18.3063 23.9873 20.0459 20.6952 23.1319C17.0843 26.5176 14.7992 31.5177 13.4893 36.2212C12.6314 39.2992 12.2016 42.4915 12.2016 45.6853C12.2016 46.6511 12.2412 47.6089 12.3174 48.5556C12.4109 49.7069 13.5321 50.5046 14.6485 50.2033C15.6222 49.9416 16.6466 49.8005 17.7028 49.8005C19.8722 49.8005 21.9052 50.3904 23.648 51.4212C23.6908 51.4466 23.732 51.4719 23.7748 51.4957C26.6071 53.1846 29.9484 54.1123 33.5117 53.9934C42.8062 53.6857 50.399 46.123 50.7416 36.8301C51.1158 26.6635 42.9869 18.3047 32.9044 18.3047L32.9028 18.3063ZM32.9028 44.312C28.3975 44.312 24.7454 40.6599 24.7454 36.1562C24.7454 31.6525 28.3975 27.9987 32.9028 27.9987C37.4081 27.9987 41.0602 31.6509 41.0602 36.1562C41.0602 40.6614 37.4081 44.312 32.9028 44.312Z" fill="#14AAFF"/>
6+
<path d="M25.5636 12.6826C25.5636 15.0344 24.3315 17.2164 22.308 18.4153C21.0377 19.1686 19.8468 20.0582 18.7684 21.0715C16.3755 23.3139 14.5898 26.0653 13.2673 28.7929C13.0072 29.3304 12.2 29.1402 12.2 28.5423V12.6826C12.2 8.99242 15.1924 6 18.8826 6C22.5728 6 25.5652 8.99242 25.5652 12.6826H25.5636Z" fill="#0075FF"/>
7+
</g>
8+
<defs>
9+
<clipPath id="clip0_2233_2387">
10+
<rect width="60" height="60" fill="white"/>
11+
</clipPath>
12+
</defs>
13+
</svg>
14+
`

packages/blocto/src/index.ts

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
import type { WalletInit } from '@web3-onboard/common'
2+
3+
function BloctoWallet(): WalletInit {
4+
if (typeof window === 'undefined') return () => null
5+
return () => {
6+
return {
7+
label: 'Blocto',
8+
getIcon: async () => (await import('./icon.js')).default,
9+
getInterface: async ({ chains }) => {
10+
const { default: BloctoSDK } = await import('@blocto/sdk')
11+
12+
const { createEIP1193Provider } = await import('@web3-onboard/common')
13+
14+
const [defaultChain] = chains
15+
16+
const instance = new BloctoSDK({
17+
ethereum: {
18+
chainId: defaultChain.id,
19+
rpc: defaultChain.rpcUrl
20+
}
21+
})
22+
const bloctoProvider: any = instance.ethereum
23+
24+
const provider = createEIP1193Provider(bloctoProvider, {
25+
eth_selectAccounts: null,
26+
wallet_switchEthereumChain: async ({ params, baseRequest }) => {
27+
const chain = chains.find(function (item) {
28+
return item.id === (params && params[0] && params[0].chainId)
29+
})
30+
if (!chain) throw new Error('chain must be set before switching')
31+
const providerRpcurl =
32+
bloctoProvider.switchableNetwork[chain.id] &&
33+
bloctoProvider.switchableNetwork[chain.id].rpc_url
34+
const chainUrl = chain.rpcUrl
35+
if (providerRpcurl !== chainUrl) {
36+
await baseRequest({
37+
method: 'wallet_addEthereumChain',
38+
params: [
39+
{
40+
chainId: chain.id,
41+
rpcUrls: [chainUrl]
42+
}
43+
]
44+
})
45+
}
46+
await baseRequest({
47+
method: 'wallet_switchEthereumChain',
48+
params: [{ chainId: chain.id }]
49+
})
50+
return null
51+
},
52+
eth_chainId: async ({ baseRequest }) => {
53+
const chainId = await baseRequest({ method: 'eth_chainId' })
54+
return `0x${parseInt(chainId).toString(16)}`
55+
}
56+
})
57+
58+
provider.disconnect = () =>
59+
instance.ethereum
60+
? instance.ethereum.request({ method: 'wallet_disconnect' })
61+
: null
62+
// patch the chainChanged event
63+
const on = bloctoProvider.on.bind(bloctoProvider)
64+
bloctoProvider.on = (
65+
event: string,
66+
listener: (arg0: string) => void
67+
) => {
68+
on(event, (val: any) => {
69+
if (event === 'chainChanged') {
70+
listener(`0x${(val as number).toString(16)}`)
71+
return
72+
}
73+
listener(val)
74+
})
75+
return bloctoProvider
76+
}
77+
return {
78+
provider,
79+
instance
80+
}
81+
}
82+
}
83+
}
84+
}
85+
86+
export default BloctoWallet

0 commit comments

Comments
 (0)