import BespokeHero from "@/sections/bespoke/BespokeHero";
import BespokeContent from "@/sections/bespoke/BespokeContent";
import { fetchBespokePage } from "@/utils/strapi";
import type { Metadata } from "next";
import { getStrapiImageUrl } from "@/utils/getStrapiUrl";

const BASE_URL =
  process.env.NEXT_PUBLIC_BASE_URL ||
  process.env.NEXT_PUBLIC_SITE_URL ||
  (process.env.NODE_ENV === "production"
    ? "https://navana-realestate.com"
    : "http://localhost:3000");

const BESPOKE_META_DESCRIPTION =
  "NREL Bespoke offers tailor-made interior solutions, crafted to reflect your unique lifestyle and aspirations.";

export async function generateMetadata(): Promise<Metadata> {
  try {
    const bespokeData = await fetchBespokePage();
    const seo = bespokeData?.seo;
    const title = seo?.title ?? "Bespoke | Navana Real Estate";
    const description =
      seo?.description ?? bespokeData?.heroDescription ?? BESPOKE_META_DESCRIPTION;
    const imageUrl =
      seo?.imageUrl ??
      bespokeData?.heroDesktopBigImageUrl ??
      bespokeData?.heroDesktopSmallImageUrl;
    const resolvedImageUrl = imageUrl ? getStrapiImageUrl(imageUrl) : undefined;

    return {
      metadataBase: new URL(BASE_URL),
      title,
      description,
      ...(seo?.keywords && { keywords: seo.keywords }),
      openGraph: {
        title,
        description,
        url: `${BASE_URL}/bespoke`,
        type: "website",
        ...(resolvedImageUrl && {
          images: [
            { url: resolvedImageUrl, width: 1200, height: 630, alt: title },
          ],
        }),
      },
      twitter: {
        card: "summary_large_image",
        title,
        description,
        ...(resolvedImageUrl && { images: [resolvedImageUrl] }),
      },
      alternates: { canonical: `${BASE_URL}/bespoke` },
    };
  } catch {
    return {
      metadataBase: new URL(BASE_URL),
      title: "Bespoke | Navana Real Estate",
      description: BESPOKE_META_DESCRIPTION,
      openGraph: {
        title: "Bespoke | Navana Real Estate",
        description: BESPOKE_META_DESCRIPTION,
        url: `${BASE_URL}/bespoke`,
        type: "website",
      },
      twitter: {
        card: "summary_large_image",
        title: "Bespoke | Navana Real Estate",
        description: BESPOKE_META_DESCRIPTION,
      },
      alternates: { canonical: `${BASE_URL}/bespoke` },
    };
  }
}

const BespokePage = async () => {
  const bespokeData = await fetchBespokePage();

  return (
    <>
      <BespokeHero bespokeData={bespokeData} />
      <BespokeContent bespokeData={bespokeData} />
    </>
  );
};

export default BespokePage;