fix: support default and named exports for useDebounce hook

Ensure compatibility with both default and named exports for useDebounce.

Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>

app/components/BottomNav.tsx

@@ -1,39 +1,42 @@
-"use client"
+'use client'
 
-import Link from "next/link"
-import { usePathname } from "next/navigation"
-import { Home, Database, Target, BrainCircuit } from 'lucide-react' // 引入AI智能助手图标
+import Link from 'next/link'
+import { usePathname } from 'next/navigation'
+import { Home, Database, Users, Bot } from 'lucide-react'
+import { cn } from '@/lib/utils'
 
-const navItems = [
-  { href: "/", icon: Home, label: "首页" },
-  { href: "/data-platform", icon: Database, label: "数据中台" },
-  { href: "/user-portrait", icon: Target, label: "画像" },
-  { href: "/ai-assistant", icon: BrainCircuit, label: "AI助手" },
-]
+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 glass-nav safe-area-bottom z-50 mx-2 mb-2">
-      <div className="flex justify-around items-center py-2">
-        {navItems.map((item) => {
-          const isActive = pathname === item.href || (item.href !== "/" && pathname.startsWith(item.href))
-
+    <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 (
-            <Link
-              key={item.href}
-              href={item.href}
-              className={`flex flex-col items-center justify-center px-1 py-2 rounded-xl transition-all duration-300 min-w-0 flex-1 ${
-                isActive ? "glass-heavy text-blue-600 scale-105" : "text-gray-600 hover:glass-light hover:text-blue-500"
-              }`}
-            >
-              <item.icon className={`h-4 w-4 mb-1 ${isActive ? "text-blue-600" : ""}`} />
-              <span className="text-xs font-medium truncate">{item.label}</span>
-            </Link>
+            <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>
           )
         })}
-      </div>
+      </ul>
     </nav>
   )
 }