import ResourceArticle from "@/components/resources/ResourceArticle";
import {
  getAllArticleSlugs,
  getArticleBySlug,
  isIndexableArticleSlug,
} from "@/data/resources-articles";
import { getPageMetadataTitle } from "@/lib/page-titles";
import { localizedUrl, pageAlternates, resolveSeoLang } from "@/lib/seo";
import { Metadata } from "next";
import { notFound } from "next/navigation";

type Props = {
  params: Promise<{ slug: string }>;
  searchParams: Promise<{ lang?: string }>;
};

const ARTICLE_UPDATED_AT = "2026-07-19T00:00:00.000Z";

export function generateStaticParams() {
  return getAllArticleSlugs().map((slug) => ({ slug }));
}

function articleBody(article: NonNullable<ReturnType<typeof getArticleBySlug>>): string {
  return article.sections
    .flatMap((section) => [section.heading, section.text, ...(section.list ?? [])])
    .filter(Boolean)
    .join("\n\n");
}

export async function generateMetadata({ params, searchParams }: Props): Promise<Metadata> {
  const { slug } = await params;
  const lang = await resolveSeoLang(await searchParams);
  const article = getArticleBySlug(slug, lang) ?? getArticleBySlug(slug, "en");
  if (!article) return {};

  const title = getPageMetadataTitle(`/resources/${slug}`, lang);
  const path = `/resources/${slug}`;
  const url = localizedUrl(path, lang);
  const isIndexable = isIndexableArticleSlug(slug);

  return {
    alternates: pageAlternates(path, lang),
    title: { absolute: title },
    description: article.description,
    authors: [{ name: "SkyLight Chat Product Team", url: localizedUrl("/", lang) }],
    robots: { index: isIndexable, follow: true },
    openGraph: {
      title,
      description: article.description,
      type: "article",
      url,
      siteName: lang === "ar" ? "سكاي لايت شات" : "SkyLight Chat",
      locale: lang === "ar" ? "ar_SA" : "en_US",
      alternateLocale: lang === "ar" ? ["en_US"] : ["ar_SA"],
      modifiedTime: ARTICLE_UPDATED_AT,
      authors: ["SkyLight Chat Product Team"],
      section: article.type,
    },
    twitter: {
      card: "summary_large_image",
      title,
      description: article.description,
    },
  };
}

export default async function ResourceArticlePage({ params, searchParams }: Props) {
  const { slug } = await params;
  const lang = await resolveSeoLang(await searchParams);
  const article = getArticleBySlug(slug, lang) ?? getArticleBySlug(slug, "en");
  if (!getAllArticleSlugs().includes(slug)) {
    notFound();
  }
  if (!article) {
    notFound();
  }

  const path = `/resources/${slug}`;
  const pageUrl = localizedUrl(path, lang);
  const isIndexable = isIndexableArticleSlug(slug);

  const articleJsonLd = {
    "@context": "https://schema.org",
    "@type": "Article",
    "@id": `${pageUrl}#article`,
    headline: article.title,
    description: article.description,
    abstract: article.tldr ?? article.description,
    articleBody: articleBody(article),
    dateModified: ARTICLE_UPDATED_AT,
    inLanguage: lang === "ar" ? "ar-SA" : "en-US",
    mainEntityOfPage: {
      "@type": "WebPage",
      "@id": pageUrl,
    },
    author: {
      "@type": "Organization",
      name: "SkyLight Chat Product Team",
      url: localizedUrl("/", lang),
    },
    publisher: {
      "@type": "Organization",
      name: "SkyLight Chat",
      logo: {
        "@type": "ImageObject",
        url: "https://dashboard.skylightchat.com/public/images/20251217000013-admin_logo76.png",
      },
    },
  };

  const breadcrumbJsonLd = {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "@id": `${pageUrl}#breadcrumb`,
    itemListElement: [
      {
        "@type": "ListItem",
        position: 1,
        name: lang === "ar" ? "الرئيسية" : "Home",
        item: localizedUrl("/", lang),
      },
      {
        "@type": "ListItem",
        position: 2,
        name: lang === "ar" ? "الموارد" : "Resources",
        item: localizedUrl("/resources", lang),
      },
      {
        "@type": "ListItem",
        position: 3,
        name: article.title,
        item: pageUrl,
      },
    ],
  };

  return (
    <>
      {isIndexable && (
        <script
          type="application/ld+json"
          dangerouslySetInnerHTML={{ __html: JSON.stringify(articleJsonLd) }}
        />
      )}
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(breadcrumbJsonLd) }}
      />
      <ResourceArticle slug={slug} lang={lang} />
    </>
  );
}