working auth

2025-12-03 10:50:25 -05:00
parent 3e3e0b0466
commit 606b926886
389 changed files with 2793 additions and 12188 deletions
@@ -0,0 +1,104 @@
+// app/login/page.tsx
+"use client";
+
+import { FormEvent, useState } from "react";
+import { useRouter, useSearchParams } from "next/navigation";
+import Link from "next/link";
+import { useAuth } from "@/context/AuthContext";
+
+export default function LoginPage() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+  const { login, loading } = useAuth();
+
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+
+  const next = searchParams.get("next") || "/gunbuilder";
+
+  async function handleSubmit(e: FormEvent) {
+    e.preventDefault();
+    setError(null);
+
+    try {
+      await login({ email, password });
+      router.push(next);
+    } catch (err: any) {
+      setError(err.message ?? "Failed to log in");
+    }
+  }
+
+  return (
+    <main className="min-h-screen bg-black text-zinc-50">
+      <div className="mx-auto flex max-w-md flex-col px-4 py-10">
+        <h1 className="text-2xl font-semibold tracking-tight">
+          Log In to <span className="text-amber-300">The Armory</span>
+        </h1>
+        <p className="mt-2 text-sm text-zinc-400">
+          Use your beta credentials to get back to your saved builds.
+        </p>
+
+        <form onSubmit={handleSubmit} className="mt-6 space-y-4">
+          {error && (
+            <div className="rounded-md border border-red-500/40 bg-red-500/10 px-3 py-2 text-sm text-red-200">
+              {error}
+            </div>
+          )}
+
+          <div className="space-y-1">
+            <label className="text-xs font-medium text-zinc-400" htmlFor="email">
+              Email
+            </label>
+            <input
+              id="email"
+              type="email"
+              autoComplete="email"
+              required
+              className="w-full rounded-md border border-zinc-800 bg-zinc-900/70 px-3 py-2 text-sm text-zinc-50 focus:outline-none focus:ring-1 focus:ring-amber-400"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+            />
+          </div>
+
+          <div className="space-y-1">
+            <label
+              className="text-xs font-medium text-zinc-400"
+              htmlFor="password"
+            >
+              Password
+            </label>
+            <input
+              id="password"
+              type="password"
+              autoComplete="current-password"
+              required
+              className="w-full rounded-md border border-zinc-800 bg-zinc-900/70 px-3 py-2 text-sm text-zinc-50 focus:outline-none focus:ring-1 focus:ring-amber-400"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+            />
+          </div>
+
+          <button
+            type="submit"
+            disabled={loading}
+            className="mt-2 w-full rounded-md border border-amber-400/70 bg-amber-400/20 px-3 py-2 text-sm font-semibold text-amber-100 hover:bg-amber-400/30 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+          >
+            {loading ? "Signing in…" : "Log In"}
+          </button>
+        </form>
+
+        <p className="mt-4 text-xs text-zinc-500">
+          New here?{" "}
+          <Link
+            href="/register"
+            className="text-amber-300 hover:text-amber-200"
+          >
+            Join the beta
+          </Link>
+          .
+        </p>
+      </div>
+    </main>
+  );
+}