---
import {getCollection} from "astro:content";
import NavbarLayout from "../../layouts/NavbarLayout.astro";
import {astroI18n, createGetStaticPaths} from "astro-i18n";

export const getStaticPaths = createGetStaticPaths(async () => {
    let posts = await getCollection("help");

    return posts.filter(value => value.id.split("/")[0] === astroI18n.locale).map((page) => ({
        props: {page}, params: {slug: page.slug},
    }));
});

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

<NavbarLayout title={page.data.title}>
    <article>
        <h1 class="text-left">{page.data.title}</h1>
        <Content/>
    </article>
</NavbarLayout>

<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>