From 9e881a0355ed20e576dd3b520762f379f0848368 Mon Sep 17 00:00:00 2001
From: Sat Naing <satnaingdev@gmail.com>
Date: Sun, 11 Sep 2022 03:04:55 +0630
Subject: [PATCH] Add tags in post detail

---
 src/pages/posts/[slug].astro | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/pages/posts/[slug].astro b/src/pages/posts/[slug].astro
index 5712958..93f6208 100644
--- a/src/pages/posts/[slug].astro
+++ b/src/pages/posts/[slug].astro
@@ -1,11 +1,13 @@
 ---
 import Datetime from "@components/Datetime.astro";
 import Header from "@components/Header.astro";
+import Tag from "@components/Tag.astro";
 import Layout from "@layouts/Layout.astro";
 import type { MarkdownInstance } from "astro";
+import type { Frontmatter } from "../index.astro";
 
 export interface Props {
-  post: MarkdownInstance<Record<string, any>>;
+  post: MarkdownInstance<Frontmatter>;
 }
 
 export async function getStaticPaths() {
@@ -32,6 +34,9 @@ const { Content, frontmatter } = Astro.props.post;
   <main>
     <h1 class="post-title">{frontmatter.title}</h1>
     <Datetime datetime={frontmatter.datetime} size="lg" className="my-2" />
+    <ul class="tags-container">
+      {frontmatter.tags.map((tag) => <Tag name={tag} />)}
+    </ul>
     <article
       id="article"
       role="article"
@@ -49,4 +54,7 @@ const { Content, frontmatter } = Astro.props.post;
   .post-title {
     @apply font-semibold text-2xl text-skin-accent;
   }
+  .tags-container {
+    @apply mb-8;
+  }
 </style>