This repository has been archived by the owner on Nov 10, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 363
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Feature: replace web3connect with onboardjs (#456)
* init onboard.js * dep bump * initial replacement of web3connect with onboard.js * use averta font in the modal * update onboard.js, add handlers for session murder * update preferred wallets * implement reconnecting to injected provider * fix duplicate wallet disconnected notification * update onboard dep * onboardjs fixes * test onboard js with hw * add https to rpcUrl * Added saved wallet and transactions validation * made Transactions validation * bnc-onboard version updated * Fix lock/unlock problem * bump onboardjs version * fixed material-ui lab version * Update onboard version * Added hw wallets integration * Updated preferred wallets * Add ledger modal * Merge with dev * Update onboard * BUmp new version of onboardjs * Added some logs * Added some logs * Update onboardjs version fix ledger connection * Update onboardjs version fix ledger connection * Bump new onboardjs version * Update new version * Made improvements * yarn.lock regenration * remove https=true * Remove comments and added some improvements * Updated package.json dep * Removed unused deps * Remove web3connect dep Co-authored-by: lukasschor <[email protected]> Co-authored-by: Mati Dastugue <[email protected]>
- Loading branch information
3 people
authored
Mar 4, 2020
1 parent
b084c80
commit 8adf6c2
Showing
22 changed files
with
1,265 additions
and
1,471 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,69 +1,99 @@ | ||
| // @flow | ||
| import Portis from '@portis/web3' | ||
| import Torus from '@toruslabs/torus-embed' | ||
| import WalletConnectProvider from '@walletconnect/web3-provider' | ||
| import Authereum from 'authereum' | ||
| import Fortmatic from 'fortmatic' | ||
| import Onboard from 'bnc-onboard' | ||
| import React from 'react' | ||
| import Web3Connect from 'web3connect' | ||
|
|
||
| import Button from '~/components/layout/Button' | ||
| import { getNetwork } from '~/config' | ||
| import { fetchProvider, removeProvider } from '~/logic/wallets/store/actions' | ||
| import { getNetworkId } from '~/config' | ||
| import { getWeb3, setWeb3 } from '~/logic/wallets/getWeb3' | ||
| import { fetchProvider } from '~/logic/wallets/store/actions' | ||
| import transactionDataCheck from '~/logic/wallets/transactionDataCheck' | ||
| import { store } from '~/store' | ||
|
|
||
| const isMainnet = process.env.REACT_APP_NETWORK === 'mainnet' | ||
|
|
||
| const BLOCKNATIVE_API_KEY = isMainnet ? process.env.REACT_APP_BLOCKNATIVE_KEY : '7fbb9cee-7e97-4436-8770-8b29a9a8814c' | ||
| const PORTIS_DAPP_ID = isMainnet ? process.env.REACT_APP_PORTIS_ID : '852b763d-f28b-4463-80cb-846d7ec5806b' | ||
| // const SQUARELINK_CLIENT_ID = isMainnet ? process.env.REACT_APP_SQUARELINK_ID : '46ce08fe50913cfa1b78' | ||
| const FORTMATIC_API_KEY = isMainnet ? process.env.REACT_APP_FORTMATIC_KEY : 'pk_test_CAD437AA29BE0A40' | ||
|
|
||
| export const web3Connect = new Web3Connect.Core({ | ||
| network: getNetwork().toLowerCase(), | ||
| providerOptions: { | ||
| walletconnect: { | ||
| package: WalletConnectProvider, | ||
| options: { | ||
| infuraId: process.env.REACT_APP_INFURA_TOKEN, | ||
| }, | ||
| }, | ||
| portis: { | ||
| package: Portis, | ||
| options: { | ||
| id: PORTIS_DAPP_ID, | ||
| }, | ||
| }, | ||
| fortmatic: { | ||
| package: Fortmatic, | ||
| options: { | ||
| key: FORTMATIC_API_KEY, | ||
| }, | ||
| }, | ||
| torus: { | ||
| package: Torus, | ||
| options: { | ||
| enableLogging: false, | ||
| buttonPosition: 'bottom-left', | ||
| buildEnv: process.env.NODE_ENV, | ||
| showTorusButton: true, | ||
| }, | ||
| const wallets = [ | ||
| { walletName: 'metamask', preferred: true }, | ||
| { | ||
| walletName: 'walletConnect', | ||
| preferred: true, | ||
| infuraKey: process.env.REACT_APP_INFURA_TOKEN, | ||
| }, | ||
| { | ||
| walletName: 'trezor', | ||
| appUrl: 'gnosis-safe.io', | ||
| preferred: true, | ||
| email: '[email protected]', | ||
| rpcUrl: 'https://rinkeby.infura.io/v3/b42c928da8fd4c1f90374b18aa9ac6ba', | ||
| }, | ||
| { | ||
| walletName: 'ledger', | ||
| preferred: true, | ||
| rpcUrl: 'https://rinkeby.infura.io/v3/b42c928da8fd4c1f90374b18aa9ac6ba', | ||
| }, | ||
| { walletName: 'trust', preferred: true }, | ||
| { walletName: 'dapper' }, | ||
| { | ||
| walletName: 'fortmatic', | ||
| apiKey: FORTMATIC_API_KEY, | ||
| }, | ||
| { | ||
| walletName: 'portis', | ||
| apiKey: PORTIS_DAPP_ID, | ||
| label: 'Login with Email', | ||
| }, | ||
| { walletName: 'authereum' }, | ||
| { walletName: 'coinbase' }, | ||
| { walletName: 'opera' }, | ||
| { walletName: 'operaTouch' }, | ||
| ] | ||
|
|
||
| let lastUsedAddress = '' | ||
| let providerName | ||
|
|
||
| export const onboard = new Onboard({ | ||
| dappId: BLOCKNATIVE_API_KEY, | ||
| networkId: getNetworkId(), | ||
| subscriptions: { | ||
| wallet: wallet => { | ||
| if (wallet.provider) { | ||
| // this function will intialize web3 and store it somewhere available throughout the dapp and | ||
| // can also instantiate your contracts with the web3 instance | ||
| setWeb3(wallet.provider) | ||
| providerName = wallet.name | ||
| } | ||
| }, | ||
| authereum: { | ||
| package: Authereum, | ||
| options: {}, | ||
| address: address => { | ||
| if (!lastUsedAddress && address) { | ||
| lastUsedAddress = address | ||
| store.dispatch(fetchProvider(providerName)) | ||
| } | ||
|
|
||
| // we don't have an unsubscribe event so we rely on this | ||
| if (!address && lastUsedAddress) { | ||
| lastUsedAddress = '' | ||
| providerName = undefined | ||
| } | ||
| }, | ||
| }, | ||
| walletSelect: { | ||
| wallets, | ||
| }, | ||
| walletCheck: [{ checkName: 'connect' }, transactionDataCheck(), { checkName: 'network' }, { checkName: 'accounts' }], | ||
| }) | ||
|
|
||
| web3Connect.on('connect', (provider: any) => { | ||
| if (provider) { | ||
| store.dispatch(fetchProvider(provider)) | ||
| } | ||
| }) | ||
|
|
||
| web3Connect.on('disconnect', () => { | ||
| store.dispatch(removeProvider()) | ||
| }) | ||
| export const onboardUser = async () => { | ||
| // before calling walletSelect you want to check if web3 has been instantiated | ||
| // which indicates that a wallet has already been selected | ||
| // and web3 has been instantiated with that provider | ||
| const web3 = getWeb3() | ||
| const walletSelected = web3 ? true : await onboard.walletSelect() | ||
| return walletSelected && onboard.walletCheck() | ||
| } | ||
|
|
||
| type Props = { | ||
| enqueueSnackbar: Function, | ||
|
|
@@ -74,8 +104,9 @@ const ConnectButton = (props: Props) => ( | |
| <Button | ||
| color="primary" | ||
| minWidth={140} | ||
| onClick={() => { | ||
| web3Connect.toggleModal() | ||
| onClick={async () => { | ||
| await onboard.walletSelect() | ||
| await onboard.walletCheck() | ||
| }} | ||
| variant="contained" | ||
| {...props} | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| /* Onboard.js custom styles */ | ||
|
|
||
| :global(.bn-onboard-custom.bn-onboard-modal) { | ||
| font-family: "Averta"; | ||
| z-index: 2001; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -42,4 +42,4 @@ body { | |
| body > div:first-child { | ||
| display: flex; | ||
| min-height: 100%; | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.