ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add NFTs tab to navbar (#4408)

Browse Source 
add NFT tab to navbar

Co-authored-by: Charlie <charlie@uniswap.org>
This commit is contained in:
Charles Bachmeier 2022-08-18 14:40:52 -07:00 committed by GitHub
parent 75eceaa5e1
commit 818b1c84b0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/NavBar/MobileSidebar.tsx
View File

@ -1,5 +1,6 @@
import FeatureFlagModal from 'components/FeatureFlagModal/FeatureFlagModal'
import { PrivacyPolicyModal } from 'components/PrivacyPolicy'
import { Phase1Variant, usePhase1Flag } from 'featureFlags/flags/phase1'
import { Box } from 'nft/components/Box'
import { Portal } from 'nft/components/common/Portal'
import { Column, Row } from 'nft/components/Flex'
@ -134,6 +135,7 @@ export const MobileSideBar = () => {
const togglePrivacyPolicy = useTogglePrivacyPolicy()
const openFeatureFlagsModal = useToggleModal(ApplicationModal.FEATURE_FLAGS)
const { pathname } = useLocation()
const phase1Flag = usePhase1Flag()
const isPoolActive =
pathname.startsWith('/pool') ||
pathname.startsWith('/add') ||
@ -162,6 +164,11 @@ export const MobileSideBar = () => {
<NavLinkRow href="/tokens" close={toggleOpen} isActive={pathname.startsWith('/tokens')}>
Tokens
</NavLinkRow>
{phase1Flag === Phase1Variant.Enabled && (
<NavLinkRow href="/nfts" close={toggleOpen} isActive={pathname.startsWith('/nfts')}>
NFTs
</NavLinkRow>
)}
<NavLinkRow href="/pool" id={'pool-nav-link'} isActive={isPoolActive} close={toggleOpen}>
Pool
</NavLinkRow>

7
src/components/NavBar/Navbar.tsx
View File

@ -1,4 +1,5 @@
import Web3Status from 'components/Web3Status'
import { Phase1Variant, usePhase1Flag } from 'featureFlags/flags/phase1'
import { useWindowSize } from 'hooks/useWindowSize'
import { ReactNode } from 'react'
import { NavLink, NavLinkProps, useLocation } from 'react-router-dom'
@ -62,6 +63,7 @@ const MobileNavbar = () => {
const Navbar = () => {
const { width: windowWidth } = useWindowSize()
const { pathname } = useLocation()
const phase1Flag = usePhase1Flag()
if (windowWidth && windowWidth < breakpoints.desktopXl) {
return <MobileNavbar />
@ -88,6 +90,11 @@ const Navbar = () => {
<MenuItem href="/tokens" isActive={pathname.startsWith('/explore')}>
Tokens
</MenuItem>
{phase1Flag === Phase1Variant.Enabled && (
<MenuItem href="/nfts" isActive={pathname.startsWith('/nfts')}>
NFTs
</MenuItem>
)}
<MenuItem href="/pool" id={'pool-nav-link'} isActive={isPoolActive}>
Pool
</MenuItem>