diff --git a/hemi-metadata/index.ts b/hemi-metadata/index.ts index 7ed15f0d..b0fdcbcf 100644 --- a/hemi-metadata/index.ts +++ b/hemi-metadata/index.ts @@ -1,10 +1,7 @@ import { Chain } from 'wagmi' -import { mainnet, sepolia } from 'wagmi/chains' - -const testnet = (process.env.NEXT_PUBLIC_TESTNET_MODE ?? 'false') === 'true' // These values will change once migrated to Hemi network -const hemiTestnet: Chain = { +export const hemiTestnet: Chain = { blockExplorers: { default: { name: 'BVM Tesnet Explorer', @@ -28,18 +25,13 @@ const hemiTestnet: Chain = { http: ['http://216.219.89.253:18546'], }, }, - testnet, + testnet: true, } // Currently, there's no data for mainnet, so let's copy the testnet data // Once that's defined, we could use the flag in build time to compile either test or mainnet // for exported hemi object -const hemiMainnet: Chain = { +export const hemiMainnet: Chain = { ...hemiTestnet, + testnet: false, } - -export const hemi = testnet ? hemiTestnet : hemiMainnet - -export const bridgeableNetworks = testnet ? [sepolia] : [mainnet] - -export const networks = [hemi, ...bridgeableNetworks] diff --git a/marketing/app/[locale]/layout.tsx b/marketing/app/[locale]/layout.tsx index 48434981..dd24499b 100644 --- a/marketing/app/[locale]/layout.tsx +++ b/marketing/app/[locale]/layout.tsx @@ -2,6 +2,7 @@ import 'styles/globals.css' import '@rainbow-me/rainbowkit/styles.css' import { locales, type Locale } from 'app/i18n' +import { hemi } from 'app/networks' import { bricolageGrotesque, inter } from 'fonts' import { notFound } from 'next/navigation' import { NextIntlClientProvider } from 'next-intl' @@ -36,7 +37,7 @@ export default async function RootLayout({ className={`font-inter flex flex-col py-7 ${bricolageGrotesque.variable} ${inter.className} bg-zinc-100`} > - + {/* These styles can't be on body because they break with RainbowKit https://github.com/rainbow-me/rainbowkit/issues/609 */}
diff --git a/marketing/app/[locale]/network/configureNetworks.tsx b/marketing/app/[locale]/network/configureNetworks.tsx index 1d063e82..8d95515c 100644 --- a/marketing/app/[locale]/network/configureNetworks.tsx +++ b/marketing/app/[locale]/network/configureNetworks.tsx @@ -1,6 +1,6 @@ 'use client' -import { bridgeableNetworks, hemi } from 'hemi-metadata' +import { bridgeableNetworks, hemi } from 'app/networks' import dynamic from 'next/dynamic' import Link from 'next/link' import { usePathname, useRouter, useSearchParams } from 'next/navigation' diff --git a/marketing/app/networks.ts b/marketing/app/networks.ts new file mode 100644 index 00000000..63d627ea --- /dev/null +++ b/marketing/app/networks.ts @@ -0,0 +1,10 @@ +'use client' + +import { hemiMainnet, hemiTestnet } from 'hemi-metadata' +import { mainnet, sepolia } from 'wagmi/chains' + +const testnetMode = (process.env.NEXT_PUBLIC_TESTNET_MODE ?? 'false') === 'true' + +export const hemi = testnetMode ? hemiTestnet : hemiMainnet + +export const bridgeableNetworks = testnetMode ? [sepolia] : [mainnet] diff --git a/ui-common/components/walletContext.tsx b/ui-common/components/walletContext.tsx index 75ec78cb..8f0c8a20 100644 --- a/ui-common/components/walletContext.tsx +++ b/ui-common/components/walletContext.tsx @@ -7,43 +7,51 @@ import { type Locale, } from '@rainbow-me/rainbowkit' import { metaMaskWallet } from '@rainbow-me/rainbowkit/wallets' -import { networks } from 'hemi-metadata' -import { configureChains, createConfig, WagmiConfig } from 'wagmi' +import { bridgeableNetworks } from 'hemi-metadata' +import { useMemo } from 'react' +import { type Chain, configureChains, createConfig, WagmiConfig } from 'wagmi' import { publicProvider } from 'wagmi/providers/public' -const { chains, publicClient } = configureChains(networks, [publicProvider()]) - -const connectors = connectorsForWallets([ - { - groupName: 'Wallets', - // internally "metaMaskWallet" has code for wallet connect. If we don't set version to 1, typings requires us - // to pass a projectId that is generated in wallet connect's website - // after all, (for now) we won't support wallet connect. - wallets: [metaMaskWallet({ chains, walletConnectVersion: '1' })], - }, -]) - -const wagmiConfig = createConfig({ - autoConnect: true, - connectors, - publicClient, -}) - type Props = { children: React.ReactNode + hemiChain: Chain locale: Locale } -export const WalletContext = ({ children, locale }: Props) => ( - - - {children} - - -) +export const WalletContext = function ({ children, hemiChain, locale }: Props) { + const { chains, publicClient } = useMemo( + () => + configureChains([hemiChain, ...bridgeableNetworks], [publicProvider()]), + [hemiChain], + ) + + const connectors = connectorsForWallets([ + { + groupName: 'Wallets', + // internally "metaMaskWallet" has code for wallet connect. If we don't set version to 1, typings requires us + // to pass a projectId that is generated in wallet connect's website + // after all, (for now) we won't support wallet connect. + wallets: [metaMaskWallet({ chains, walletConnectVersion: '1' })], + }, + ]) + + const wagmiConfig = createConfig({ + autoConnect: true, + connectors, + publicClient, + }) + + return ( + + + {children} + + + ) +} diff --git a/webapp/app/[locale]/bridge/page.tsx b/webapp/app/[locale]/bridge/page.tsx index 6ae0240f..c251a8ec 100644 --- a/webapp/app/[locale]/bridge/page.tsx +++ b/webapp/app/[locale]/bridge/page.tsx @@ -1,7 +1,7 @@ 'use client' import { TokenSelector } from 'app/components/TokenSelector' -import { hemi, networks } from 'hemi-metadata' +import { hemi, bridgeableNetworks } from 'app/networks' import dynamic from 'next/dynamic' import { useTranslations } from 'next-intl' import Skeleton from 'react-loading-skeleton' @@ -12,6 +12,8 @@ import { Deposit } from './_components/deposit' import { Withdraw } from './_components/withdraw' import { useBridgeState } from './useBridgeState' +const networks = [hemi, ...bridgeableNetworks] + const Balance = dynamic( () => import('components/balance').then(mod => mod.Balance), { diff --git a/webapp/app/[locale]/bridge/useBridgeState.ts b/webapp/app/[locale]/bridge/useBridgeState.ts index de6a2e8a..6d31d59b 100644 --- a/webapp/app/[locale]/bridge/useBridgeState.ts +++ b/webapp/app/[locale]/bridge/useBridgeState.ts @@ -1,4 +1,4 @@ -import { hemi, bridgeableNetworks } from 'hemi-metadata' +import { bridgeableNetworks, hemi } from 'app/networks' import { useReducer } from 'react' import { tokenList } from 'tokenList' import { Token } from 'types/token' diff --git a/webapp/app/[locale]/layout.tsx b/webapp/app/[locale]/layout.tsx index bafa2973..363cc871 100644 --- a/webapp/app/[locale]/layout.tsx +++ b/webapp/app/[locale]/layout.tsx @@ -3,6 +3,7 @@ import '@rainbow-me/rainbowkit/styles.css' import 'react-loading-skeleton/dist/skeleton.css' import { locales, type Locale } from 'app/i18n' +import { hemi } from 'app/networks' import { Header } from 'components/header' import { notFound } from 'next/navigation' import { NextIntlClientProvider } from 'next-intl' @@ -37,7 +38,7 @@ export default async function RootLayout({ className={`flex min-h-screen flex-col bg-neutral-100 ${bricolageGrotesque.variable} ${inter.className}`} > - +
{children} diff --git a/webapp/app/networks.ts b/webapp/app/networks.ts new file mode 100644 index 00000000..63d627ea --- /dev/null +++ b/webapp/app/networks.ts @@ -0,0 +1,10 @@ +'use client' + +import { hemiMainnet, hemiTestnet } from 'hemi-metadata' +import { mainnet, sepolia } from 'wagmi/chains' + +const testnetMode = (process.env.NEXT_PUBLIC_TESTNET_MODE ?? 'false') === 'true' + +export const hemi = testnetMode ? hemiTestnet : hemiMainnet + +export const bridgeableNetworks = testnetMode ? [sepolia] : [mainnet] diff --git a/webapp/components/addNetworkToWallet.tsx b/webapp/components/addNetworkToWallet.tsx index 4ae70ccf..68508583 100644 --- a/webapp/components/addNetworkToWallet.tsx +++ b/webapp/components/addNetworkToWallet.tsx @@ -1,6 +1,6 @@ 'use client' -import { hemi } from 'hemi-metadata' +import { hemi } from 'app/networks' import { useTranslations } from 'next-intl' import { useAccount, useNetwork, useWalletClient } from 'wagmi' diff --git a/webapp/hooks/useL2Bridge.ts b/webapp/hooks/useL2Bridge.ts index 43829a20..867ec20c 100644 --- a/webapp/hooks/useL2Bridge.ts +++ b/webapp/hooks/useL2Bridge.ts @@ -1,5 +1,5 @@ import { type CrossChainMessenger as CrossChainMessengerType } from '@eth-optimism/sdk' -import { hemi } from 'hemi-metadata' +import { hemi } from 'app/networks' import { type Provider, useJsonRpcProvider, diff --git a/webapp/tokenList.ts b/webapp/tokenList.ts index 63cc570a..23948bc3 100644 --- a/webapp/tokenList.ts +++ b/webapp/tokenList.ts @@ -1,7 +1,7 @@ /* eslint-disable sort-keys */ // example list for Token list - will probably need to be loaded from somewhere -import { hemi } from 'hemi-metadata' +import { hemi } from 'app/networks' import { Token } from 'types/token' import { sepolia } from 'wagmi/chains'