import { getHorseById } from "@/actions/auction";
import { notFound } from "next/navigation";
import { metaObject } from "@/config/site.config";
import { siteConfig } from "@/config/site.config";
import { getLocale } from "next-intl/server";
import ClientHorseDetails from "@/(pages)/housres/clientHorseDetails";

export async function generateMetadata({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  const locale = await getLocale();
  const isArabic = locale === "ar";
  let title = isArabic ? "تفاصيل الإبل" : "Camel Details";
  let ogImage: string | undefined;

  try {
    const data = await getHorseById(id);
    const name = (data as any)?.title || (data as any)?.name;
    if (name) {
      title = name;
    }
    ogImage =
      (data as any)?.media_files?.main_image?.url ||
      (data as any)?.media_files?.main_image ||
      (data as any)?.image ||
      undefined;
  } catch {
    // ignore metadata fetch errors
  }

  return metaObject(
    title,
    isArabic ? "تفاصيل العرض." : "Listing details.",
    undefined,
    ogImage,
    `/camels/${id}`,
  );
}

export default async function CamelDetailsPage({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  const locale = await getLocale();

  const data = await getHorseById(id);

  if (!data) return notFound();

  const url = new URL(`/${locale}/camels/${id}`, siteConfig.url).toString();
  const title = (data as any)?.title || (data as any)?.name || "Ataya";
  const description = (data as any)?.description || undefined;
  const images: string[] = Array.isArray(
    (data as any)?.media_files?.additional_images,
  )
    ? (data as any).media_files.additional_images
        .map((i: any) => i?.url)
        .filter(Boolean)
    : [];
  const mainImage =
    (data as any)?.media_files?.main_image?.url ||
    (data as any)?.media_files?.main_image ||
    undefined;
  const allImages = [mainImage, ...images].filter(Boolean) as string[];
  const price = (data as any)?.price;
  const currency = "SAR";

  const jsonLd = {
    "@context": "https://schema.org",
    "@type": "Product",
    name: title,
    description,
    image: allImages.length ? allImages : undefined,
    sku: (data as any)?.unique_id
      ? String((data as any)?.unique_id)
      : String(id),
    offers: price
      ? {
          "@type": "Offer",
          priceCurrency: currency,
          price: String(price),
          url,
          availability: "https://schema.org/InStock",
        }
      : undefined,
  };

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
      />
      <ClientHorseDetails data={data} />
    </>
  );
}