import { ReactNode, useState } from 'react'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { ChartBarIcon, HomeIcon, MenuIcon, XIcon } from '@heroicons/react/solid'
import TradeIcon from '../icons/TradeIcon'
import { useTranslation } from 'next-i18next'
import { IconButton } from '../shared/Button'
import {
CashIcon,
ChevronRightIcon,
CurrencyDollarIcon as FeesIcon,
LightBulbIcon,
} from '@heroicons/react/solid'
const StyledBarItemLabel = ({
children,
...props
}: {
children: ReactNode
}) => (
{children}
)
const BottomBar = () => {
const { t } = useTranslation('common')
const { asPath } = useRouter()
const [showPanel, setShowPanel] = useState(false)
return (
<>
>
)
}
export default BottomBar
const MoreMenuPanel = ({
showPanel,
setShowPanel,
}: {
showPanel: boolean
setShowPanel: (showPanel: boolean) => void
}) => {
const { t } = useTranslation('common')
return (
setShowPanel(false)} hideBg>
setShowPanel(false)}
>
}
/>
}
/>
}
isExternal
/>
)
}
const MoreMenuItem = ({
title,
path,
icon,
isExternal,
}: {
title: string
path: string
icon: ReactNode
isExternal?: boolean
}) => {
const classNames =
'default-transition flex w-full items-center justify-between border-t border-th-bkg-4 px-2 py-3 text-th-fgd-2 hover:text-th-fgd-1'
return isExternal ? (
{icon}
{title}
) : (
{icon}
{title}
)
}