eduproj2/components/layout/Navbar.tsx
2023-08-01 18:53:51 -04:00

49 lines
1.6 KiB
TypeScript

import { createServerComponentClient } from "@supabase/auth-helpers-nextjs";
import { cookies } from "next/headers";
import LogoutButton from "../LogoutButton";
import Link from "next/link";
export default async function Navbar() {
const supabase = createServerComponentClient({ cookies });
const {
data: { user },
} = await supabase.auth.getUser();
return (
<nav className="bp5-navbar bp5-dark">
<div style={{ margin: "0 auto", width: "980px" }}>
<div className="bp5-navbar-group bp5-align-left">
<div className="bp5-navbar-heading">Eduproj</div>
<span className="bp5-navbar-divider"></span>
<Link href="/">
<button className="bp5-button bp5-minimal bp5-icon-home">
Home
</button>
</Link>
<button className="bp5-button bp5-minimal bp5-icon-document">
Docs
</button>
</div>
<div className="bp5-navbar-group bp5-align-right">
{user ? (
<div className="flex items-center gap-4">
Hey, {user.email}!
<LogoutButton />
</div>
) : (
<Link href="/login">
<button className="bp5-button bp5-minimal bp5-icon-user">
Login
</button>
</Link>
)}
<span className="bp5-navbar-divider"></span>
<button className="bp5-button bp5-minimal bp5-icon-notifications"></button>
<button className="bp5-button bp5-minimal bp5-icon-cog"></button>
</div>
</div>
</nav>
);
}