import PostCard from "@/components/PostCard";
import Section from "@/components/Section";
import type { Post } from "@/lib/cms";
import { Link } from "@tanstack/react-router";

export default function LatestPosts({ posts }: { posts: Post[] }) {
	if (posts.length === 0) return null;

	return (
		<Section>
			<div className="flex items-baseline justify-between mb-6">
				<h2>Aus dem Blog</h2>
				<Link to="/blog" className="text-secondary text-sm">
					Alle Beiträge →
				</Link>
			</div>
			<div className="grid gap-6 md:grid-cols-2">
				{posts.map((post) => (
					<PostCard key={post.id} post={post} />
				))}
			</div>
		</Section>
	);
}
