94 lines
3.1 KiB
TypeScript
94 lines
3.1 KiB
TypeScript
"use client"
|
|
|
|
import { useState } from 'react'
|
|
import { Calendar, MessageSquare, BotIcon as Robot, PenTool, Bell } from 'lucide-react'
|
|
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu"
|
|
import Image from 'next/image'
|
|
import Link from 'next/link'
|
|
import { Sidebar } from './sidebar'
|
|
|
|
export function MainNav() {
|
|
const [isSidebarOpen, setIsSidebarOpen] = useState(false)
|
|
|
|
return (
|
|
<>
|
|
<div className="flex items-center justify-between p-4 bg-black">
|
|
<div className="flex items-center space-x-4">
|
|
<button
|
|
className="text-white/80 hover:text-white"
|
|
onClick={() => setIsSidebarOpen(true)}
|
|
>
|
|
<span className="sr-only">Toggle menu</span>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
>
|
|
<line x1="3" y1="12" x2="21" y2="12"></line>
|
|
<line x1="3" y1="6" x2="21" y2="6"></line>
|
|
<line x1="3" y1="18" x2="21" y2="18"></line>
|
|
</svg>
|
|
</button>
|
|
<Link href="/">
|
|
<Image
|
|
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/enkun-4TNAp6sm9vEQNPg8XpLlizNyWW3jPD.svg"
|
|
alt="Logo"
|
|
width={32}
|
|
height={32}
|
|
className="text-white"
|
|
/>
|
|
</Link>
|
|
<Link href="/calendar" className="text-white/80 hover:text-white">
|
|
<Calendar className="w-6 h-6" />
|
|
</Link>
|
|
<Link href="/messages" className="text-white/80 hover:text-white">
|
|
<MessageSquare className="w-6 h-6" />
|
|
</Link>
|
|
<Link href="/ai-assistant" className="text-white/80 hover:text-white">
|
|
<Robot className="w-6 h-6" />
|
|
</Link>
|
|
<Link href="/design" className="text-white/80 hover:text-white">
|
|
<PenTool className="w-6 h-6" />
|
|
</Link>
|
|
<Link href="/notifications" className="text-white/80 hover:text-white">
|
|
<Bell className="w-6 h-6" />
|
|
</Link>
|
|
</div>
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Avatar>
|
|
<AvatarImage src="/placeholder.svg" />
|
|
<AvatarFallback>U</AvatarFallback>
|
|
</Avatar>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
<DropdownMenuItem>
|
|
<a href="/signin">Sign In</a>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<a href="/signup">Sign Up</a>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</div>
|
|
<Sidebar
|
|
isOpen={isSidebarOpen}
|
|
onClose={() => setIsSidebarOpen(false)}
|
|
/>
|
|
</>
|
|
)
|
|
}
|
|
|