1---
 2import { getCollection } from "astro:content";
 3import type { GetStaticPaths, InferGetStaticPropsType } from "astro";
 4import { getIntlayer } from "intlayer";
 5import PostsList from "@/components/widgets/PostsList.astro";
 6import { SITE_CONFIG } from "@/config.ts";
 7import BaseLayout from "@/layouts/BaseLayout.astro";
 8import { getLocalePosts, loadLocaleContent } from "@/utils/content.ts";
 9import { shuffle } from "@/utils/random.ts";
10import { getLocaleRouteParam } from "@/utils/url.ts";
11import "@/styles/article/index.scss";
12
13type Props = InferGetStaticPropsType<typeof getStaticPaths>;
14
15export const getStaticPaths = (() => {
16  return SITE_CONFIG.locales.map((locale) => ({
17    params: { locale: getLocaleRouteParam(locale) },
18  }));
19}) satisfies GetStaticPaths;
20
21const locale = Astro.currentLocale;
22const globalI18n = getIntlayer("global", locale);
23
24const { Content: Article } = await loadLocaleContent("home", locale);
25
26const posts = getLocalePosts(await getCollection("posts"), locale);
27const sortedPosts = posts.sort((a, b) =>
28  Temporal.ZonedDateTime.compare(b.data.date, a.data.date),
29);
30---
31
32<BaseLayout>
33  <article>
34    <h1>{SITE_CONFIG.title}</h1>
35    <Article />
36  </article>
37  <div style={{ fontSize: "1.2rem" }}>
38    <h2 id="recent-posts">{globalI18n.posts.recent}</h2>
39    <PostsList posts={sortedPosts.slice(0, 5)} />
40    <h2 id="recent-posts">{globalI18n.posts.random}</h2>
41    <PostsList posts={shuffle(sortedPosts).slice(0, 3)} />
42  </div>
43</BaseLayout>