import { signIn } from "@/auth";

export default function LoginPage() {
  return (
    <div className="flex min-h-screen flex-col items-center justify-center gap-10">
      <div className="flex flex-col items-center gap-4">
        {/* eslint-disable-next-line @next/next/no-img-element */}
        <img
          src="/logo.svg"
          alt="KNUR"
          width={160}
          height={160}
          className="rounded-3xl shadow-2xl ring-2 ring-surface"
        />
        <h1 className="text-3xl font-bold tracking-tight text-fg">KNUR</h1>
        <p className="text-sm text-fg/50">
          Książka Notowań Udźwigów i Rezultatów
        </p>
      </div>

      <form
        action={async () => {
          "use server";
          await signIn("keycloak", { redirectTo: "/" });
        }}
      >
        <button
          type="submit"
          className="rounded-lg bg-accent px-8 py-3 text-sm font-semibold text-white transition-opacity hover:opacity-90"
        >
          Zaloguj
        </button>
      </form>
    </div>
  );
}