text: import { getAllFilesFrontMatter } from '@/lib/mdx'
  import siteMetadata from '@/data/siteMetadata'
  import ListLayout from '@/layouts/ListLayout'
  import { PageSeo } from '@/components/SEO'
  import useTranslation from 'next-translate/useTranslation'
  
  export const POSTS_PER_PAGE = 5
  
  export async function getStaticProps() {
    const posts = await getAllFilesFrontMatter('blog')
    const initialDisplayPosts = posts.slice(0, POSTS_PER_PAGE)
    const pagination = {
      currentPage: 1,
      totalPages: Math.ceil(posts.length / POSTS_PER_PAGE),
    }
  
    return { props: { initialDisplayPosts, posts, pagination } }
  }
  
  export default function Blog({ posts, initialDisplayPosts, pagination }) {
    let { t } = useTranslation();
    return (
      <>
        <PageSeo title={`${t("common:blog")} - ${t("common:title")}`} description={t("common:description")} />
        <ListLayout
          posts={posts}
          initialDisplayPosts={initialDisplayPosts}
          pagination={pagination}
          title={t("common:blog")}
        />
      </>
    )
  }
  