Enhance post date display with loading state for unpublished posts

This commit is contained in:
rattatwinko
2025-06-16 17:15:26 +02:00
parent 92fb64733b
commit da8822ec0e
3 changed files with 22 additions and 2 deletions

0
posts/folder/folder2.md Normal file
View File

View File

@@ -105,7 +105,17 @@ export default function Home() {
<Link href={`/posts/${post.slug}`}>
<h2 className="text-2xl font-semibold mb-2">{post.title}</h2>
<div className="text-gray-600 mb-4">
<div>Veröffentlicht: {format(new Date(post.date), 'd. MMMM yyyy')}</div>
{post.date ? (
<div>Veröffentlicht: {format(new Date(post.date), 'd. MMMM yyyy')}</div>
) : (
<div className="flex flex-col items-center">
<div className="flex">
<span className="text-2xl animate-spin mr-2"></span>
<span className="text-2xl animate-spin-reverse"></span>
</div>
<div className="text-xl font-bold mt-2">In Bearbeitung</div>
</div>
)}
<div>Erstellt: {format(new Date(post.createdAt), 'd. MMMM yyyy HH:mm')}</div>
</div>
<p className="text-gray-700 mb-4">{post.summary}</p>

View File

@@ -53,7 +53,17 @@ export default function PostPage({ params }: { params: { slug: string[] } }) {
<h1 className="text-4xl font-bold mb-4">{post.title}</h1>
<div className="text-gray-600 mb-8">
<div>Veröffentlicht: {format(new Date(post.date), 'd. MMMM yyyy')}</div>
{post.date ? (
<div>Veröffentlicht: {format(new Date(post.date), 'd. MMMM yyyy')}</div>
) : (
<div className="flex flex-col items-center">
<div className="flex">
<span className="text-2xl animate-spin mr-2"></span>
<span className="text-2xl animate-spin-reverse"></span>
</div>
<div className="text-xl font-bold mt-2">In Bearbeitung</div>
</div>
)}
<div>Erstellt: {format(new Date(post.createdAt), 'd. MMMM yyyy HH:mm')}</div>
</div>