* feat: do not redirect to wallet on portfolio page * fix: use connected wallet for AccountMenu * fix: fixed ghost AccountDetails * feat: created ShareBar and share functionality * fix: don’t show shareBar if no address is present * fix: stupid 'next/navigation' * tidy: format * fix: fixed tests * ✨ routing and pages for HLS (#538) * 🐛 use useAccountIds * fix: fixed the tests * fix: accountIds is now a suspense --------- Co-authored-by: Bob van der Helm <34470358+bobthebuidlr@users.noreply.github.com>
48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import classNames from 'classnames'
|
|
|
|
import { menuTree } from 'components/Header/DesktopHeader'
|
|
import { Logo } from 'components/Icons'
|
|
import { NavLink } from 'components/Navigation/NavLink'
|
|
import useAccountId from 'hooks/useAccountId'
|
|
import useStore from 'store'
|
|
import { getRoute } from 'utils/route'
|
|
|
|
export default function DesktopNavigation() {
|
|
const address = useStore((s) => s.address)
|
|
const accountId = useAccountId()
|
|
|
|
const focusComponent = useStore((s) => s.focusComponent)
|
|
|
|
function getIsActive(pages: string[]) {
|
|
const segments = location.pathname.split('/')
|
|
return pages.some((page) => segments.includes(page))
|
|
}
|
|
|
|
return (
|
|
<div
|
|
className={classNames(
|
|
focusComponent ? 'absolute left-4 top-3 z-1 block' : 'flex flex-1 items-center',
|
|
)}
|
|
>
|
|
<NavLink href={getRoute('trade', address, accountId)}>
|
|
<span className='block w-10 h-10'>
|
|
<Logo className='text-white' />
|
|
</span>
|
|
</NavLink>
|
|
{!focusComponent && (
|
|
<div className='flex gap-8 px-6'>
|
|
{menuTree.map((item, index) => (
|
|
<NavLink
|
|
key={index}
|
|
href={getRoute(item.pages[0], address, accountId)}
|
|
isActive={getIsActive(item.pages)}
|
|
>
|
|
{item.label}
|
|
</NavLink>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|