import { redirect } from "next/navigation";
import { connection } from "next/server";

import { ConstellationImageGenerator } from "@/components/admin/constellation-image-generator";
import { getActiveCatalog } from "@/lib/guides/queries";

export default async function ConstellationImagePage() {
  await connection();

  const catalog = await getActiveCatalog();
  if (!catalog) redirect("/admin?sync=required");

  return (
    <div className="flex flex-col gap-8">
      <header>
        <p className="text-sm font-medium text-primary">Image generator</p>
        <h1 className="font-heading text-3xl font-semibold">สร้างภาพ Constellation</h1>
        <p className="mt-2 text-muted-foreground">
          สร้างกราฟดาเมจ Constellation จาก Catalog โดยไม่บันทึกข้อมูลลง Guide
        </p>
      </header>
      <ConstellationImageGenerator characters={catalog.characters} />
    </div>
  );
}