import type { Metadata } from "next";
import { PublicBlogHeader } from "@/components/public-blog-header";
import { PublicBlogFeed } from "@/components/public-blog-feed";
import { getAdsenseSlot } from "@/lib/adsense-server";
import { SiteFooter } from "@/components/site-footer";
import { ServerStaticUiLocalizer } from "@/components/server-static-ui-localizer";
import { getBlogSocialImageUrl } from "@/lib/blog-social-image";
import { getLocaleOption } from "@/lib/i18n-config";
import { getLocalizedPublicPath } from "@/lib/i18n-urls";
import { getPublicSiteAbsoluteUrl } from "@/lib/mail-urls";
import { OFFICIAL_MAIL_SAME_AS } from "@/lib/official-mail-brand";
import {
  getLatestPublishedMarketingBlogPost,
  getPublishedMarketingBlogPosts,
  getPublishedMarketingBlogPostsPage,
} from "@/lib/marketing-blog";
import { resolveRequestLocale } from "@/lib/i18n-server";
import { getLocalizedBlogArticles } from "@/lib/localized-blog-content";
import { buildPublicPageMetadata } from "@/lib/public-seo-i18n";

export const dynamic = "force-dynamic";

const blogMetadata: Pick<Metadata, "description" | "keywords" | "title"> = {
  title: "오피셜메일 블로그 | 기업메일·도메인 메일 실무",
  description: "기업메일 만들기, 도메인 연결, MX·SPF·DKIM 설정, Gmail 반송 해결, 쇼핑몰 메일 운영 경험을 다루는 오피셜메일 공식 블로그입니다.",
  keywords: [
    "기업메일 가이드",
    "도메인 메일 설정",
    "회사 이메일 만들기",
    "SPF DKIM 설정",
    "Gmail 반송 해결",
    "AI 메일 요약",
  ],
};

export async function generateMetadata(): Promise<Metadata> {
  const latestPost = await getLatestPublishedMarketingBlogPost();
  const imageUrl = getBlogSocialImageUrl(latestPost?.contentMarkdown ?? "");
  return {
    ...buildPublicPageMetadata({
      imageUrl,
      locale: await resolveRequestLocale(),
      page: "blog",
      pathname: "/blog",
    }),
    keywords: blogMetadata.keywords,
  };
}

function JsonLd({ data }: { data: Record<string, unknown> }) {
  return <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }} />;
}

export default async function BlogIndexPage() {
  const locale = await resolveRequestLocale();
  const initialPage = await getPublishedMarketingBlogPostsPage({ limit: 6 });
  const localizedArticles = locale === "ko" ? null : getLocalizedBlogArticles(locale);
  const localizedSourcePosts = localizedArticles ? await getPublishedMarketingBlogPosts() : [];
  const sourceBySlug = new Map(localizedSourcePosts.map((post) => [post.slug, post]));
  const displayedPosts = localizedArticles
    ? localizedArticles.flatMap((article, index) => {
        const source = sourceBySlug.get(article.slug);
        if (!source) return [];
        return [{
          excerpt: article.description,
          id: source.id || -(index + 1),
          keywords: [article.category],
          publishedAt: source.publishedAt,
          slug: article.slug,
          title: article.title,
          updatedAt: source.updatedAt,
        }];
      })
    : initialPage.posts;
  const localizedBlogUrl = getPublicSiteAbsoluteUrl(getLocalizedPublicPath("/blog", locale));
  const blogSchema = {
    "@context": "https://schema.org",
    "@type": "Blog",
    "@id": `${localizedBlogUrl}#blog`,
    name: locale === "ko" ? "오피셜메일 블로그" : "OfficialMail Blog",
    description: locale === "ko" ? blogMetadata.description : "Practical OfficialMail guides for company email, domains, authentication, and operations.",
    inLanguage: getLocaleOption(locale).htmlLang,
    publisher: {
      "@type": "Organization",
      "@id": `${getPublicSiteAbsoluteUrl("/")}#organization`,
      legalName: "카베닉스(KAVENIX)",
      name: "오피셜메일",
      sameAs: OFFICIAL_MAIL_SAME_AS,
      logo: {
        "@type": "ImageObject",
        url: getPublicSiteAbsoluteUrl("/icon-512.png"),
        width: 512,
        height: 512,
      },
    },
    url: localizedBlogUrl,
    blogPost: displayedPosts.map((post) => ({
      "@type": "BlogPosting",
      headline: post.title,
      datePublished: post.publishedAt ?? post.updatedAt,
      dateModified: post.updatedAt,
      description: post.excerpt,
      mainEntityOfPage: getPublicSiteAbsoluteUrl(getLocalizedPublicPath(`/blog/${post.slug}`, locale)),
      url: getPublicSiteAbsoluteUrl(getLocalizedPublicPath(`/blog/${post.slug}`, locale)),
    })),
  };

  return (
    <ServerStaticUiLocalizer locale={locale}>
    <main className="min-h-screen bg-white text-[#16233c]">
      <JsonLd data={blogSchema} />
      <PublicBlogHeader />
      <section className="border-b border-[#edf1f6] bg-[linear-gradient(180deg,#f8fbff_0%,#ffffff_100%)]">
        <div className="mx-auto w-full max-w-[1420px] px-4 pb-12 pt-12 sm:px-8 sm:pb-16 sm:pt-16 xl:px-10">
          <p className="text-[13px] font-semibold tracking-[-0.02em] text-[#2f6df6]">OFFICIALMAIL BLOG</p>
          <h1 className="mt-3 text-balance text-[34px] font-semibold leading-[1.15] tracking-[-0.07em] text-[#16233c] sm:text-[46px]">
            오피셜메일 블로그
          </h1>
          <p className="mt-4 max-w-[690px] text-[15px] leading-7 text-[#64748b] sm:text-[17px] sm:leading-8">
            도메인 연결부터 발신 인증, 고객 문의 운영까지 사업용 메일을 운영하며 마주치는 문제와 해결 방법을 전합니다.
          </p>
        </div>
      </section>

      <section className="mx-auto w-full max-w-[1420px] px-4 py-10 sm:px-8 sm:py-14 xl:px-10">
        <div className="mb-5 flex items-center justify-between sm:mb-7">
          <h2 className="text-[18px] font-semibold tracking-[-0.05em] text-[#243555] sm:text-[22px]">최신 글</h2>
          <p className="text-[12px] text-[#8190a6]">최신 발행순</p>
        </div>
        {displayedPosts.length > 0 ? (
          <PublicBlogFeed
            adSlot={getAdsenseSlot("contentFeed")}
            initialPosts={displayedPosts}
            initialHasMore={locale === "ko" ? initialPage.hasMore : false}
            locale={locale}
          />
        ) : (
          <div className="border-y border-[#edf1f6] py-16 text-center text-[14px] text-[#74849f]">새로운 글을 준비하고 있습니다.</div>
        )}
      </section>
      <SiteFooter className="pt-12" />
    </main>
    </ServerStaticUiLocalizer>
  );
}