import images from '@/assets/images/images';
import InnerPageBanner from '@/components/layout/innerPages/banner';
import PostsGrid from '@/components/pages/blog/PostsGrid';
import { IPageParams } from '@/models/layout';
import { getPosts } from '@/services/blog';
import { getTranslations, setRequestLocale } from 'next-intl/server';

export async function generateMetadata({ params }: { params: IPageParams }) {
  const { locale } = await params;
  setRequestLocale(locale);
  const t = await getTranslations({ locale });

  return {
    title: t('page_blog_metadata_title'),
    description: t('page_blog_metadata_description'),
  };
}

export default async function Blog({ params }: { params: IPageParams }) {
  const paramsData = await params;
  const { locale } = paramsData;

  const t = await getTranslations({ locale });

  const { data: posts, pagination } = await getPosts();

  return (
    <main className="flex flex-col items-center justify-between">
      <InnerPageBanner
        title={t('pages_blog_title')}
        imageSrc={images.blogBanner.src}
      />
      <div id="postList" className="w-full">
        <PostsGrid initialPosts={posts} initialPagination={pagination} />
      </div>
    </main>
  );
}
