import Image from "next/image";
import Link from "next/link";

import { Border } from "@/components/landing/border";
// import { Button } from "@/components/landing/button";
import { Container } from "@/components/landing/container";
import { FadeIn } from "@/components/landing/fade-in";
// import { PageIntro } from "@/components/landing/page-intro";
import { authors } from "@/content/blog/authors";
import { BLOG_PATH, getAllMDXData } from "../../../lib/mdx-helper";
import { redirect } from "next/navigation";
import Article from "@/components/article/article";
import { baseTitle, baseURL } from "@/lib/metadata";
import { useTranslation } from "react-i18next";
import initTranslations from "@/app/i18n";
import TranslationsProvider from "@/components/TranslationsProvider";

export const runtime = "nodejs";

export const metadata = {
  title: `Blog | ${baseTitle}`,
  description: "Latest blog posts and news from the Unkey team.",
  openGraph: {
    title: `Blog | ${baseTitle}`,
    description: "Latest blog posts and news from the Unkey team.",
    url: "https://unkey.dev/blog",
    siteName: `${baseTitle}`,
    images: [
      {
        url: baseURL,
        width: 1200,
        height: 675,
      },
    ],
  },
  twitter: {
    title: `Blog | ${baseTitle}`,
    card: "summary_large_image",
  },
  icons: {
    shortcut: "/favicon.png",
  },
};

const i18nNamespaces = ['common', 'home'];

// export default async function Blog() {
export default async function Blog({ params: { locale } }: { params: { locale: string } }) {

  const { t, resources } = await initTranslations(locale, i18nNamespaces);

  // return redirect("/");

  // const posts = (await getAllMDXData({ contentPath: BLOG_PATH })).sort((a, b) => {
  //   return new Date(b.frontmatter.date).getTime() - new Date(a.frontmatter.date).getTime();
  // });

  // console.log("posts", posts)


  return (
    <TranslationsProvider
      namespaces={i18nNamespaces}
      locale={locale}
      resources={resources}>
      <Container className="mt-24 sm:mt-32 lg:mt-10">
        <div className="space-y-24 lg:space-y-32 mb-[6rem]">
          <Article />
        </div>
      </Container>
    </TranslationsProvider>


  );
}