import { locales } from '../../../../lib/i18n';
import { getBlogPostSlugs } from '../../../../lib/sitemap-generator';
import { Locale } from '../../../../lib/i18n';
import { getTranslations } from '../../../../lib/translations';
import BlogPostClient from './BlogPostClient'; // Assuming the client component is in a separate file

export async function generateStaticParams() {
    const slugs = getBlogPostSlugs();
    const params = locales.flatMap((locale) =>
        slugs.map((slug) => ({
            locale,
            slug,
        })),
    );
    return params;
}

export default function BlogPostPage({ params }: { params: { locale: Locale; slug: string } }) {
    const t = getTranslations(params.locale);

    const getPostData = (slug: string) => {
        const posts = {
            featured: t.blog.posts.featured,
            post1: t.blog.posts.post1,
            post2: t.blog.posts.post2,
            post3: t.blog.posts.post3,
            post4: t.blog.posts.post4,
            post5: t.blog.posts.post5,
        };
        return posts[slug as keyof typeof posts] || null;
    };

    const post = getPostData(params.slug);

    return <BlogPostClient locale={params.locale} post={post} t={t} />;
}