src/components/blog/PostPreview.astro


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

---
import type { CollectionEntry } from "astro:content";
import type { HTMLTag, Polymorphic } from "astro/types";
import FormattedDate from "@/components/FormattedDate.astro";

type Props<Tag extends HTMLTag> = Polymorphic<{ as: Tag }> & {
	post: CollectionEntry<"post">;
	withDesc?: boolean;
};

const { as: Tag = "div", post, withDesc = false } = Astro.props;
---

<FormattedDate
	class="min-w-30 font-semibold text-gray-600 dark:text-gray-400"
	date={post.data.publishDate}
/>
<Tag>
	{post.data.draft && <span class="text-red-500">(Draft) </span>}
	<a class="cactus-link" data-astro-prefetch href={`/posts/${post.id}/`}>
		{post.data.title}
	</a>
</Tag>
{withDesc && <q class="line-clamp-3 italic">{post.data.description}</q>}