Agent MCP

"use client" import React from "react" import { Menu } from "lucide-react" import { Button } from "@/components/ui/button" import { ThemeToggle } from "./theme-toggle" import { ProjectPicker } from "@/components/server/project-picker" import { useSidebar as useSidebarUI } from "@/components/ui/sidebar" export function Header() { const { toggleSidebar } = useSidebarUI() return ( <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60"> <div className="flex h-16 items-center gap-4 px-[var(--space-fluid-lg)]"> {/* Menu Toggle Button - Always visible on all viewports */} <Button variant="ghost" size="icon" onClick={toggleSidebar} className="shrink-0 lg:hidden" > <Menu className="h-5 w-5" /> <span className="sr-only">Toggle navigation menu</span> </Button> {/* Project Picker */} <div className="flex-1"> <ProjectPicker /> </div> {/* Theme Toggle */} <ThemeToggle /> </div> </header> ) }