summaryrefslogtreecommitdiff
path: root/makima/frontend/src/components/NavStrip.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'makima/frontend/src/components/NavStrip.tsx')
-rw-r--r--makima/frontend/src/components/NavStrip.tsx33
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>
);
}