import { redirect } from "next/navigation";

import { login, getCurrentUser, isAdmin } from "@/lib/auth";

export const dynamic = "force-dynamic";

export const metadata = { title: "Admin · Stepping", robots: { index: false } };

export default async function AdminLogin({

  searchParams,

}: {

  searchParams: Promise<{ error?: string }>;

}) {

  const { error } = await searchParams;

  if (isAdmin(await getCurrentUser())) redirect("/admin");

  async function doLogin(formData: FormData) {

    "use server";

    const email = String(formData.get("email") ?? "");

    const password = String(formData.get("password") ?? "");

    const ok = await login(email, password);

    redirect(ok ? "/admin" : "/admin/login?error=1");

  }

  return (

    <main className="mx-auto flex min-h-[100svh] w-full max-w-md flex-col justify-center px-6">

      <p className="kicker text-ash">Stepping</p>

      <h1 className="display mt-2 text-5xl">Admin</h1>

      <p className="serif mt-3 text-lg text-ash">Sign in to manage the platform.</p>

      {error ? (

        <p className="kicker mt-6 border border-gold px-4 py-3 text-gold">

          Wrong email or password.

        </p>

      ) : null}

      <form action={doLogin} className="mt-8 flex flex-col gap-4">

        <input

          name="email"

          type="email"

          required

          autoComplete="username"

          placeholder="Email"

          className="serif border-b border-[var(--line)] bg-transparent py-3 text-xl text-bone outline-none placeholder:text-ash focus:border-gold"

        />

        <input

          name="password"

          type="password"

          required

          autoComplete="current-password"

          placeholder="Password"

          className="serif border-b border-[var(--line)] bg-transparent py-3 text-xl text-bone outline-none placeholder:text-ash focus:border-gold"

        />

        <button

          type="submit"

          className="kicker mt-4 bg-gold px-6 py-4 text-stage hover:bg-gold-bright"

        >

          Sign in

        </button>

      </form>

    </main>

  );

}