1+ import { Button , HamburgerButton , Logo , NavOverlay } from '@streamr/streamr-layout'
12import React , { FunctionComponent , HTMLAttributes } from 'react'
3+ import { Link , useLocation , useNavigate } from 'react-router-dom'
24import styled from 'styled-components'
3- import { useLocation , Link , useNavigate } from 'react-router-dom'
4- import { Button , HamburgerButton , Logo , NavOverlay } from '@streamr/streamr-layout'
5- import { DESKTOP , TABLET } from '~/shared/utils/styled'
6- import SvgIcon from '~/shared/components/SvgIcon'
7- import { truncate } from '~/shared/utils/text'
5+ import { ChainSelector as UnstyledChainSelector } from '~/components/ChainSelector'
6+ import { useMediaQuery } from '~/hooks'
7+ import { useOperatorForWalletQuery } from '~/hooks/operators'
88import { connectModal } from '~/modals/ConnectModal'
9+ import SvgIcon from '~/shared/components/SvgIcon'
910import { useEns , useWalletAccount } from '~/shared/stores/wallet'
10- import toast from '~/utils/toast '
11- import { useOperatorForWalletQuery } from '~/hooks/operators '
11+ import { DESKTOP , TABLET } from '~/shared/ utils/styled '
12+ import { truncate } from '~/shared/utils/text '
1213import { saveOperator } from '~/utils'
13- import { useMediaQuery } from '~/hooks'
14- import { ChainSelector as UnstyledChainSelector } from '~/components/ChainSelector'
15- import { useCurrentChainId } from '~/utils/chains'
14+ import { useCurrentChainId , useCurrentChainKey } from '~/utils/chains'
1615import { Route as R , routeOptions } from '~/utils/routes'
17- import { useCurrentChainSymbolicName } from '~/utils/chains'
18- import { Avatarless , Name , Username } from './User'
16+ import toast from '~/utils/toast'
1917import {
2018 Avatar ,
2119 LogoLink ,
@@ -36,8 +34,9 @@ import {
3634 UserInfoMobile ,
3735 WalletAddress ,
3836} from './Nav.styles'
39- import { Dropdown } from './NetworkDropdown'
4037import { NetworkAccordion } from './NetworkAccordion'
38+ import { Dropdown } from './NetworkDropdown'
39+ import { Avatarless , Name , Username } from './User'
4140
4241const UnstyledDesktopNav : FunctionComponent = ( props ) => {
4342 const { pathname } = useLocation ( )
@@ -56,7 +55,7 @@ const UnstyledDesktopNav: FunctionComponent = (props) => {
5655
5756 const chainId = useCurrentChainId ( )
5857
59- const chainName = useCurrentChainSymbolicName ( )
58+ const chainKey = useCurrentChainKey ( )
6059
6160 return (
6261 < div { ...props } data-testid = { 'desktop-nav' } >
@@ -71,14 +70,14 @@ const UnstyledDesktopNav: FunctionComponent = (props) => {
7170 < div />
7271 < NavbarItem >
7372 < NavbarLinkDesktop highlight = { pathname . startsWith ( R . projects ( ) ) } >
74- < NavLink as = { Link } to = { R . projects ( routeOptions ( chainName ) ) } >
73+ < NavLink as = { Link } to = { R . projects ( routeOptions ( chainKey ) ) } >
7574 Projects
7675 </ NavLink >
7776 </ NavbarLinkDesktop >
7877 </ NavbarItem >
7978 < NavbarItem >
8079 < NavbarLinkDesktop highlight = { pathname . startsWith ( R . streams ( ) ) } >
81- < NavLink as = { Link } to = { R . streams ( routeOptions ( chainName ) ) } >
80+ < NavLink as = { Link } to = { R . streams ( routeOptions ( chainKey ) ) } >
8281 Streams
8382 </ NavLink >
8483 </ NavbarLinkDesktop >
@@ -138,7 +137,7 @@ const UnstyledDesktopNav: FunctionComponent = (props) => {
138137 navigate (
139138 R . operator (
140139 operator . id ,
141- routeOptions ( chainName ) ,
140+ routeOptions ( chainKey ) ,
142141 ) ,
143142 )
144143 } }
@@ -202,7 +201,7 @@ const UnstyledMobileNav: FunctionComponent<{ className?: string }> = ({ classNam
202201
203202 const { pathname } = useLocation ( )
204203
205- const chainName = useCurrentChainSymbolicName ( )
204+ const chainKey = useCurrentChainKey ( )
206205
207206 return (
208207 < NavOverlay className = { className } >
@@ -226,12 +225,12 @@ const UnstyledMobileNav: FunctionComponent<{ className?: string }> = ({ classNam
226225 </ UserInfoMobile >
227226 ) }
228227 < NavbarLinkMobile highlight = { pathname . startsWith ( R . projects ( ) ) } >
229- < NavLink as = { Link } to = { R . projects ( routeOptions ( chainName ) ) } >
228+ < NavLink as = { Link } to = { R . projects ( routeOptions ( chainKey ) ) } >
230229 Projects
231230 </ NavLink >
232231 </ NavbarLinkMobile >
233232 < NavbarLinkMobile highlight = { pathname . startsWith ( R . streams ( ) ) } >
234- < NavLink as = { Link } to = { R . streams ( routeOptions ( chainName ) ) } >
233+ < NavLink as = { Link } to = { R . streams ( routeOptions ( chainKey ) ) } >
235234 Streams
236235 </ NavLink >
237236 </ NavbarLinkMobile >
0 commit comments