From fd7e367380549e14dc1a54552ec9226ece543649 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Mon, 20 Jun 2022 15:02:07 -0600 Subject: [PATCH 01/17] Update react package version --- packages/react/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/package.json b/packages/react/package.json index e5ca4fb03..570ecba0d 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@web3-onboard/react", - "version": "2.2.0-alpha.2", + "version": "2.2.0-alpha.3", "description": "Collection of React Hooks for web3-onboard", "module": "dist/index.js", "browser": "dist/index.js", From 084ffb2b51714d0f010b2c6b7238d4639382b1e4 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Wed, 22 Jun 2022 15:28:32 -0600 Subject: [PATCH 02/17] Progress --- packages/core/src/index.ts | 3 ++- packages/core/src/store/index.ts | 19 +++++++++++++++- packages/react/src/index.ts | 38 +++++++++++++++++++++++++++++--- 3 files changed, 55 insertions(+), 5 deletions(-) diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index bf9c0a384..09ef737be 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -34,7 +34,8 @@ const API = { setLocale, updateNotify, customNotification, - updateBalances + updateBalances, + updateAccountCenter } } } diff --git a/packages/core/src/store/index.ts b/packages/core/src/store/index.ts index bafe3c580..642d95b9a 100644 --- a/packages/core/src/store/index.ts +++ b/packages/core/src/store/index.ts @@ -36,6 +36,16 @@ import { UPDATE_ALL_WALLETS } from './constants' +import { + addChains, + setWalletModules, + updateAccountCenter, + updateNotify, + customNotification, + setLocale +} from '../store/actions' +import updateBalances from '../updateBalances' + function reducer(state: AppState, action: Action): AppState { const { type, payload } = action @@ -237,5 +247,12 @@ function get(): AppState { export const state = { select, - get + get, + actions: { + setLocale, + updateNotify, + customNotification, + updateBalances, + updateAccountCenter + } } diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 4df30491a..600e1735a 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -11,7 +11,13 @@ import type { ConnectedChain } from '@web3-onboard/core' import type { Chain } from '@web3-onboard/common' -import type { AppState } from '@web3-onboard/core/dist/types' +import type { + AppState, + CustomNotification, + Notification, + NotifyOptions, + UpdateNotification +} from '@web3-onboard/core/dist/types' export let web3Onboard: OnboardAPI | null = null @@ -52,7 +58,8 @@ const useAppState: { export const useConnectWallet = (): [ { wallet: WalletState | null; connecting: boolean }, (options?: ConnectOptions) => Promise, - (wallet: DisconnectOptions) => Promise + (wallet: DisconnectOptions) => Promise, + (addresses?: string[]) => Promise ] => { if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) @@ -79,7 +86,9 @@ export const useConnectWallet = (): [ setConnecting(false) }, []) - return [{ wallet, connecting }, connect, disconnect] + const updateBalances = web3Onboard.state.actions.updateBalances + + return [{ wallet, connecting }, connect, disconnect, updateBalances] } type SetChainOptions = { @@ -132,3 +141,26 @@ export const useWallets = (): WalletState[] => { return useAppState('wallets') } + +export const useNotifications = (): [ + Notification[], + (updatedNotification: CustomNotification) => { + dismiss: () => void + update: UpdateNotification + }, + (update: Partial) => void +] => { + if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) + + const handleCustomNotifications = web3Onboard.state.actions.customNotification + const updateNotify = web3Onboard.state.actions.updateNotify + + return [useAppState('notifications'), handleCustomNotifications, updateNotify] +} + + +export const useSetLocale = (): (locale: string) => void => { + if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) + + return web3Onboard.state.actions.setLocale +} From 252a01138ceefcc697108026e958c643acb0cb4c Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 10:06:52 -0600 Subject: [PATCH 03/17] New react hoooks for all actions exposed through api + updateAccountCenter, Update OnboardAPI type --- packages/core/package.json | 2 +- packages/core/src/store/index.ts | 19 +------------------ packages/core/src/types.ts | 23 ++++++++++++++++++++++- packages/react/package.json | 4 ++-- packages/react/src/index.ts | 28 ++++++++++++++++++++++------ 5 files changed, 48 insertions(+), 28 deletions(-) diff --git a/packages/core/package.json b/packages/core/package.json index f2d138f5f..863160ac0 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@web3-onboard/core", - "version": "2.3.0", + "version": "2.3.1-alpha.1", "scripts": { "build": "rollup -c", "dev": "rollup -c -w", diff --git a/packages/core/src/store/index.ts b/packages/core/src/store/index.ts index 642d95b9a..bafe3c580 100644 --- a/packages/core/src/store/index.ts +++ b/packages/core/src/store/index.ts @@ -36,16 +36,6 @@ import { UPDATE_ALL_WALLETS } from './constants' -import { - addChains, - setWalletModules, - updateAccountCenter, - updateNotify, - customNotification, - setLocale -} from '../store/actions' -import updateBalances from '../updateBalances' - function reducer(state: AppState, action: Action): AppState { const { type, payload } = action @@ -247,12 +237,5 @@ function get(): AppState { export const state = { select, - get, - actions: { - setLocale, - updateNotify, - customNotification, - updateBalances, - updateAccountCenter - } + get } diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 8a883db33..46ab2f973 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -53,8 +53,29 @@ export interface OnboardAPI { connectWallet: typeof connect disconnectWallet: typeof disconnect setChain: typeof setChain - state: typeof state + state: { + select: typeof state.select + get: typeof state.get + actions: ExposedActions + } } + +interface ExposedActions { + setWalletModules: (wallets: WalletInit[]) => void + setLocale: (locale: string) => void + updateNotify: (update: Partial) => void + customNotification: ( + updatedNotification: CustomNotification + ) => { + dismiss: () => void + update: UpdateNotification + } + updateBalances: (addresses?: string[]) => Promise + updateAccountCenter: ( + update: AccountCenter | Partial + ) => void +} + export interface ConnectOptions { autoSelect?: { label: string; disableModals: boolean } } diff --git a/packages/react/package.json b/packages/react/package.json index 12cf2b91b..005bba72f 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@web3-onboard/react", - "version": "2.2.0", + "version": "2.2.1-alpha.1", "description": "Collection of React Hooks for web3-onboard", "module": "dist/index.js", "browser": "dist/index.js", @@ -23,7 +23,7 @@ "typescript": "^4.5.5" }, "dependencies": { - "@web3-onboard/core": "^2.3.0", + "@web3-onboard/core": "^2.3.1-alpha.1", "@web3-onboard/common": "^2.1.2", "use-sync-external-store": "1.0.0" }, diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 600e1735a..38f3cc457 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -10,8 +10,9 @@ import type { WalletState, ConnectedChain } from '@web3-onboard/core' -import type { Chain } from '@web3-onboard/common' +import type { Chain, WalletInit } from '@web3-onboard/common' import type { + AccountCenter, AppState, CustomNotification, Notification, @@ -59,7 +60,8 @@ export const useConnectWallet = (): [ { wallet: WalletState | null; connecting: boolean }, (options?: ConnectOptions) => Promise, (wallet: DisconnectOptions) => Promise, - (addresses?: string[]) => Promise + (addresses?: string[]) => Promise, + (wallets: WalletInit[]) => void ] => { if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) @@ -87,8 +89,15 @@ export const useConnectWallet = (): [ }, []) const updateBalances = web3Onboard.state.actions.updateBalances - - return [{ wallet, connecting }, connect, disconnect, updateBalances] + const setWalletModules = web3Onboard.state.actions.setWalletModules + + return [ + { wallet, connecting }, + connect, + disconnect, + updateBalances, + setWalletModules + ] } type SetChainOptions = { @@ -158,9 +167,16 @@ export const useNotifications = (): [ return [useAppState('notifications'), handleCustomNotifications, updateNotify] } - -export const useSetLocale = (): (locale: string) => void => { +export const useSetLocale = (): ((locale: string) => void) => { if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) return web3Onboard.state.actions.setLocale } + +export const useAccountCenter = (): (( + update: AccountCenter | Partial +) => void) => { + if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) + + return web3Onboard.state.actions.updateAccountCenter +} From a62acc353eeaded7c3ff654c0182f088e9d62cae Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 10:07:39 -0600 Subject: [PATCH 04/17] Update core version where needed --- packages/demo/package.json | 2 +- packages/vue/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/demo/package.json b/packages/demo/package.json index 32d5d5ff3..018b00da5 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -23,7 +23,7 @@ }, "dependencies": { "@web3-onboard/coinbase": "^2.0.5", - "@web3-onboard/core": "^2.3.0", + "@web3-onboard/core": "^2.3.1-alpha.1", "@web3-onboard/dcent": "^2.0.2", "@web3-onboard/fortmatic": "^2.0.4", "@web3-onboard/gnosis": "^2.0.3", diff --git a/packages/vue/package.json b/packages/vue/package.json index 25052d1f2..3d57ad18b 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -24,7 +24,7 @@ "@vueuse/core": "^8.4.2", "@vueuse/rxjs": "^8.2.0", "@web3-onboard/common": "^2.1.2", - "@web3-onboard/core": "^2.3.0", + "@web3-onboard/core": "^2.3.1-alpha.1", "vue-demi": "^0.12.4" }, "peerDependencies": { From 10c056ab6f1ecf7abd9450a542adb8d8e2ae102f Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 10:43:06 -0600 Subject: [PATCH 05/17] Update README for react hooks --- packages/react/README.md | 205 ++++++++++++++++++++++++++++++++++++++- 1 file changed, 201 insertions(+), 4 deletions(-) diff --git a/packages/react/README.md b/packages/react/README.md index 11b9edefe..382e50e88 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -10,6 +10,7 @@ A collection of React hooks for implementing web3-onboard in to a React project ```javascript import React from 'react' +import { ethers } from 'ethers' import { init, useConnectWallet, @@ -27,6 +28,9 @@ import torusModule from '@web3-onboard/torus' import keepkeyModule from '@web3-onboard/keepkey' import dcentModule from '@web3-onboard/dcent' +// Sign up to get your free API key at https://www.blocknative.com/pricing +const dappId = '1730eff0-9d50-4382-a3fe-89f0d34a2070' + const injected = injectedModule() const coinbase = coinbaseModule() const walletConnect = walletConnectModule() @@ -52,6 +56,18 @@ const trezor = trezorModule(trezorOptions) const dcent = dcentModule() +const magic = magicModule({ + // Example api key, may need to be updated when max hits reached + // Get one to test with for free from https://magic.link/ + apiKey: 'pk_live_02207D744E81C2BA', + userEmail: localStorage.getItem('magicUserEmail') +}) + +const web3auth = web3authModule({ + clientId: + 'DJuUOKvmNnlzy6ruVgeWYWIMKLRyYtjYa9Y10VCeJzWZcygDlrYLyXsBQjpJ2hxlBO9dnl8t9GmAC2qOP5vnIGo' +}) + const web3Onboard = init({ wallets: [ injected, @@ -60,7 +76,8 @@ const web3Onboard = init({ trezor, walletConnect, keepkey, - fortmatic, + web3auth, + magic, portis, torus, dcent @@ -119,6 +136,23 @@ const web3Onboard = init({ minimal: true } }, + apiKey: dappId, + notify: { + enabled: true, + transactionHandler: transaction => { + console.log({ transaction }) + if (transaction.eventCode === 'txPool') { + return { + // autoDismiss set to zero will persist the notification until the user excuses it + autoDismiss: 0, + // message: `Your transaction is pending, click here for more info.`, + // or you could use onClick for when someone clicks on the notification itself + onClick: () => + window.open(`https://rinkeby.etherscan.io/tx/${transaction.hash}`) + } + } + } + } i18n: { en: { connect: { @@ -141,9 +175,23 @@ const web3Onboard = init({ }) function App() { - const [{ wallet, connecting }, connect, disconnect] = useConnectWallet() + const [{ wallet, connecting }, connect, disconnect, updateBalances, setWalletModules] = + useConnectWallet() const [{ chains, connectedChain, settingChain }, setChain] = useSetChain() + const [notifications, handleCustomNotifications, updateNotify] = useNotifications() const connectedWallets = useWallets() + const updateAccountCenter = useAccountCenter() + const updateLocale = useSetLocale() + + let provider + + useEffect(() => { + if (!wallet?.provider) { + provider = null + } else { + provider = new ethers.providers.Web3Provider(wallet.provider, 'any') + } + }, [wallet] return (
@@ -200,7 +248,9 @@ import { useConnectWallet } from '@web3-onboard/react' type UseConnectWallet = (): [ { wallet: WalletState | null; connecting: boolean }, (options: ConnectOptions) => Promise, - (wallet: DisconnectOptions) => Promise + (wallet: DisconnectOptions) => Promise, + (addresses?: string[]) => Promise, + (wallets: WalletInit[]) => void ] type ConnectOptions = { @@ -220,13 +270,17 @@ type WalletState = { instance?: unknown } +type WalletInit = (helpers: WalletHelpers) => WalletModule | WalletModule[] | null; + const [ { wallet, // the wallet that has been connected or null if not yet connected connecting // boolean indicating if connection is in progress }, connect, // function to call to initiate user to connect wallet - disconnect // function to call to with wallet to disconnect wallet + disconnect, // function to call to with wallet to disconnect wallet + updateBalances, // function to be called with an option array of wallet addresses connected through Onboard to update balance or empty/no params to update all connected wallets + setWalletModules // function to be called with an array of wallet modules to conditional allow connection of wallet types i.e. setWalletModules([ledger, trezor, injected]) ] = useConnectWallet() ``` @@ -264,6 +318,108 @@ const [ ] = useSetChain() ``` +## `useNotifications` + +This hook allows the dev to access all notifications if enabled, send custom notifications and update notify >enable/disable and change transactionHandler function< +**note** requires an API key be added to the initialization, enabled by default if API key exists + +```typescript +import { useNotifications } from '@web3-onboard/react' + +type UseNotifications = (): [ + Notification[], + (updatedNotification: CustomNotification) => { + dismiss: () => void + update: UpdateNotification + }, + (update: Partial) => void +] + +type Notification = { + id: string + key: string + type: NotificationType + network: Network + startTime?: number + eventCode: string + message: string + autoDismiss: number + link?: string + onClick?: (event: Event) => void +} +type TransactionHandlerReturn = + | CustomNotification + | boolean + | void +type CustomNotification = Partial< + Omit +> +type CustomNotificationUpdate = Partial< + Omit +> +type NotificationType = 'pending' | 'success' | 'error' | 'hint' +interface UpdateNotification { + (notificationObject: CustomNotification): { + dismiss: () => void + update: UpdateNotification + } +} +type NotifyOptions = { + /** + * Defines whether whether to subscribe to transaction events or not + * default: true + */ + enabled: boolean + /** + * Callback that receives all transaction events + * Return a custom notification based on the event + * Or return false to disable notification for this event + * Or return undefined for a default notification + */ + transactionHandler: ( + event: EthereumTransactionData + ) => TransactionHandlerReturn + +const [ + notifications, // the list of all notifications that updates when notifications are added, updated or removed + handleCustomNotifications, // a function that takes a customNotification object and allows custom notifications to be shown to the user, returns an update and dismiss callback + updateNotify // a function that takes a NotifyOptions object to allow updating of the properties +] = useNotifications() + +// View notifications as they come in if you would like to handle them independent of the notification display +useEffect(() => { + console.log(notifications) +}, [notifications]) + +// Custom notification example + +``` + ## `useWallets` This hook allows you to track the state of all the currently connected wallets. @@ -275,3 +431,44 @@ type UseWallets = (): WalletState[] const connectedWallets = useWallets() ``` + +## `useAccountCenter` + +This hook allows you to track and update the state of the AccountCenter + +```typescript +import { useAccountCenter } from '@web3-onboard/react' + +type UseAccountCenter = (): (( + update: AccountCenter | Partial +) => void) + +type AccountCenterPosition = + | 'topRight' + | 'bottomRight' + | 'bottomLeft' + | 'topLeft' + +type AccountCenter = { + enabled: boolean + position?: AccountCenterPosition + expanded?: boolean + minimal?: boolean +} + +const updateAccountCenter = useAccountCenter() +``` + +## `useSetLocale` + +This hook allows you to set the locale of your application to allow language updates associated with the i18n config + +```typescript +import { useSetLocale } from '@web3-onboard/react' + +type useSetLocale = (): ((locale: string) => void) + +const updateLocale = useSetLocale() + +updateLocale('es') +``` From 377bb464baad1c411f1c62499a2e780b648a5a5a Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 10:56:22 -0600 Subject: [PATCH 06/17] Rename for better alignment with core docs --- packages/react/README.md | 6 +++--- packages/react/src/index.ts | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/react/README.md b/packages/react/README.md index 382e50e88..d35025add 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -178,7 +178,7 @@ function App() { const [{ wallet, connecting }, connect, disconnect, updateBalances, setWalletModules] = useConnectWallet() const [{ chains, connectedChain, settingChain }, setChain] = useSetChain() - const [notifications, handleCustomNotifications, updateNotify] = useNotifications() + const [notifications, customNotification, updateNotify] = useNotifications() const connectedWallets = useWallets() const updateAccountCenter = useAccountCenter() const updateLocale = useSetLocale() @@ -382,7 +382,7 @@ type NotifyOptions = { const [ notifications, // the list of all notifications that updates when notifications are added, updated or removed - handleCustomNotifications, // a function that takes a customNotification object and allows custom notifications to be shown to the user, returns an update and dismiss callback + customNotification, // a function that takes a customNotification object and allows custom notifications to be shown to the user, returns an update and dismiss callback updateNotify // a function that takes a NotifyOptions object to allow updating of the properties ] = useNotifications() @@ -396,7 +396,7 @@ useEffect(() => { className="bn-demo-button" onClick={() => { const { update } = - handleCustomNotifications({ + customNotification({ eventCode: 'dbUpdate', type: 'hint', message: 'Custom hint notification created by the dapp', diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 38f3cc457..621de07f3 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -161,10 +161,10 @@ export const useNotifications = (): [ ] => { if (!web3Onboard) throw new Error(HOOK_ERROR_MESSAGE) - const handleCustomNotifications = web3Onboard.state.actions.customNotification + const customNotification = web3Onboard.state.actions.customNotification const updateNotify = web3Onboard.state.actions.updateNotify - return [useAppState('notifications'), handleCustomNotifications, updateNotify] + return [useAppState('notifications'), customNotification, updateNotify] } export const useSetLocale = (): ((locale: string) => void) => { From 88db4e25210306a63f91ada4be2363ef69be691c Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:18:19 -0600 Subject: [PATCH 07/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index d35025add..ef7a009a0 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -143,7 +143,7 @@ const web3Onboard = init({ console.log({ transaction }) if (transaction.eventCode === 'txPool') { return { - // autoDismiss set to zero will persist the notification until the user excuses it + // autoDismiss set to `0` will persist the notification until the user excuses it autoDismiss: 0, // message: `Your transaction is pending, click here for more info.`, // or you could use onClick for when someone clicks on the notification itself From 67caa763d95def76069bdeb8c0b082c82db44c67 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:18:26 -0600 Subject: [PATCH 08/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index ef7a009a0..7931a39f0 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -145,7 +145,7 @@ const web3Onboard = init({ return { // autoDismiss set to `0` will persist the notification until the user excuses it autoDismiss: 0, - // message: `Your transaction is pending, click here for more info.`, + // message: `Your transaction is pending, click here for more info.`, // or you could use onClick for when someone clicks on the notification itself onClick: () => window.open(`https://rinkeby.etherscan.io/tx/${transaction.hash}`) From 71daea58a394e5ced3bf2382903e4310d06280ee Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:18:36 -0600 Subject: [PATCH 09/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 7931a39f0..d90bf1b0f 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -278,7 +278,7 @@ const [ connecting // boolean indicating if connection is in progress }, connect, // function to call to initiate user to connect wallet - disconnect, // function to call to with wallet to disconnect wallet + disconnect, // function to call with wallet to disconnect wallet updateBalances, // function to be called with an option array of wallet addresses connected through Onboard to update balance or empty/no params to update all connected wallets setWalletModules // function to be called with an array of wallet modules to conditional allow connection of wallet types i.e. setWalletModules([ledger, trezor, injected]) ] = useConnectWallet() From 04272554b634a2ce3ee183f37f3d065582e9c949 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:18:41 -0600 Subject: [PATCH 10/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index d90bf1b0f..78db225b1 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -280,7 +280,7 @@ const [ connect, // function to call to initiate user to connect wallet disconnect, // function to call with wallet to disconnect wallet updateBalances, // function to be called with an option array of wallet addresses connected through Onboard to update balance or empty/no params to update all connected wallets - setWalletModules // function to be called with an array of wallet modules to conditional allow connection of wallet types i.e. setWalletModules([ledger, trezor, injected]) + setWalletModules // function to be called with an array of wallet modules to conditionally allow connection of wallet types i.e. setWalletModules([ledger, trezor, injected]) ] = useConnectWallet() ``` From bd04f40d262f84f1548eb7619f1c7c7aefffad4d Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:19:06 -0600 Subject: [PATCH 11/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 78db225b1..c0befd736 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -366,7 +366,7 @@ interface UpdateNotification { } type NotifyOptions = { /** - * Defines whether whether to subscribe to transaction events or not + * Defines whether to subscribe to transaction events or not * default: true */ enabled: boolean From ff48a0f46728c4dca67dd8da38cdce30212d65c2 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:19:33 -0600 Subject: [PATCH 12/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index c0befd736..12d38fc8e 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -381,7 +381,7 @@ type NotifyOptions = { ) => TransactionHandlerReturn const [ - notifications, // the list of all notifications that updates when notifications are added, updated or removed + notifications, // the list of all notifications that update when notifications are added, updated or removed customNotification, // a function that takes a customNotification object and allows custom notifications to be shown to the user, returns an update and dismiss callback updateNotify // a function that takes a NotifyOptions object to allow updating of the properties ] = useNotifications() From b9bbc40e988c1f2502647e43eb90e6759b65ccc7 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:21:56 -0600 Subject: [PATCH 13/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 12d38fc8e..8a13b4509 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -369,7 +369,7 @@ type NotifyOptions = { * Defines whether to subscribe to transaction events or not * default: true */ - enabled: boolean + enabled?: boolean /** * Callback that receives all transaction events * Return a custom notification based on the event From f06435330f520c4f558d90089f697ef04357acf9 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 11:24:25 -0600 Subject: [PATCH 14/17] Update export from core/import in react package, update docs --- packages/core/src/index.ts | 8 +++++++- packages/react/README.md | 2 +- packages/react/src/index.ts | 8 +++----- 3 files changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 09ef737be..100433ff0 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -46,7 +46,13 @@ export type { ConnectOptions, DisconnectOptions, WalletState, - ConnectedChain + ConnectedChain, + AccountCenter, + AppState, + CustomNotification, + Notification, + NotifyOptions, + UpdateNotification } from './types' export type { EIP1193Provider } from '@web3-onboard/common' diff --git a/packages/react/README.md b/packages/react/README.md index d35025add..aae66c7d5 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -320,7 +320,7 @@ const [ ## `useNotifications` -This hook allows the dev to access all notifications if enabled, send custom notifications and update notify >enable/disable and change transactionHandler function< +This hook allows the dev to access all notifications if enabled, send custom notifications and update notify **note** requires an API key be added to the initialization, enabled by default if API key exists ```typescript diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 621de07f3..219a21d57 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -8,17 +8,15 @@ import type { ConnectOptions, DisconnectOptions, WalletState, - ConnectedChain -} from '@web3-onboard/core' -import type { Chain, WalletInit } from '@web3-onboard/common' -import type { + ConnectedChain, AccountCenter, AppState, CustomNotification, Notification, NotifyOptions, UpdateNotification -} from '@web3-onboard/core/dist/types' +} from '@web3-onboard/core' +import type { Chain, WalletInit } from '@web3-onboard/common' export let web3Onboard: OnboardAPI | null = null From d0f3664fe73fe8aa6c665e065045f0eb7794cc32 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 12:23:25 -0600 Subject: [PATCH 15/17] Update signup link --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 5a2d40fe2..1239b08b6 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -28,7 +28,7 @@ import torusModule from '@web3-onboard/torus' import keepkeyModule from '@web3-onboard/keepkey' import dcentModule from '@web3-onboard/dcent' -// Sign up to get your free API key at https://www.blocknative.com/pricing +// Sign up to get your free API key at https://explorer.blocknative.com/?signup=true const dappId = '1730eff0-9d50-4382-a3fe-89f0d34a2070' const injected = injectedModule() From 96424826e35baa526d359df0bd8c67e8547d6c53 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 13:26:34 -0600 Subject: [PATCH 16/17] Update packages/react/README.md Co-authored-by: Taylor Dawson --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 1239b08b6..b3eb97843 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -279,7 +279,7 @@ const [ }, connect, // function to call to initiate user to connect wallet disconnect, // function to call with wallet to disconnect wallet - updateBalances, // function to be called with an option array of wallet addresses connected through Onboard to update balance or empty/no params to update all connected wallets + updateBalances, // function to be called with an optional array of wallet addresses connected through Onboard to update balance or empty/no params to update all connected wallets setWalletModules // function to be called with an array of wallet modules to conditionally allow connection of wallet types i.e. setWalletModules([ledger, trezor, injected]) ] = useConnectWallet() ``` From 0ca3a56571b1426d76a2050c37d4eff305f0fb0f Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Thu, 23 Jun 2022 14:38:12 -0600 Subject: [PATCH 17/17] Position AC docs --- packages/react/README.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/packages/react/README.md b/packages/react/README.md index b3eb97843..a376afe8e 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -217,6 +217,19 @@ function App() { )}
+ )} {connectedWallets.map(({ label, accounts }) => {