🚨 Fix type issues

src/components/BlogHeader.astro

@@ -25,11 +25,19 @@ const { title, date, slug } = Astro.props;
 		font-size: 1.3rem;
 	}
 
-	.calendar-icon {
-		transform: translateY(0.3rem);
-	}
-
 	strong {
 		font-weight: bolder;
 	}
+
+	.blog-header {
+		margin: 1rem 0;
+	}
+
+	.blog-header > h2 {
+		margin: 0;
+	}
+
+	.calendar-icon {
+		transform: translateY(0.3rem);
+	}
 </style>

src/components/PostPreview.astro

@@ -1,27 +1,18 @@
 ---
 import BlogHeader from '@components/BlogHeader.astro';
 import Tags from '@components/Tags.astro';
-
-interface Post {
-	data: {
-		title: string;
-		pubDate: Date;
-		tags: string[];
-	};
-	slug: string;
-}
+import type { CollectionEntry } from 'astro:content';
 
 interface Props {
-	post: Post;
+	post: CollectionEntry<'blog'>;
 }
 
 const { post } = Astro.props;
-const { data, slug } = post;
 ---
 
 <article>
-	<BlogHeader title={post.data.title} date={data.pubDate} slug={slug} />
-	<Tags tags={data.tags} />
+	<BlogHeader title={post.data.title} date={post.data.pubDate} slug={post.id} />
+	<Tags tags={post.data.tags} />
 </article>
 
 <style>
@@ -31,6 +22,5 @@ const { data, slug } = post;
 
 	article:not(:first-child) {
 		border-top: var(--border);
-		padding-top: 20px;
 	}
 </style>

src/components/Tags.astro

@@ -10,7 +10,7 @@ const { tags } = Astro.props;
 	{
 		tags.sort().map((tag: string, index: number) => (
 			<>
-				<a class="tag" href={`/blog/archive/${tag}`}>
+				<a class="tag" href={`/blog/tag/${tag}`}>
 					{tag}
 				</a>
 				{index < tags.length - 1 ? ' | ' : ''}