---
import {getCollection, CollectionEntry} from 'astro:content'
import {astroI18n, createGetStaticPaths, t} from "astro-i18n";
import PageLayout from "../../layouts/PageLayout.astro";

export const getStaticPaths = createGetStaticPaths(async () => {
    let posts = await getCollection("rules", value => value.id.split("/")[0] === astroI18n.locale);

    return posts.map((page) => ({
        props: { page }, params: { slug: page.slug.split("/")[1] }
    }))
})

interface Props {
    page: CollectionEntry<"rules">
}

const { page } = Astro.props;
const { Content } = await page.render();
---


<PageLayout title={t("title", {mode: t(`${page.data.translationKey}.title`)})}>
    <article>
        <Content />
    </article>
</PageLayout>

<style is:global>
    article {
        >* {
            all: revert;
        }

        code {
            @apply dark:text-neutral-400 text-neutral-800;
        }

        pre.astro-code {
            @apply w-fit p-4 rounded-md border-2 border-gray-600 my-4;
        }
    }
</style>
