import FacilitySearch from "@/app/FacilitySearch";
import { API_URL } from "@/config/constants";
import {
  createBreadcrumbJsonLd,
  createCollectionPageJsonLd,
  createItemListJsonLd,
  createPageMetadata,
} from "@/app/seo";

export const dynamic = "force-dynamic";

const pageTitle = "Golfbaner i Norge";
const pageDescription =
  "Finn golfbaner i Norge og filtrer på område, banestatus, antall hull og fasiliteter i TeeOffs samlede oversikt.";

export const metadata = createPageMetadata({
  title: pageTitle,
  description: pageDescription,
  path: "/golfbaner",
});

export default async function GolfCoursesIndexPage() {
  let facilities = [];

  try {
    const res = await fetch(`${API_URL}/facilities`, {
      next: { revalidate: 0 },
      cache: "no-store",
    });

    if (!res.ok) {
      throw new Error(`API returnerte status ${res.status}`);
    }

    facilities = await res.json();
  } catch (error) {
    console.error("Kritisk feil ved henting av golfbaner:", error);
    facilities = [];
  }

  const safeData = Array.isArray(facilities) ? facilities : [];
  const collectionJsonLd = createCollectionPageJsonLd({
    name: pageTitle,
    description: pageDescription,
    path: "/golfbaner",
  });
  const itemListJsonLd = createItemListJsonLd({
    name: pageTitle,
    path: "/golfbaner",
    items: safeData
      .filter((facility) => facility?.slug && facility?.name)
      .map((facility) => ({
        name: facility.name,
        path: `/golfbaner/${facility.slug}`,
        description: facility.description,
      })),
  });
  const breadcrumbJsonLd = createBreadcrumbJsonLd([
    { name: "Hjem", path: "/" },
    { name: "Golfbaner", path: "/golfbaner" },
  ]);

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(collectionJsonLd) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(itemListJsonLd) }}
      />
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(breadcrumbJsonLd) }}
      />
      <main className="site-shell min-h-screen">
        <FacilitySearch
          initialFacilities={safeData}
          variant="catalog"
          eyebrow="Golfbaner"
          title="Golfbaner i Norge"
          intro="Filtrer norske golfbaner etter område, banestatus, antall hull og fasiliteter, og gå videre til hver baneprofil."
        />
      </main>
    </>
  );
}