diff --git a/src/components/AppLayout/Header/components/Layout.tsx b/src/components/AppLayout/Header/components/Layout.tsx
index fae9690d..3d13473d 100644
--- a/src/components/AppLayout/Header/components/Layout.tsx
+++ b/src/components/AppLayout/Header/components/Layout.tsx
@@ -7,6 +7,7 @@ import * as React from 'react'
import { Link } from 'react-router-dom'
import Provider from './Provider'
+import NetworkSelector from './NetworkSelector'
import Spacer from 'src/components/Spacer'
import Col from 'src/components/layout/Col'
@@ -55,6 +56,7 @@ const styles = () => ({
const Layout = ({ classes, providerDetails, providerInfo }) => {
const { clickAway, open, toggle } = useStateHandler()
+ const { clickAway: clickAwayNetworks, open: openNetworks, toggle: toggleNetworks } = useStateHandler()
return (
@@ -90,6 +92,32 @@ const Layout = ({ classes, providerDetails, providerInfo }) => {
)}
/>
+ (
+
+ {({ TransitionProps }) => (
+
+ <>
+
+
+ Networks list
+ {/* {providerDetails} */}
+
+
+
+
+ )}
+
+ )}
+ />
)
}
diff --git a/src/components/AppLayout/Header/components/NetworkSelector.tsx b/src/components/AppLayout/Header/components/NetworkSelector.tsx
new file mode 100644
index 00000000..d824e91c
--- /dev/null
+++ b/src/components/AppLayout/Header/components/NetworkSelector.tsx
@@ -0,0 +1,69 @@
+import IconButton from '@material-ui/core/IconButton'
+import { withStyles } from '@material-ui/core/styles'
+import ExpandLess from '@material-ui/icons/ExpandLess'
+import ExpandMore from '@material-ui/icons/ExpandMore'
+import * as React from 'react'
+
+import NetworkLabel from './NetworkLabel'
+import Col from 'src/components/layout/Col'
+import Divider from 'src/components/layout/Divider'
+import { screenSm, sm } from 'src/theme/variables'
+
+const styles = () => ({
+ root: {
+ alignItems: 'center',
+ display: 'flex',
+ height: '100%',
+
+ [`@media (min-width: ${screenSm}px)`]: {
+ flexBasis: '284px' /* should be 184px */,
+ marginRight: '20px',
+ },
+ },
+ provider: {
+ alignItems: 'center',
+ cursor: 'pointer',
+ display: 'flex',
+ flex: '1 1 auto',
+ padding: sm,
+ [`@media (min-width: ${screenSm}px)`]: {
+ paddingLeft: sm,
+ paddingRight: sm,
+ },
+ },
+ expand: {
+ height: '30px',
+ width: '30px',
+ },
+})
+
+class NetworkSelector extends React.Component {
+ myRef
+
+ constructor(props) {
+ super(props)
+
+ this.myRef = React.createRef()
+ }
+
+ render() {
+ const { render, classes, open, toggle } = this.props
+
+ return (
+ <>
+
+
+
+
+ {open ? : }
+
+
+
+
+ {/*
Network
@@ -169,8 +169,8 @@ export const UserDetails = ({
{upperFirst(ETHEREUM_NETWORK[network])}
-
-
+
+ */}
{openDashboard && (