registration bug fixes

app/auth/sign-up/sign-up.tsx

@@ -9,7 +9,7 @@ type Props = { nextPath?: string };
 export default function SignUp({ nextPath = "/portal" }: Props) {
     const router = useRouter();
     const [username, setUsername] = useState("");
-    const [email, setEmail] = useState(""); // optional if your backend allows
+    const [email, setEmail] = useState("");
     const [password, setPassword] = useState("");
     const [showPassword, setShowPassword] = useState(false);
     const [loading, setLoading] = useState(false);
@@ -38,8 +38,15 @@ export default function SignUp({ nextPath = "/portal" }: Props) {
                 const res = await fetch("/api/auth/register", {
                     method: "POST",
                     credentials: "include",
-                    headers: { "Content-Type": "application/json", Accept: "application/json" },
+                    headers: {
-                    body: JSON.stringify({ username: u, email: em || undefined, password: pw }),
+                        "Content-Type": "application/json",
+                        Accept: "application/json",
+                    },
+                    body: JSON.stringify({
+                        username: u,
+                        email: em || undefined,
+                        password: pw,
+                    }),
                 });
 
                 const txt = await res.text();
@@ -58,7 +65,7 @@ export default function SignUp({ nextPath = "/portal" }: Props) {
                     throw new Error(message);
                 }
 
-                // If the server has AUTO_LOGIN on, user is already signed in here.
+                // If AUTO_LOGIN is enabled on the server, the user is already signed in.
                 router.replace(nextPath);
                 router.refresh();
             } catch (e: any) {
@@ -68,12 +75,14 @@ export default function SignUp({ nextPath = "/portal" }: Props) {
             }
         },
         [username, email, password, nextPath, router]
-    );
+    ); // <-- make sure this closing ); is present
 
     return (
         <div className="mx-auto max-w-md rounded-lg border p-6">
         <h1 className="mb-1 text-2xl font-semibold">Create Account</h1>
-        <p className="mb-6 text-sm opacity-70">Join MakerDash to manage rigs, settings, and projects.</p>
+        <p className="mb-6 text-sm opacity-70">
+        Join MakerDash to manage rigs, settings, and projects.
+        </p>
 
         <form className="space-y-4" onSubmit={onSubmit}>
         <div className="space-y-1">
@@ -108,4 +117,45 @@ export default function SignUp({ nextPath = "/portal" }: Props) {
         <label className="text-sm font-medium">Password</label>
         <button
         type="button"
-        className="text-xs opaci
+        className="text-xs opacity-70 hover:opacity-100"
+        onClick={() => setShowPassword((s) => !s)}
+        >
+        {showPassword ? "Hide" : "Show"}
+        </button>
+        </div>
+        <input
+        type={showPassword ? "text" : "password"}
+        autoComplete="new-password"
+        className="w-full rounded-md border px-3 py-2"
+        placeholder="Choose a strong password"
+        value={password}
+        onChange={(e) => setPassword(e.currentTarget.value)}
+        required
+        minLength={8}
+        />
+        </div>
+
+        {err && (
+            <div className="rounded-md border border-red-300 bg-red-50 px-3 py-2 text-sm text-red-700">
+            {err}
+            </div>
+        )}
+
+        <button
+        type="submit"
+        disabled={loading}
+        className="w-full rounded-md bg-black px-3 py-2 text-white disabled:opacity-60"
+        >
+        {loading ? "Creating account…" : "Sign Up"}
+        </button>
+        </form>
+
+        <div className="mt-4 text-center text-sm">
+        <span className="opacity-70">Already have an account?</span>{" "}
+        <a className="underline" href={`/auth/sign-in?next=${encodeURIComponent(nextPath)}`}>
+        Sign in
+        </a>
+        </div>
+        </div>
+    );
+}