Joel 7709d9df20
Chore: frontend infrastructure upgrade (#16420)
Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: jZonG <jzongcode@gmail.com>
2025-03-21 17:41:03 +08:00

39 lines
1.0 KiB
TypeScript

'use client'
import { useTranslation } from 'react-i18next'
import Link from 'next/link'
import { useSelectedLayoutSegment } from 'next/navigation'
import {
RiPlanetFill,
RiPlanetLine,
} from '@remixicon/react'
import classNames from '@/utils/classnames'
type ExploreNavProps = {
className?: string
}
const ExploreNav = ({
className,
}: ExploreNavProps) => {
const { t } = useTranslation()
const selectedSegment = useSelectedLayoutSegment()
const activated = selectedSegment === 'explore'
return (
<Link href="/explore/apps" className={classNames(
className, 'group',
activated && 'bg-components-main-nav-nav-button-bg-active shadow-md',
activated ? 'text-components-main-nav-nav-button-text-active' : 'text-components-main-nav-nav-button-text hover:bg-components-main-nav-nav-button-bg-hover',
)}>
{
activated
? <RiPlanetFill className='mr-2 h-4 w-4' />
: <RiPlanetLine className='mr-2 h-4 w-4' />
}
{t('common.menus.explore')}
</Link>
)
}
export default ExploreNav