auth-cookies build error fix

app/auth/sign-in/page.tsx

@@ -1,58 +1,80 @@
-// app/app/auth/sign-in/page.tsx
+// app/auth/sign-in/page.tsx
 "use client";
 
+import { useRouter, useSearchParams } from "next/navigation";
 import { useState } from "react";
-import { useRouter } from "next/navigation";
 
 export default function SignInPage() {
-    const r = useRouter();
-    const [identifier, setIdentifier] = useState("");
+    const router = useRouter();
+    const search = useSearchParams();
+    const nextUrl = search.get("next") || "/my/rigs";
+
+    const [identity, setIdentity] = useState("");
     const [password, setPassword] = useState("");
     const [busy, setBusy] = useState(false);
-    const [err, setErr] = useState<string | null>(null);
 
-    async function submit() {
-        setBusy(true); setErr(null);
+    async function onSubmit(e: React.FormEvent) {
+        e.preventDefault();
+        setBusy(true);
         try {
             const res = await fetch("/api/auth/login", {
                 method: "POST",
                 headers: { "Content-Type": "application/json" },
-                body: JSON.stringify({ identifier: identifier.trim(), password }),
+                credentials: "include", // ensure Set-Cookie is honored everywhere
+                body: JSON.stringify({ identity, password }),
             });
-            const j = await res.json();
+            const j = await res.json().catch(() => null);
             if (!res.ok) throw new Error(j?.error || "Login failed");
-            r.replace("/my/rigs");
-        } catch (e: any) {
-            setErr(e?.message || "Error");
+            router.replace(nextUrl);
+        } catch (err) {
+            alert((err as Error).message);
         } finally {
             setBusy(false);
         }
     }
 
     return (
-        <div className="max-w-md mx-auto p-6 space-y-4">
-        <h1 className="text-2xl font-semibold">Sign In</h1>
-        <label className="block">
-        <div className="text-sm mb-1">Username or Email</div>
-        <input className="w-full border rounded px-3 py-2" value={identifier}
-        onChange={e=>setIdentifier(e.target.value)} />
-        </label>
-        <label className="block">
-        <div className="text-sm mb-1">Password</div>
-        <input type="password" className="w-full border rounded px-3 py-2" value={password}
-        onChange={e=>setPassword(e.target.value)} />
-        </label>
-
-        {err && <div className="text-sm text-red-600">{err}</div>}
-
-        <button disabled={busy || !identifier || !password} onClick={submit}
-        className="px-3 py-2 rounded bg-black text-white disabled:opacity-50">
-        {busy ? "Signing in..." : "Sign in"}
-        </button>
-
-        <div className="text-sm">
-        No account? <a href="/auth/sign-up" className="underline">Create one</a>
+        <div className="max-w-md mx-auto p-6">
+        <h1 className="text-xl font-semibold mb-4">Sign in</h1>
+        <form onSubmit={onSubmit} className="space-y-3">
+        <div>
+        <label className="block text-sm mb-1">Username or Email</label>
+        <input
+        className="w-full border rounded px-3 py-2 bg-background"
+        value={identity}
+        onChange={(e) => setIdentity(e.target.value)}
+        autoComplete="username"
+        required
+        />
         </div>
+        <div>
+        <label className="block text-sm mb-1">Password</label>
+        <input
+        type="password"
+        className="w-full border rounded px-3 py-2 bg-background"
+        value={password}
+        onChange={(e) => setPassword(e.target.value)}
+        autoComplete="current-password"
+        required
+        />
+        </div>
+        <button
+        disabled={busy}
+        className="px-3 py-2 rounded bg-primary text-primary-foreground disabled:opacity-50"
+        >
+        {busy ? "Signing in…" : "Sign in"}
+        </button>
+        </form>
+
+        <p className="text-sm mt-4">
+        Don’t have an account?{" "}
+        <a
+        className="underline"
+        href={`/auth/sign-up?next=${encodeURIComponent(nextUrl)}`}
+        >
+        Sign up
+        </a>
+        </p>
         </div>
     );
 }