Initial Control system

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>
   );
 }