import { handleLogout } from "@/app/admin/actions";
import AdminPasswordForm from "@/components/admin/AdminPasswordForm";
import { requireAdminSession } from "@/lib/auth";
import { KeyRound, LogOut, ShieldCheck } from "lucide-react";

export const revalidate = 0;

export default async function AdminPasswordPage() {
  const session = await requireAdminSession({ allowPasswordChange: true });

  return (
    <main className="grid min-h-screen place-items-center bg-surface-0 px-5 py-10 text-fg-primary">
      <section className="w-full max-w-xl rounded-[2rem] border border-border bg-surface-1/75 p-7 shadow-2xl md:p-10">
        <div className="mb-8 flex items-start justify-between gap-5 border-b border-border pb-6">
          <div>
            <div className="mb-3 flex items-center gap-2 text-ember"><ShieldCheck size={18} /><span className="text-[10px] font-semibold uppercase tracking-[0.2em]">Güvenli hesap</span></div>
            <h1 className="text-3xl font-semibold tracking-[-0.03em]">Parolanızı yönetin</h1>
            <p className="mt-2 text-sm text-fg-secondary">{session.user.displayName} · @{session.user.username}</p>
          </div>
          <KeyRound className="text-fg-muted" />
        </div>
        <AdminPasswordForm forced={session.user.mustChangePassword} />
        <form action={handleLogout} className="mt-5">
          <button type="submit" className="flex w-full items-center justify-center gap-2 rounded-full border border-border px-5 py-3 text-[10px] font-semibold uppercase tracking-[0.15em] text-fg-secondary">
            Çıkış yap <LogOut size={13} />
          </button>
        </form>
      </section>
    </main>
  );
}
