import Link from "next/link";
import { loginAction } from "@/server/actions/auth";

export default async function LoginPage({
  searchParams,
}: {
  searchParams: Promise<{ error?: string }>;
}) {
  const sp = await searchParams;
  return (
    <div className="mx-auto max-w-md">
      <div className="card">
        <h1 className="text-2xl font-semibold">Iniciar sesion</h1>
        <p className="mt-1 text-sm text-white/60">
          Accede con tu cuenta registrada.
        </p>
        {sp.error && (
          <p className="mt-3 rounded-lg bg-red-500/15 px-3 py-2 text-sm text-red-300">
            {sp.error}
          </p>
        )}
        <form action={loginAction} className="mt-6 space-y-4">
          <div>
            <label className="label">Email</label>
            <input className="input" name="email" type="email" required />
          </div>
          <div>
            <label className="label">Password</label>
            <input className="input" name="password" type="password" required />
          </div>
          <button type="submit" className="btn-primary w-full">
            Entrar
          </button>
        </form>
        <p className="mt-4 text-center text-sm text-white/60">
          ¿No tienes cuenta?{" "}
          <Link href="/register" className="text-[var(--lime)]">
            Registrate
          </Link>
        </p>
      </div>
    </div>
  );
}