增加AI页面在其它页面的展示

client/src/components/BottomNav.tsx

@@ -6,6 +6,8 @@
    - Inactive: muted icon + label
    ============================================================ */
 import { cn } from "@/lib/utils";
+import { useAIDrawer } from "@/contexts/AIDrawerContext";
+import { useIsLgUp } from "@/hooks/useIsLgUp";
 import {
   Activity,
   Bot,
@@ -31,6 +33,8 @@ const NAV_ITEMS: NavItem[] = [
 
 export default function BottomNav() {
   const [location] = useLocation();
+  const isLgUp = useIsLgUp();
+  const { open: aiDrawerOpen, setOpen: setAiDrawerOpen } = useAIDrawer();
 
   return (
     <nav
@@ -46,14 +50,16 @@ export default function BottomNav() {
     >
       <div className="flex items-stretch justify-around">
         {NAV_ITEMS.map((item) => {
-          const isActive = location === item.path ||
-            (item.path === "/" && location === "/") ||
-            (item.path !== "/" && location.startsWith(item.path));
+          const isActive =
+            item.path === "/ai"
+              ? location === "/ai" || (isLgUp && aiDrawerOpen)
+              : location === item.path ||
+                (item.path === "/" && location === "/") ||
+                (item.path !== "/" && location.startsWith(item.path));
           const Icon = item.icon;
 
-          return (
-            <Link key={item.path} href={item.path}>
-              <div className="flex flex-col items-center justify-center relative pt-2.5 pb-1.5 px-3">
+          const inner = (
+            <div className="flex flex-col items-center justify-center relative pt-2.5 pb-1.5 px-3">
                 {/* Active indicator bar */}
                 <div
                   className="absolute top-0 left-1/2 -translate-x-1/2 rounded-b-full transition-all duration-300"
@@ -99,6 +105,41 @@ export default function BottomNav() {
                   {item.label}
                 </span>
               </div>
+          );
+
+          if (item.path === "/ai") {
+            if (!isLgUp) {
+              return (
+                <Link key={item.path} href={item.path}>
+                  {inner}
+                </Link>
+              );
+            }
+            return (
+              <div
+                key={item.path}
+                role="button"
+                tabIndex={0}
+                className="cursor-pointer select-none"
+                onClick={() => {
+                  if (location === "/ai") return;
+                  setAiDrawerOpen((o) => !o);
+                }}
+                onKeyDown={(e) => {
+                  if (e.key !== "Enter" && e.key !== " ") return;
+                  e.preventDefault();
+                  if (location === "/ai") return;
+                  setAiDrawerOpen((o) => !o);
+                }}
+              >
+                {inner}
+              </div>
+            );
+          }
+
+          return (
+            <Link key={item.path} href={item.path}>
+              {inner}
             </Link>
           );
         })}