nextjs-rewrite (#5)

Reviewed-on: #5 Co-authored-by: David Gwilliam <dhgwilliam@gmail.com> Co-committed-by: David Gwilliam <dhgwilliam@gmail.com>
2026-03-30 02:30:13 +00:00
parent 1a9b3496e1
commit 123df671f5
160 changed files with 19293 additions and 1180 deletions
@@ -0,0 +1,98 @@
+"use client"
+
+import Link from "next/link"
+import { useSession } from "./SessionProvider"
+import { authClient } from "@/lib/auth-client"
+import { useEffect, useState } from "react"
+
+export default function Navigation() {
+  const { session, loading } = useSession()
+  const [userRole, setUserRole] = useState<string | null>(null)
+
+  useEffect(() => {
+    // Fetch user role from database if session exists
+    if (session?.user?.id) {
+      fetch(`/api/users/${session.user.id}/role`)
+        .then(res => res.json())
+        .then(data => setUserRole(data.role))
+        .catch(() => setUserRole(null));
+    }
+  }, [session]);
+
+  const handleLogout = async () => {
+    await authClient.signOut()
+    window.location.href = '/auth/login'
+  }
+
+  return (
+    <nav className="bg-white shadow-sm">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="flex justify-between h-16">
+          <div className="flex items-center">
+            <Link href="/" className="text-xl font-bold text-gray-900">
+              EuchreCamp
+            </Link>
+            <div className="hidden md:ml-6 md:flex md:space-x-8">
+              <Link
+                href="/rankings"
+                className="border-transparent text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
+              >
+                Rankings
+              </Link>
+              {session && (
+                <>
+                  <Link
+                    href="/admin/tournaments"
+                    className="border-transparent text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
+                  >
+                    Tournaments
+                  </Link>
+                  {userRole === "club_admin" && (
+                    <Link
+                      href="/admin"
+                      className="border-transparent text-gray-500 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
+                    >
+                      Admin
+                    </Link>
+                  )}
+                </>
+              )}
+            </div>
+          </div>
+          <div className="flex items-center">
+            {loading ? (
+              <div className="text-gray-500">Loading...</div>
+            ) : session ? (
+              <div className="flex items-center space-x-4">
+                <span className="text-gray-700 text-sm font-medium">
+                  {session.user?.name || session.user?.email}
+                </span>
+                <button
+                  onClick={handleLogout}
+                  className="text-gray-500 hover:text-gray-700 text-sm font-medium"
+                >
+                  Sign out
+                </button>
+              </div>
+            ) : (
+              <div className="flex items-center space-x-4">
+                <Link
+                  href="/auth/login"
+                  className="text-gray-500 hover:text-gray-700 text-sm font-medium"
+                >
+                  Sign in
+                </Link>
+                <Link
+                  href="/auth/register"
+                  className="bg-green-600 text-white px-3 py-1 rounded-md text-sm font-medium hover:bg-green-700"
+                >
+                  Sign up
+                </Link>
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+    </nav>
+  )
+}