Add tag detail post

src/pages/tags/[tag].astro

@@ -0,0 +1,60 @@
+---
+import Layout from "@layouts/Layout.astro";
+import Main from "@layouts/Main.astro";
+import Header from "@components/Header.astro";
+import Footer from "@components/Footer.astro";
+import Card from "@components/Card.astro";
+import type { MarkdownInstance } from "astro";
+import type { Frontmatter } from "@utils/types";
+import getUniqueTags from "@utils/getUniqueTags";
+import getPostsByTag from "@utils/getPostsByTag";
+
+export interface Props {
+  post: MarkdownInstance<Frontmatter>;
+  tag: string;
+}
+
+export async function getStaticPaths() {
+  const posts: MarkdownInstance<Frontmatter>[] = await Astro.glob(
+    "../../contents/*.md"
+  );
+
+  const tags = getUniqueTags(posts);
+
+  return tags.map((tag) => {
+    return {
+      params: {
+        tag,
+      },
+      props: {
+        tag,
+      },
+    };
+  });
+}
+
+const { tag } = Astro.props;
+
+const posts: MarkdownInstance<Frontmatter>[] = await Astro.glob(
+  "../../contents/*.md"
+);
+
+const tagPosts = getPostsByTag(posts, tag);
+---
+
+<Layout title="AstroPaper: tags">
+  <Header activeNav="tags" />
+  <Main
+    pageTitle={`Tag:${tag}`}
+    pageDesc={`All the articles with the tag "${tag}".`}
+  >
+    <ul>
+      {
+        tagPosts.map(({ frontmatter }) => (
+          <Card href={`/posts/${frontmatter.slug}`} post={frontmatter} />
+        ))
+      }
+    </ul>
+  </Main>
+  <Footer />
+</Layout>