diff --git a/packages/bridge/src/components/EthereumConnect/index.tsx b/packages/bridge/src/components/EthereumConnect/index.tsx
index 0c52d6f..9bfa1c3 100644
--- a/packages/bridge/src/components/EthereumConnect/index.tsx
+++ b/packages/bridge/src/components/EthereumConnect/index.tsx
@@ -1,14 +1,28 @@
import React from 'react';
-import { Button } from 'antd';
+import { Button, Dropdown, Menu } from 'antd';
import { useCorrectNetwork } from '../../hooks/useCorrectNetwork';
import { shortenAddress } from '@oyster/common';
import { useEthereum } from '../../contexts';
export const EthereumConnect = () => {
- const { accounts, onConnectEthereum, connected, walletProvider } = useEthereum();
+ const {
+ accounts,
+ onConnectEthereum,
+ connected,
+ walletProvider,
+ select,
+ } = useEthereum();
const { hasCorrespondingNetworks } = useCorrectNetwork();
+ const menu = (
+
+ );
+
return (
{connected ? (
@@ -28,6 +42,13 @@ export const EthereumConnect = () => {
WRONG NETWORK
)
+ ) : !!walletProvider ? (
+ onConnectEthereum && onConnectEthereum()}
+ overlay={menu}
+ >
+ Connect Ethereum
+
) : (
- } />
+ disconnect()}
+ style={{ marginTop: '8px' }}
+ >
+ Disconnect ETH
+
+ ) : undefined
+ }
+ useWalletBadge={true}
+ left={}
+ />
)}
diff --git a/packages/bridge/src/components/TokenSelectModal/index.tsx b/packages/bridge/src/components/TokenSelectModal/index.tsx
index e6406e4..0132deb 100644
--- a/packages/bridge/src/components/TokenSelectModal/index.tsx
+++ b/packages/bridge/src/components/TokenSelectModal/index.tsx
@@ -119,7 +119,7 @@ export const TokenSelectModal = (props: {
visible={isModalVisible}
onCancel={() => hideModal()}
footer={null}
- className={"token-select-modal"}
+ className={'token-select-modal'}
>
{
useEffect(() => {
const asset = mintAddress;
- if (!asset || (asset === request?.info?.address && request.from === from && request.toChain === toChain)) {
+ if (
+ !asset ||
+ (asset === request?.info?.address &&
+ request.from === from &&
+ request.toChain === toChain)
+ ) {
return;
}
@@ -99,7 +104,6 @@ export const Transfer = () => {
try {
const bridgeAddress = programIds().wormhole.bridge;
if (from === ASSET_CHAIN.Ethereum) {
-
let signer = provider.getSigner();
let e = WrappedAssetFactory.connect(asset, provider);
let addr = await signer.getAddress();
diff --git a/packages/bridge/src/contexts/bridge.tsx b/packages/bridge/src/contexts/bridge.tsx
index 68c6833..5993077 100644
--- a/packages/bridge/src/contexts/bridge.tsx
+++ b/packages/bridge/src/contexts/bridge.tsx
@@ -1,8 +1,4 @@
-import React, {
- createContext,
- FunctionComponent,
- useContext,
-} from 'react';
+import React, { createContext, FunctionComponent, useContext } from 'react';
import { SolanaBridge } from '../core';
import {
useConnection,
diff --git a/packages/bridge/src/contexts/ethereum.tsx b/packages/bridge/src/contexts/ethereum.tsx
index e69685b..62e2d13 100644
--- a/packages/bridge/src/contexts/ethereum.tsx
+++ b/packages/bridge/src/contexts/ethereum.tsx
@@ -14,13 +14,13 @@ import { useWallet as useEthereumWallet } from 'use-wallet';
import WalletConnectProvider from '@walletconnect/web3-provider';
// @ts-ignore
import Fortmatic from 'fortmatic';
-import { useWallet, useLocalStorageState} from '@oyster/common';
-import { WalletAdapter } from '@solana/wallet-base'
+import { useWallet, useLocalStorageState } from '@oyster/common';
+import { WalletAdapter } from '@solana/wallet-base';
import { TokenList, TokenInfo } from '@uniswap/token-lists';
import { ethers } from 'ethers';
import { MetamaskWalletAdapter } from '../wallet-adapters/metamask';
import { Button, Modal } from 'antd';
-import {WalletConnectWalletAdapter} from "../wallet-adapters/wallet-connect";
+import { WalletConnectWalletAdapter } from '../wallet-adapters/wallet-connect';
const ASSETS_URL =
'https://raw.githubusercontent.com/solana-labs/oyster/main/assets/wallets/';
@@ -48,6 +48,8 @@ export interface EthereumContextState {
connected: boolean;
chainId: number;
walletProvider: any;
+ select: () => void;
+ disconnect: () => void;
onConnectEthereum?: () => void;
}
@@ -57,6 +59,8 @@ export const EthereumContext = createContext({
accounts: [''],
chainId: 0,
connected: false,
+ select() {},
+ disconnect() {},
walletProvider: null,
});
@@ -142,12 +146,12 @@ export const EthereumProvider: FunctionComponent = ({ children }) => {
}, [setTokens]);
const onConnectEthereum = useCallback(() => {
- if (wallet && providerUrl) {
+ if (wallet && providerUrl && !connected) {
wallet.connect();
- } else {
+ } else if (!connected) {
select();
}
- }, [wallet, providerUrl]);
+ }, [wallet, connected, providerUrl]);
useEffect(() => {
if (wallet) {
@@ -162,6 +166,11 @@ export const EthereumProvider: FunctionComponent = ({ children }) => {
});
wallet.on('disconnect', error => {
setConnected(false);
+ setAccounts([]);
+ // @ts-ignore
+ setChainId(0);
+ // @ts-ignore
+ setProvider(null);
});
// @ts-ignore
wallet.on('accountsChanged', accounts => {
@@ -184,10 +193,10 @@ export const EthereumProvider: FunctionComponent = ({ children }) => {
const close = useCallback(() => setIsModalVisible(false), []);
useEffect(() => {
- if (walletConnected && !connected) {
+ if (walletConnected) {
onConnectEthereum();
}
- }, [walletConnected, connected, providerUrl]);
+ }, [walletConnected, providerUrl]);
return (
{
connected,
chainId,
walletProvider,
+ select,
+ disconnect: () => wallet?.disconnect(),
onConnectEthereum: () => onConnectEthereum(),
}}
>
diff --git a/packages/bridge/src/views/home/index.tsx b/packages/bridge/src/views/home/index.tsx
index e1504a0..31c9a0f 100644
--- a/packages/bridge/src/views/home/index.tsx
+++ b/packages/bridge/src/views/home/index.tsx
@@ -81,7 +81,7 @@ export const HomeView = () => {
style: {},
},
children: (
-
+
{shortenAddress(text, 6)}
),
@@ -98,7 +98,11 @@ export const HomeView = () => {
style: {},
},
children: (
-
+
{shortenAddress(text, 6)}
),
diff --git a/packages/bridge/src/wallet-adapters/metamask.tsx b/packages/bridge/src/wallet-adapters/metamask.tsx
index 44843fa..0fa1d03 100644
--- a/packages/bridge/src/wallet-adapters/metamask.tsx
+++ b/packages/bridge/src/wallet-adapters/metamask.tsx
@@ -1,7 +1,7 @@
import EventEmitter from 'eventemitter3';
import { PublicKey, Transaction } from '@solana/web3.js';
import { notify } from '@oyster/common';
-import { WalletAdapter } from '@solana/wallet-base'
+import { WalletAdapter } from '@solana/wallet-base';
import { ethers } from 'ethers';
export class MetamaskWalletAdapter
@@ -95,8 +95,9 @@ export class MetamaskWalletAdapter
}
disconnect() {
- if (this._publicKey) {
+ if (this._provider) {
this._publicKey = null;
+ this._provider = null;
this.emit('disconnect');
}
}
diff --git a/packages/bridge/src/wallet-adapters/wallet-connect.tsx b/packages/bridge/src/wallet-adapters/wallet-connect.tsx
index bcb6592..002e9c9 100644
--- a/packages/bridge/src/wallet-adapters/wallet-connect.tsx
+++ b/packages/bridge/src/wallet-adapters/wallet-connect.tsx
@@ -1,9 +1,9 @@
import EventEmitter from 'eventemitter3';
import { PublicKey, Transaction } from '@solana/web3.js';
import { notify } from '@oyster/common';
-import { WalletAdapter } from '@solana/wallet-base'
+import { WalletAdapter } from '@solana/wallet-base';
import { ethers } from 'ethers';
-import WalletConnectProvider from "@walletconnect/web3-provider";
+import WalletConnectProvider from '@walletconnect/web3-provider';
export class WalletConnectWalletAdapter
extends EventEmitter
@@ -13,11 +13,13 @@ export class WalletConnectWalletAdapter
_accounts: Array;
_chainID: number;
_provider: any;
+ _walletProvider: any;
constructor() {
super();
this._publicKey = null;
this._provider = null;
+ this._walletProvider = null;
this._accounts = [];
this._chainID = 0;
this._onProcess = false;
@@ -53,44 +55,52 @@ export class WalletConnectWalletAdapter
// Create WalletConnect Provider
const walletConnectProvider = new WalletConnectProvider({
- infuraId: "535ab8649e9f40cface13cbded7d647e",
+ infuraId: '535ab8649e9f40cface13cbded7d647e',
});
- walletConnectProvider.enable().then(()=>{
- const provider = new ethers.providers.Web3Provider(walletConnectProvider);
- const signer = provider.getSigner();
- signer.getAddress().then(account => {
- this._accounts = [account];
- provider.getNetwork().then(network => {
- this._chainID = network.chainId;
- this._provider = provider;
- this.emit('connect');
+ walletConnectProvider
+ .enable()
+ .then(() => {
+ const provider = new ethers.providers.Web3Provider(
+ walletConnectProvider,
+ );
+ const signer = provider.getSigner();
+ signer.getAddress().then(account => {
+ this._accounts = [account];
+ provider.getNetwork().then(network => {
+ this._chainID = network.chainId;
+ this._provider = provider;
+ this._walletProvider = walletConnectProvider;
+ this.emit('connect');
+ });
});
+ // @ts-ignore
+ walletConnectProvider.on(
+ 'disconnect',
+ (code: number, reason: string) => {
+ this.emit('disconnect', { code, reason });
+ },
+ );
+ // @ts-ignore
+ walletConnectProvider.on('accountsChanged', (accounts: string[]) => {
+ this.emit('accountsChanged', accounts);
+ });
+ // @ts-ignore
+ walletConnectProvider.on('chainChanged', (chainId: number) => {
+ this.emit('chainChanged', chainId);
+ });
+ })
+ .catch(() => {
+ this.disconnect();
+ })
+ .finally(() => {
+ this._onProcess = false;
});
- // @ts-ignore
- walletConnectProvider.on('disconnect', (code: number, reason: string) => {
- this.emit('disconnect', {code, reason});
- });
- // @ts-ignore
- walletConnectProvider.on('accountsChanged', (accounts: string[]) => {
- this.emit('accountsChanged', accounts);
- });
- // @ts-ignore
- walletConnectProvider.on('chainChanged', (chainId: number) => {
- this.emit('chainChanged', chainId);
- });
- })
- .catch(() => {
- this.disconnect();
- })
- .finally(() => {
- this._onProcess = false;
- });
-
}
disconnect() {
- if (this._publicKey) {
+ if (this._provider) {
this._publicKey = null;
+ this._walletProvider.disconnect();
this.emit('disconnect');
}
}