---
import BaseLayout from "../../layouts/BaseLayout.astro";

export async function getStaticPaths({}) {
	const allPosts = await Astro.glob("../../content/**/*.mdx");
	const uniqueTags = [
		...new Set(allPosts.map((post) => post.frontmatter.tags).flat()),
	];

	return uniqueTags.map((tag) => {
		const filteredPosts = allPosts.filter((post) =>
			post.frontmatter.tags.includes(tag)
		);
		return {
			params: { tag },
			props: { posts: filteredPosts },
		};
	});
}

const { tag } = Astro.params;
const { posts } = Astro.props;
---

<BaseLayout pageTitle={tag}>
	<p>Posts tagged with {tag}</p>
	<ul>
		{posts.map((post) => <li>{post.frontmatter.title}</li>)}
	</ul>
</BaseLayout>