feat(frontend): sidebar migration started

This commit is contained in:
2025-09-23 20:54:28 -05:00
parent cb2e6252e0
commit bee436d341
57 changed files with 2608 additions and 359 deletions

View File

@@ -1,29 +1,80 @@
import { Link } from "@tanstack/react-router";
import { useAuth, useLogout } from "../../lib/authClient";
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "../ui/dropdown-menu";
import { ModeToggle } from "../mode-toggle";
import { Button } from "../ui/button";
export default function Nav() {
const { session } = useAuth();
const logout = useLogout();
return (
<nav>
{session?.session ? (
<>
<Button
onClick={() => {
logout();
}}
>
Sign Out
</Button>
</>
) : (
<>
<Button>
<Link to="/login">Login</Link>
</Button>
</>
)}
<nav className="flex justify-end w-full shadow ">
<div className="m-2 flex flex-row gap-1">
<div className="m-1">
<ModeToggle />
</div>
{/* <div className="mr-1 ml-1">
{settings.length > 0 && (
<a
href={`https://${server[0].value}.alpla.net/lst/d`}
target="_blank"
>
LST - Docs |
</a>
)}
</div> */}
{session ? (
<div className="m-1">
<DropdownMenu>
<DropdownMenuTrigger>
<Avatar>
<AvatarImage
src="https://github.com/evilrabbit.png"
alt="@evilrabbit"
/>
<AvatarFallback>CN</AvatarFallback>
</Avatar>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuLabel>
Hello {session.user?.username}
</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuItem>
{/* <Link to="/passwordChange">
Password Change
</Link> */}
</DropdownMenuItem>
{/* <DropdownMenuItem>Billing</DropdownMenuItem>
<DropdownMenuItem>Team</DropdownMenuItem>
<DropdownMenuItem>Subscription</DropdownMenuItem> */}
<hr className="solid"></hr>
<DropdownMenuItem>
<div className="m-auto">
<button onClick={() => logout()}>
Logout
</button>
</div>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
) : (
<div className="m-1">
<Button>
<Link to="/login">Login</Link>
</Button>
</div>
)}
</div>
</nav>
);
}