43 lines
1.0 KiB
TypeScript
43 lines
1.0 KiB
TypeScript
const loggedOutLinks = [
|
|
{ href: "/", label: "Home" },
|
|
{ href: "/sign-in", label: "Sign in" },
|
|
{ href: "/sign-up", label: "Sign up" },
|
|
];
|
|
|
|
const loggedInLinks = [
|
|
{ href: "/", label: "Home" },
|
|
{ href: "/dashboard", label: "Dashboard" },
|
|
];
|
|
|
|
export interface Props {
|
|
loggedIn: boolean;
|
|
}
|
|
|
|
export default function Header(props: Props) {
|
|
const links = props.loggedIn ? loggedInLinks : loggedOutLinks;
|
|
|
|
return (
|
|
<div class="navbar bg-base-100 shadow-sm">
|
|
<div class="flex-1">
|
|
<a class="btn btn-ghost text-xl">daisyUI</a>
|
|
</div>
|
|
<div class="flex-none">
|
|
<ul class="menu menu-horizontal px-1">
|
|
{links.map((l) => (
|
|
<li key={l.href}>
|
|
<a href={l.href}>{l.label}</a>
|
|
</li>
|
|
))}
|
|
{props.loggedIn && (
|
|
<li>
|
|
<form method="post" action="/sign-out">
|
|
<button type="submit">Sign out</button>
|
|
</form>
|
|
</li>
|
|
)}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|