import { notFound } from "next/navigation";

import { getBlog } from "@/services/blogs";
import BlogDetailClient from "./BlogDetailClient";
import BlogDetailSchema from "@/components/schema/BlogDetailSchema";

export const dynamic = "force-dynamic";

export async function generateMetadata({
  params,
}: {
  params: {
    slug: string;
  };
}) {
  const response = await getBlog(params.slug);

  if (!response?.data) {
    return {};
  }

  const blog = response.data;

  return {
    title:
      blog.seoTitle ||
      blog.title,

    description:
      blog.metaDescription ||
      blog.excerpt,

    keywords:
      blog.metaKeywords?.join(", "),

    alternates: {
      canonical:
        blog.canonicalUrl,
    },

    openGraph: {
      title:
        blog.ogTitle ||
        blog.seoTitle ||
        blog.title,

      description:
        blog.ogDescription ||
        blog.metaDescription ||
        blog.excerpt,

      url:
        blog.canonicalUrl,

      siteName:
        "The Grand Heritage Resorts",

      images: blog.ogImage
        ? [
            {
              url:
                blog.ogImage,

              alt:
                blog.ogImageAlt ||
                blog.title,

              title:
                blog.ogImageTitle ||
                blog.title,
            },
          ]
        : [],

      locale: "en_IN",
    },
  };
}

export default async function BlogDetailPage({
  params,
}: {
  params: {
    slug: string;
  };
}) {
  const response =
    await getBlog(params.slug);

  if (!response?.data) {
    notFound();
  }

  const blog = response.data;

  return (
    <>
      <BlogDetailSchema blog={blog} />

      <BlogDetailClient blog={blog} />
    </>
  );
}