diff --git a/docs/package.json b/docs/package.json index c87cf783e..e1b2f7764 100644 --- a/docs/package.json +++ b/docs/package.json @@ -55,7 +55,7 @@ "@web3-onboard/blocto": "^2.0.0", "@web3-onboard/cede-store": "^2.1.0", "@web3-onboard/coinbase": "^2.2.5", - "@web3-onboard/core": "^2.21.0", + "@web3-onboard/core": "^2.21.1", "@web3-onboard/dcent": "^2.2.7", "@web3-onboard/enkrypt": "^2.0.4", "@web3-onboard/fortmatic": "^2.0.19", @@ -64,7 +64,7 @@ "@web3-onboard/gas": "^2.1.8", "@web3-onboard/gnosis": "^2.1.10", "@web3-onboard/infinity-wallet": "^2.0.4", - "@web3-onboard/injected-wallets": "^2.10.2", + "@web3-onboard/injected-wallets": "^2.10.6", "@web3-onboard/keepkey": "^2.3.7", "@web3-onboard/keystone": "^2.3.7", "@web3-onboard/ledger": "^2.5.1", diff --git a/docs/src/routes/docs/[...3]modules/[...1]core/+page.md b/docs/src/routes/docs/[...3]modules/[...1]core/+page.md index 9de1946b5..392b0266a 100644 --- a/docs/src/routes/docs/[...3]modules/[...1]core/+page.md +++ b/docs/src/routes/docs/[...3]modules/[...1]core/+page.md @@ -156,7 +156,7 @@ type Chain = { namespace?: 'evm' // string indicating chain namespace. Defaults to 'evm' but will allow other chain namespaces in the future // PLEASE NOTE: Some wallets require an rpcUrl, label, and token for actions such as adding a new chain. // It is recommended to include rpcUrl, label, and token for full functionality. - rpcUrl?: string // Recommended to include. Used for network requests. + rpcUrl?: string // Recommended to include. Used for network requests (eg Alchemy or Infura end point). label?: string // Recommended to include. Used for display, eg Ethereum Mainnet. token?: TokenSymbol // Recommended to include. The native token symbol, eg ETH, BNB, MATIC. color?: string // the color used to represent the chain and will be used as a background for the icon @@ -164,6 +164,7 @@ type Chain = { publicRpcUrl?: string // an optional public RPC used when adding a new chain config to the wallet blockExplorerUrl?: string // also used when adding a new config to the wallet secondaryTokens?: SecondaryTokens[] // An optional array of tokens (max of 5) to be available to the dapp in the app state object per wallet within the wallet account and displayed in Account Center (if enabled) + protectedRpcUrl?: string //An optional protected RPC URL - Defaults to Blocknative's private RPC aggregator to allow users to update the chain RPC within their wallet, specifically for private RPCs that protect user transactions. More information can be found at `https://docs.blocknative.com/blocknative-mev-protection/transaction-boost` } interface SecondaryTokens { @@ -415,6 +416,13 @@ type AccountCenter = { * Can be set as a global for Account Center or per interface (desktop/mobile) */ hideTransactionProtectionBtn?: boolean + /** + * defaults to + * `docs.blocknative.com/blocknative-mev-protection/transaction-boost-alpha` + * Use this property to override the default link to give users + * more information about transaction protection and the RPC be set + */ + transactionProtectionInfoLink?: string /** * @deprecated Use top level containerElements property * with the accountCenter prop set to the desired container El. See documentation below diff --git a/docs/src/routes/docs/[...4]wallets/[...11]injected/+page.md b/docs/src/routes/docs/[...4]wallets/[...11]injected/+page.md index 48db47d3a..775f248a6 100644 --- a/docs/src/routes/docs/[...4]wallets/[...11]injected/+page.md +++ b/docs/src/routes/docs/[...4]wallets/[...11]injected/+page.md @@ -299,7 +299,7 @@ const injected = injectedModule({ - Trust - _Desktop & Mobile_ - SafePal - _Desktop & Mobile_ - Zerion - _Desktop & Mobile_ -- OKX Wallet - _Desktop_ +- OKX Wallet - _Desktop & Mobile_ - Taho (Previously named Tally Ho wallet) - _Desktop_ - Opera - _Desktop & Mobile_ - Status - _Mobile_ @@ -345,6 +345,7 @@ const injected = injectedModule({ - Ronin Wallet - _Desktop & Mobile_ - Coin98 Wallet - _Desktop & Mobile_ - SubWallet - _Desktop & Mobile_ +- Kayros - _Desktop_ ## Build Environments diff --git a/docs/src/routes/examples/[...1]connect-wallet/+page.md b/docs/src/routes/examples/[...1]connect-wallet/+page.md index b713e7ad6..4185ad0b8 100644 --- a/docs/src/routes/examples/[...1]connect-wallet/+page.md +++ b/docs/src/routes/examples/[...1]connect-wallet/+page.md @@ -171,7 +171,7 @@ const appMetadata = { const web3Onboard = init({ wallets, - chains + chains, appMetadata }) diff --git a/package.json b/package.json index 092826487..39344d886 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "web3-onboard-monorepo", - "version": "2.24.9", + "version": "2.24.10", "private": true, "workspaces": { "packages": [ diff --git a/packages/core/README.md b/packages/core/README.md index ee5e30996..8e5b19f69 100644 --- a/packages/core/README.md +++ b/packages/core/README.md @@ -148,6 +148,7 @@ type Chain = { publicRpcUrl?: string // an optional public RPC used when adding a new chain config to the wallet blockExplorerUrl?: string // also used when adding a new config to the wallet secondaryTokens?: SecondaryTokens[] // An optional array of tokens (max of 5) to be available to the dapp in the app state object per wallet within the wallet account and displayed in Account Center (if enabled) + protectedRpcUrl?: string //An optional protected RPC URL - Defaults to Blocknative's private RPC aggregator to allow users to update the chain RPC within their wallet, specifically for private RPCs that protect user transactions. More information can be found at `https://docs.blocknative.com/blocknative-mev-protection/transaction-boost` } interface SecondaryTokens { /** @@ -363,6 +364,16 @@ type AccountCenter = { position?: AccountCenterPosition // default: 'bottomRight' expanded?: boolean // default: true minimal?: boolean // enabled by default for mobile + /** + * Controls the visibility of the 'Enable Transaction Protection' button within the expanded Account Center. + * - When set to false (default), the button is visible. + * - When set to true, the button is hidden. + * This setting can be configured globally for the Account Center, or separately for different interfaces like desktop/mobile. + * defaults to `docs.blocknative.com/blocknative-mev-protection/transaction-boost-alpha` + * Use this property to override the default link to give users + * more information about transaction protection and the RPC be set + */ + transactionProtectionInfoLink?: string /** * @deprecated Use top level containerElements property @@ -381,6 +392,16 @@ type AccountCenterOptions = { * Can be set as a global for Account Center or per interface (desktop/mobile) */ hideTransactionProtectionBtn?: boolean + /** + * Controls the visibility of the 'Enable Transaction Protection' button within the expanded Account Center. + * - When set to false (default), the button is visible. + * - When set to true, the button is hidden. + * This setting can be configured globally for the Account Center, or separately for different interfaces like desktop/mobile. + * defaults to `docs.blocknative.com/blocknative-mev-protection/transaction-boost-alpha` + * Use this property to override the default link to give users + * more information about transaction protection and the RPC be set + */ + transactionProtectionInfoLink?: string } type AccountCenterPosition = diff --git a/packages/core/package.json b/packages/core/package.json index 3237e2e34..409b428b4 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@web3-onboard/core", - "version": "2.21.0", + "version": "2.21.1", "description": "Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized 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.", "keywords": [ "Ethereum", diff --git a/packages/core/src/constants.ts b/packages/core/src/constants.ts index e4a0e7989..09c3f5631 100644 --- a/packages/core/src/constants.ts +++ b/packages/core/src/constants.ts @@ -37,4 +37,5 @@ export const STORAGE_KEYS = { export const MOBILE_WINDOW_WIDTH = 768 -export const BN_PROTECT_RPC_URL = 'https://rpc.blocknative.com/protect' +export const BN_BOOST_RPC_URL = 'https://rpc.blocknative.com/boost' +export const BN_BOOST_INFO_URL = 'https://docs.blocknative.com/blocknative-mev-protection/transaction-boost' diff --git a/packages/core/src/i18n/en.json b/packages/core/src/i18n/en.json index a36ccf079..d5d2d7658 100644 --- a/packages/core/src/i18n/en.json +++ b/packages/core/src/i18n/en.json @@ -62,7 +62,8 @@ }, "confirmTransactionProtection": { "heading": "Enable Transaction Protection", - "description": "Protect RPC Endpoints hide your transactions from front-running and sandwich bots to reduce unfavorable transaction settlement from slippage.", + "description": "Protect RPC endpoints hide your transaction from front-running and sandwich bots.", + "link": "Learn more", "enable": "Enable", "dismiss": "Dismiss" } diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 8f14541b8..f125cd856 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -127,18 +127,21 @@ function init(options: InitOptions): OnboardAPI { // update accountCenter if (typeof accountCenter !== 'undefined') { let accountCenterUpdate - const { hideTransactionProtectionBtn } = accountCenter + const { hideTransactionProtectionBtn, transactionProtectionInfoLink } = + accountCenter if (device.type === 'mobile') { accountCenterUpdate = { ...APP_INITIAL_STATE.accountCenter, hideTransactionProtectionBtn, + transactionProtectionInfoLink, ...(accountCenter.mobile ? accountCenter.mobile : {}) } } else if (accountCenter.desktop) { accountCenterUpdate = { ...APP_INITIAL_STATE.accountCenter, hideTransactionProtectionBtn, + transactionProtectionInfoLink, ...accountCenter.desktop } } diff --git a/packages/core/src/provider.ts b/packages/core/src/provider.ts index 154c5f070..3d45f9985 100644 --- a/packages/core/src/provider.ts +++ b/packages/core/src/provider.ts @@ -211,11 +211,15 @@ export function trackWallet( ) const account = accounts.find(account => account.address === address) + const ensChain = chains.find( + ({ id }) => id === validEnsChain(connectedWalletChain.id) + ) + const ensProm = account && account.ens ? Promise.resolve(account.ens) - : validEnsChain(connectedWalletChain.id) - ? getEns(address, chain) + : ensChain + ? getEns(address, ensChain) : Promise.resolve(null) const unsProm = @@ -320,13 +324,16 @@ export function trackWallet( address, chain ) + const ensChain = chains.find( + ({ id }) => id === validEnsChain(chainId) + ) - const ensProm = validEnsChain(chainId) - ? getEns(address, chain) + const ensProm = ensChain + ? getEns(address, ensChain) : Promise.resolve(null) const unsProm = validEnsChain(chainId) - ? getUns(address, chain) + ? getUns(address, ensChain) : Promise.resolve(null) const [balance, ens, uns, secondaryTokens] = await Promise.all([ diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 533d6ad5a..bdeb047ae 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -249,7 +249,7 @@ export type ConnectModalOptions = { */ removeWhereIsMyWalletWarning?: boolean /** - * Hide the "I don't have a wallet" link displayed + * Hide the "I don't have a wallet" link displayed * on the left panel of the connect modal */ removeIDontHaveAWalletInfoLink?: boolean @@ -281,6 +281,19 @@ export type AccountCenter = { * Can be set as a global for Account Center or per interface (desktop/mobile) */ hideTransactionProtectionBtn?: boolean + /** + * Controls the visibility of the 'Enable Transaction Protection' button + * within the expanded Account Center. + * - When set to false (default), the button is visible. + * - When set to true, the button is hidden. + * This setting can be configured globally for the Account Center, or + * separately for different interfaces like desktop/mobile. + * defaults to + * `docs.blocknative.com/blocknative-mev-protection/transaction-boost-alpha` + * Use this property to override the default link to give users + * more information about transaction protection and the RPC be set + */ + transactionProtectionInfoLink?: string position?: AccountCenterPosition expanded?: boolean minimal?: boolean @@ -294,6 +307,19 @@ export type AccountCenter = { export type AccountCenterOptions = { desktop: Omit mobile: Omit + /** + * Controls the visibility of the 'Enable Transaction Protection' button + * within the expanded Account Center. + * - When set to false (default), the button is visible. + * - When set to true, the button is hidden. + * This setting can be configured globally for the Account Center, or + * separately for different interfaces like desktop/mobile. + * defaults to + * `docs.blocknative.com/blocknative-mev-protection/transaction-boost-alpha` + * Use this property to override the default link to give users + * more information about transaction protection and the RPC be set + */ + transactionProtectionInfoLink?: string /** * false by default - This allows removal of the * Enable Transaction Protection' button within the Account Center diff --git a/packages/core/src/utils.ts b/packages/core/src/utils.ts index a6a696c9f..d9fde48e2 100644 --- a/packages/core/src/utils.ts +++ b/packages/core/src/utils.ts @@ -62,15 +62,21 @@ export function getDevice(): Device | DeviceNotBrowser { export const notNullish = (value: T | null | undefined): value is T => value != null -export function validEnsChain(chainId: ChainId): boolean { +export function validEnsChain(chainId: ChainId): ChainId | null { + // return L2s as Eth for ens resolution switch (chainId) { case '0x1': - case '0x3': - case '0x4': - case '0x5': - return true + case '0x89': // Polygon + case '0xa': //Optimism + case '0xa4b1': // Arb + case '0x144': // zksync + return '0x1' + case '0x5': // Goerli + return chainId + case '0xaa36a7': // Sepolia + return chainId default: - return false + return null } } diff --git a/packages/core/src/validation.ts b/packages/core/src/validation.ts index f60456501..d1b39cd2c 100644 --- a/packages/core/src/validation.ts +++ b/packages/core/src/validation.ts @@ -183,7 +183,8 @@ const accountCenterInitOptions = Joi.object({ position: commonPositions, minimal: Joi.boolean(), containerElement: Joi.string(), - hideTransactionProtectionBtn: Joi.boolean() + hideTransactionProtectionBtn: Joi.boolean(), + transactionProtectionInfoLink: Joi.string() }) const accountCenter = Joi.object({ @@ -192,6 +193,7 @@ const accountCenter = Joi.object({ expanded: Joi.boolean(), minimal: Joi.boolean(), hideTransactionProtectionBtn: Joi.boolean(), + transactionProtectionInfoLink: Joi.string(), containerElement: Joi.string() }) @@ -235,7 +237,8 @@ const initOptions = Joi.object({ accountCenter: Joi.object({ desktop: accountCenterInitOptions, mobile: accountCenterInitOptions, - hideTransactionProtectionBtn: Joi.boolean() + hideTransactionProtectionBtn: Joi.boolean(), + transactionProtectionInfoLink: Joi.string() }), notify: [notifyOptions, notify], gas: Joi.object({ @@ -255,14 +258,13 @@ const initOptions = Joi.object({ }) const connectOptions = Joi.object({ - autoSelect: Joi.alternatives() - .try( - Joi.object({ - label: Joi.string().required(), - disableModals: Joi.boolean() - }), - Joi.string() - ) + autoSelect: Joi.alternatives().try( + Joi.object({ + label: Joi.string().required(), + disableModals: Joi.boolean() + }), + Joi.string() + ) }) const disconnectOptions = Joi.object({ diff --git a/packages/core/src/views/account-center/AccountCenterPanel.svelte b/packages/core/src/views/account-center/AccountCenterPanel.svelte index 1d60454ed..1342cb45d 100644 --- a/packages/core/src/views/account-center/AccountCenterPanel.svelte +++ b/packages/core/src/views/account-center/AccountCenterPanel.svelte @@ -2,6 +2,8 @@ import { _ } from 'svelte-i18n' import { fly } from 'svelte/transition' import { quartOut } from 'svelte/easing' + import { shareReplay, startWith } from 'rxjs' + import { wallets$ } from '../../streams.js' import en from '../../i18n/en.json' import WalletRow from './WalletRow.svelte' @@ -22,12 +24,11 @@ import shieldIcon from '../../icons/shield-icon.js' import { poweredByBlocknative } from '../../icons/index.js' import DisconnectAllConfirm from './DisconnectAllConfirm.svelte' - import EnableTransactionProtection from './EnableTransactionProtection.svelte' + import EnableTransactionProtectionModal from './EnableTransactionProtectionModal.svelte' import { configuration } from '../../configuration.js' import SecondaryTokenTable from './SecondaryTokenTable.svelte' - import { shareReplay, startWith } from 'rxjs' import { updateChainRPC } from '../../provider.js' - import { BN_PROTECT_RPC_URL } from '../../constants.js' + import { BN_BOOST_RPC_URL, BN_BOOST_INFO_URL } from '../../constants.js' export let expanded: boolean @@ -75,7 +76,7 @@ await updateChainRPC( primaryWallet.provider, validAppChain, - BN_PROTECT_RPC_URL + validAppChain?.protectedRpcUrl || BN_BOOST_RPC_URL ) enableTransactionProtection = false } catch (error) { @@ -328,9 +329,11 @@ /> {/if} {#if enableTransactionProtection} - (enableTransactionProtection = false)} onEnable={() => enableProtectionRPC()} + infoLink={$accountCenter$.transactionProtectionInfoLink || + BN_BOOST_INFO_URL} /> {/if} @@ -457,8 +460,8 @@ - - {#if !$accountCenter$.hideTransactionProtectionBtn && primaryWalletOnMainnet} + + {#if !$accountCenter$.hideTransactionProtectionBtn && (primaryWalletOnMainnet || validAppChain?.protectedRpcUrl)}
(enableTransactionProtection = true)} class="protect action-container flex items-center pointer" diff --git a/packages/core/src/views/account-center/EnableTransactionProtection.svelte b/packages/core/src/views/account-center/EnableTransactionProtectionModal.svelte similarity index 88% rename from packages/core/src/views/account-center/EnableTransactionProtection.svelte rename to packages/core/src/views/account-center/EnableTransactionProtectionModal.svelte index 642beaa91..d87116749 100644 --- a/packages/core/src/views/account-center/EnableTransactionProtection.svelte +++ b/packages/core/src/views/account-center/EnableTransactionProtectionModal.svelte @@ -6,6 +6,7 @@ export let onEnable: () => void export let onDismiss: () => void + export let infoLink: string