Ensure compatibility with both default and named exports for useDebounce. Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import Link from 'next/link'
|
|
import { usePathname } from 'next/navigation'
|
|
import { Home, Database, Users, Bot } from 'lucide-react'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
const NAV_ITEMS = [
|
|
{ href: '/', label: '首页', icon: Home },
|
|
{ href: '/data-platform', label: '数据中台', icon: Database },
|
|
{ href: '/user-portrait', label: '画像', icon: Users },
|
|
{ href: '/ai-assistant', label: 'AI智能助手', icon: Bot },
|
|
] as const
|
|
|
|
export default function BottomNav() {
|
|
const pathname = usePathname()
|
|
|
|
return (
|
|
<nav className="fixed bottom-0 left-0 right-0 z-40 border-t bg-white/95 backdrop-blur md:hidden">
|
|
<ul className="grid grid-cols-4">
|
|
{NAV_ITEMS.map(({ href, label, icon: Icon }) => {
|
|
const active = pathname === href || pathname.startsWith(`${href}/`)
|
|
return (
|
|
<li key={href}>
|
|
<Link
|
|
href={href}
|
|
aria-current={active ? 'page' : undefined}
|
|
className={cn(
|
|
'flex flex-col items-center justify-center gap-1 py-2 text-xs',
|
|
active ? 'text-gray-900' : 'text-gray-500',
|
|
)}
|
|
>
|
|
<Icon className={cn('h-5 w-5', active && 'fill-gray-900')} />
|
|
<span>{label}</span>
|
|
</Link>
|
|
</li>
|
|
)
|
|
})}
|
|
</ul>
|
|
</nav>
|
|
)
|
|
}
|