diff --git a/packages/bridge/src/components/EthereumConnect/index.tsx b/packages/bridge/src/components/EthereumConnect/index.tsx
new file mode 100644
index 0000000..d8f651a
--- /dev/null
+++ b/packages/bridge/src/components/EthereumConnect/index.tsx
@@ -0,0 +1,44 @@
+import React from 'react';
+import { Button } from 'antd';
+
+import { useCorrectNetwork } from '../../hooks/useCorrectNetwork';
+import metamaskIcon from '../../assets/metamask.svg';
+import { shortenAddress } from '@oyster/common';
+import { useEthereum } from '../../contexts';
+
+export const EthereumConnect = () => {
+ const { accounts, onConnectEthereum, connected } = useEthereum();
+ const { hasCorrespondingNetworks } = useCorrectNetwork();
+
+ return (
+
+ {connected ? (
+ hasCorrespondingNetworks ? (
+ <>
+
![{'metamask-icon'}]({metamaskIcon})
+ {shortenAddress(accounts[0], 4)}
+ >
+ ) : (
+
+ )
+ ) : (
+
+ )}
+
+ );
+};
diff --git a/packages/bridge/src/components/Footer/index.tsx b/packages/bridge/src/components/Footer/index.tsx
index a03939b..50410cf 100644
--- a/packages/bridge/src/components/Footer/index.tsx
+++ b/packages/bridge/src/components/Footer/index.tsx
@@ -11,15 +11,17 @@ export const Footer = () => {
}
style={{ marginRight: '20px' }}
- onClick={() => window.open('https://github.com/solana-labs/oyster', '_blank')}
- >
-
- }
- onClick={() => window.open('https://twitter.com/solana', '_blank')}>
-
+ >
+ }
+ >
);
};
diff --git a/packages/bridge/src/components/Layout/index.tsx b/packages/bridge/src/components/Layout/index.tsx
index c1dac07..6c4fcaf 100644
--- a/packages/bridge/src/components/Layout/index.tsx
+++ b/packages/bridge/src/components/Layout/index.tsx
@@ -6,20 +6,16 @@ import { Link, useLocation } from 'react-router-dom';
import metamaskIcon from '../../assets/metamask.svg';
import { LABELS } from '../../constants';
-import { contexts, AppBar, shortenAddress, useWallet } from '@oyster/common';
+import { AppBar } from '@oyster/common';
import Wormhole from '../Wormhole';
-import { useEthereum } from '../../contexts';
-import { useCorrectNetwork } from '../../hooks/useCorrectNetwork';
import { Footer as AppFooter } from './../Footer';
+import { EthereumConnect } from '../EthereumConnect';
const { Header, Content, Footer } = Layout;
-const { useConnectionConfig } = contexts.Connection;
export const AppLayout = React.memo((props: any) => {
const location = useLocation();
const [wormholeReady, setWormholeReady] = useState(false);
- const { accounts, provider } = useEthereum();
- const hasCorrespondingNetworks = useCorrectNetwork();
const paths: { [key: string]: string } = {
'/faucet': '7',
@@ -46,32 +42,7 @@ export const AppLayout = React.memo((props: any) => {
WORMHOLE
-
- {accounts[0] && (
-
- {hasCorrespondingNetworks ? (
- <>
-
![{'metamask-icon'}]({metamaskIcon})
- {shortenAddress(accounts[0], 4)}
- >
- ) : (
-
- )}
-
- )}
- >
- }
- />
+ } />
)}
diff --git a/packages/bridge/src/components/SecurityAuditButton/index.tsx b/packages/bridge/src/components/SecurityAuditButton/index.tsx
index 8456896..3670076 100644
--- a/packages/bridge/src/components/SecurityAuditButton/index.tsx
+++ b/packages/bridge/src/components/SecurityAuditButton/index.tsx
@@ -5,8 +5,11 @@ import './index.less';
export const SecurityAuditButton = () => {
return (
-