101 lines
3.3 KiB
TypeScript
101 lines
3.3 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import {
|
|
Calendar,
|
|
MessageSquare,
|
|
BotIcon as Robot,
|
|
PenTool,
|
|
Bell,
|
|
} from "lucide-react";
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { Sidebar } from "./sidebar";
|
|
import { useSession, signIn, signOut } from "next-auth/react";
|
|
|
|
export function MainNav() {
|
|
const [isSidebarOpen, setIsSidebarOpen] = useState(false);
|
|
const { data: session } = useSession();
|
|
|
|
console.log(session);
|
|
|
|
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>
|
|
{session ? (
|
|
<div className='flex items-center space-x-4'>
|
|
<div className='cursor-pointer text-white/80 hover:text-white'>
|
|
<span>
|
|
{session.user.first_name} {session.user.last_name} -{" "}
|
|
{session.user.role.includes("admin") ? "Admin" : ""}
|
|
{session.user.role.includes("TEACHERS") ? "Teacher" : ""}
|
|
{session.user.role.includes("STUDENTS") ? "Student" : ""}
|
|
</span>
|
|
</div>
|
|
<div className='cursor-pointer text-white/80 hover:text-white'>
|
|
<span onClick={() => signOut()}>Logout</span>
|
|
</div>
|
|
</div>
|
|
) : (
|
|
<div className='cursor-pointer text-white/80 hover:text-white'>
|
|
<span onClick={() => signIn("keycloak", { callbackUrl: "/" })}>
|
|
Login
|
|
</span>
|
|
</div>
|
|
)}
|
|
</div>
|
|
<Sidebar isOpen={isSidebarOpen} onClose={() => setIsSidebarOpen(false)} />
|
|
</>
|
|
);
|
|
}
|