diff options
Diffstat (limited to 'makima/frontend/src/components/NavStrip.tsx')
| -rw-r--r-- | makima/frontend/src/components/NavStrip.tsx | 33 |
1 files changed, 29 insertions, 4 deletions
diff --git a/makima/frontend/src/components/NavStrip.tsx b/makima/frontend/src/components/NavStrip.tsx index 4e90d4d..806f0c5 100644 --- a/makima/frontend/src/components/NavStrip.tsx +++ b/makima/frontend/src/components/NavStrip.tsx @@ -1,3 +1,4 @@ +import { useAuth } from "../contexts/AuthContext"; import { RewriteLink } from "./RewriteLink"; interface NavLink { @@ -10,12 +11,17 @@ interface NavLink { const NAV_LINKS: NavLink[] = [ { label: "Listen", href: "/listen" }, { label: "Files", href: "/files" }, - { label: "Mesh", href: "/mesh", disabled: true }, - { label: "Register", href: "/register", disabled: true }, - { label: "Login", href: "/login", disabled: true }, + { label: "Mesh", href: "/mesh" }, ]; export function NavStrip() { + const { isAuthenticated, isAuthConfigured, signOut, user } = useAuth(); + + const handleSignOut = async () => { + await signOut(); + window.location.href = "/login"; + }; + return ( <nav className="flex items-center gap-2.5 px-3 py-2.5 border-t border-b border-dashed border-[rgba(117,170,252,0.35)] bg-[#0c1729] font-mono uppercase tracking-wide text-[11px]" @@ -24,7 +30,7 @@ export function NavStrip() { <span className="text-[#9bc3ff] pr-2.5 border-r border-[rgba(117,170,252,0.35)]"> NAV// </span> - <div className="flex flex-wrap gap-2 items-center"> + <div className="flex flex-wrap gap-2 items-center flex-1"> {NAV_LINKS.map((link) => ( <RewriteLink key={link.label} @@ -36,6 +42,25 @@ export function NavStrip() { </RewriteLink> ))} </div> + <div className="flex items-center gap-2 pl-2.5 border-l border-[rgba(117,170,252,0.35)]"> + {isAuthenticated && isAuthConfigured ? ( + <> + {user?.email && ( + <span className="text-[#9bc3ff] opacity-60">{user.email}</span> + )} + <RewriteLink to="/settings">Settings</RewriteLink> + <button + type="button" + onClick={handleSignOut} + className="bg-transparent border-none text-[#9bc3ff] hover:text-white transition-colors cursor-pointer uppercase text-[11px] font-mono tracking-wide p-0" + > + Logout + </button> + </> + ) : ( + <RewriteLink to="/login">Login</RewriteLink> + )} + </div> </nav> ); } |
