37 lines
1.6 KiB
TypeScript
37 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
import { browserFetch } from "../lib/api";
|
|
import { notifyAuthChanged } from "../lib/authEvents";
|
|
|
|
export default function RegisterForm({ redirectTo = "/account" }: { redirectTo?: string }) {
|
|
const [error, setError] = useState("");
|
|
const [form, setForm] = useState({ fullName: "", email: "", password: "" });
|
|
|
|
async function onSubmit(event: React.FormEvent<HTMLFormElement>) {
|
|
event.preventDefault();
|
|
setError("");
|
|
try {
|
|
await browserFetch("/auth/register", {
|
|
method: "POST",
|
|
body: JSON.stringify(form)
|
|
});
|
|
notifyAuthChanged("login");
|
|
window.location.href = redirectTo;
|
|
} catch (submitError) {
|
|
setError(submitError instanceof Error ? submitError.message : "No se pudo crear la cuenta");
|
|
}
|
|
}
|
|
|
|
return (
|
|
<form className="stack" onSubmit={onSubmit}>
|
|
<input className="field" placeholder="Nombre completo" value={form.fullName} onChange={(event) => setForm((current) => ({ ...current, fullName: event.target.value }))} required />
|
|
<input className="field" type="email" placeholder="Correo" value={form.email} onChange={(event) => setForm((current) => ({ ...current, email: event.target.value }))} required />
|
|
<input className="field" type="password" placeholder="Contrasena" value={form.password} onChange={(event) => setForm((current) => ({ ...current, password: event.target.value }))} required />
|
|
<button className="button button-primary" type="submit">Crear cuenta</button>
|
|
{error ? <p className="muted">{error}</p> : null}
|
|
</form>
|
|
);
|
|
}
|