auth, trips and join trips

2026-04-16 14:51:54 +07:00
parent de0d1c5413
commit 237caad488
49 changed files with 11343 additions and 334 deletions
@@ -0,0 +1,73 @@
+"use client";
+
+import Link from "next/link";
+import { useSession, signOut } from "next-auth/react";
+
+export function Navbar() {
+  const { data: session } = useSession();
+
+  return (
+    <nav className="sticky top-0 z-40 border-b border-neutral-200 bg-white/90 backdrop-blur-md">
+      <div className="mx-auto flex h-14 max-w-6xl items-center justify-between px-4">
+        <Link href="/" className="flex items-center gap-1.5">
+          <span className="flex h-7 w-7 items-center justify-center rounded-lg bg-primary-600 text-xs font-bold text-white">
+            S
+          </span>
+          <span className="text-lg font-bold text-neutral-800">
+            Se<span className="text-primary-600">Trip</span>
+          </span>
+        </Link>
+
+        <div className="flex items-center gap-1">
+          <Link
+            href="/trips"
+            className="rounded-lg px-3 py-1.5 text-sm font-medium text-neutral-600 transition-colors hover:bg-neutral-100 hover:text-neutral-800"
+          >
+            Open Trip
+          </Link>
+
+          {session?.user ? (
+            <>
+              <Link
+                href="/create-trip"
+                className="rounded-lg px-3 py-1.5 text-sm font-medium text-neutral-600 transition-colors hover:bg-neutral-100 hover:text-neutral-800"
+              >
+                Buat Trip
+              </Link>
+
+              <div className="ml-2 flex items-center gap-2">
+                <div className="flex h-8 w-8 items-center justify-center rounded-full bg-primary-600 text-xs font-bold text-white">
+                  {session.user.name?.charAt(0).toUpperCase()}
+                </div>
+                <span className="hidden text-sm font-medium text-neutral-700 sm:block">
+                  {session.user.name}
+                </span>
+                <button
+                  onClick={() => signOut()}
+                  className="rounded-lg px-2.5 py-1.5 text-sm font-medium text-neutral-500 transition-colors hover:bg-neutral-100 hover:text-neutral-700"
+                >
+                  Logout
+                </button>
+              </div>
+            </>
+          ) : (
+            <>
+              <Link
+                href="/login"
+                className="rounded-lg px-3 py-1.5 text-sm font-medium text-neutral-600 transition-colors hover:bg-neutral-100 hover:text-neutral-800"
+              >
+                Login
+              </Link>
+              <Link
+                href="/register"
+                className="ml-1 rounded-lg bg-primary-600 px-4 py-1.5 text-sm font-semibold text-white transition-colors hover:bg-primary-700"
+              >
+                Daftar
+              </Link>
+            </>
+          )}
+        </div>
+      </div>
+    </nav>
+  );
+}