pull lino
This commit is contained in:
@@ -1,124 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import "../styles/layout/login.scss"; // puedes usar los mismos estilos
|
||||
import "../styles/base/globales.scss";
|
||||
|
||||
import Link from "next/link";
|
||||
import axios from "axios";
|
||||
import { useRouter } from "next/navigation";
|
||||
import toast from "react-hot-toast";
|
||||
|
||||
function CrearCuenta() {
|
||||
const [nombre, setNombre] = useState("");
|
||||
const [correo, setCorreo] = useState("");
|
||||
const [password, setPassword] = useState("");
|
||||
const [confirmarPassword, setConfirmarPassword] = useState("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (password !== confirmarPassword) {
|
||||
toast.error("Las contraseñas no coinciden");
|
||||
return;
|
||||
}
|
||||
|
||||
setLoading(true);
|
||||
|
||||
try {
|
||||
const response = await axios.post(
|
||||
`${process.env.NEXT_PUBLIC_API_URL}/auth/register`,
|
||||
{
|
||||
nombre,
|
||||
correo,
|
||||
contraseña: password,
|
||||
}
|
||||
);
|
||||
|
||||
toast.success("Cuenta creada correctamente");
|
||||
router.push("/"); // redirige al login
|
||||
} catch (err: unknown) {
|
||||
if (axios.isAxiosError(err)) {
|
||||
if (err.response) {
|
||||
toast.error(
|
||||
err.response.data?.message || "Error al crear la cuenta"
|
||||
);
|
||||
} else if (err.request) {
|
||||
toast.error("No se pudo conectar con el servidor");
|
||||
} else {
|
||||
toast.error("Ocurrió un error inesperado");
|
||||
}
|
||||
} else {
|
||||
toast.error("Ocurrió un error inesperado");
|
||||
}
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
return (
|
||||
<section className="containerGrid">
|
||||
<div className="login-container">
|
||||
<h2>Crear cuenta</h2>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<label>Nombre de usuario</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Escribe tu nombre"
|
||||
value={nombre}
|
||||
onChange={(e) => setNombre(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Correo electrónico</label>
|
||||
<input
|
||||
type="email"
|
||||
placeholder="Tu correo"
|
||||
value={correo}
|
||||
onChange={(e) => setCorreo(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Contraseña</label>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Crea una contraseña"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Confirmar contraseña</label>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Repite tu contraseña"
|
||||
value={confirmarPassword}
|
||||
onChange={(e) => setConfirmarPassword(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? "Creando cuenta..." : "Registrarse"}
|
||||
</button>
|
||||
|
||||
<Link href="/">¿Ya tienes cuenta? Inicia sesión</Link>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
);
|
||||
}
|
||||
export default CrearCuenta;
|
||||
@@ -1,80 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import axios from "axios";
|
||||
import { useRouter } from "next/navigation";
|
||||
import toast from "react-hot-toast";
|
||||
import "../styles/base/globales.scss"; // ajusta ruta si tu proyecto la tiene en otro sitio
|
||||
|
||||
export default function ForgotPasswordPage() {
|
||||
const [email, setEmail] = useState("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
const router = useRouter();
|
||||
|
||||
const validateEmail = (e: string) => {
|
||||
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(e);
|
||||
};
|
||||
|
||||
const handleSubmit = async (ev: React.FormEvent<HTMLFormElement>) => {
|
||||
ev.preventDefault();
|
||||
if (!validateEmail(email)) {
|
||||
toast.error("Ingresa un correo válido.");
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
setLoading(true);
|
||||
const res = await axios.post("/api/auth/forgot-password", { email });
|
||||
if (res.status === 200) {
|
||||
toast.success("Si existe esa cuenta, recibirás un correo con instrucciones.");
|
||||
// Opcional: redirigir al login después de enviar
|
||||
setTimeout(() => router.push("/"), 1200);
|
||||
} else {
|
||||
toast.error("Ocurrió un error. Intenta de nuevo.");
|
||||
}
|
||||
} catch (error:any ) {
|
||||
// manejar mensajes de error desde el servidor si vienen
|
||||
const msg = error?.response?.data?.message ?? "Error al enviar el correo.";
|
||||
toast.error(msg);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<main className="forgot-password-page" style={{ maxWidth: 520, margin: "4rem auto", padding: "1.5rem" }}>
|
||||
<h1>¿Olvidaste tu contraseña?</h1>
|
||||
<p>Escribe el correo asociado a tu cuenta y te enviaremos instrucciones para restablecerla.</p>
|
||||
|
||||
<form onSubmit={handleSubmit} className="forgot-form" style={{ display: "grid", gap: 12 }}>
|
||||
<label htmlFor="email">Correo electrónico</label>
|
||||
<input
|
||||
id="email"
|
||||
type="email"
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
placeholder="tu@correo.com"
|
||||
required
|
||||
style={{ padding: "0.6rem", borderRadius: 8, border: "1px solid #ccc" }}
|
||||
/>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading}
|
||||
style={{
|
||||
padding: "0.7rem 1rem",
|
||||
borderRadius: 8,
|
||||
border: "none",
|
||||
cursor: loading ? "not-allowed" : "pointer"
|
||||
}}
|
||||
>
|
||||
{loading ? "Enviando..." : "Enviar instrucciones"}
|
||||
</button>
|
||||
|
||||
<div style={{ marginTop: 8 }}>
|
||||
<a href="/">Recordé mi contraseña — Iniciar sesión</a>
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user