refactor: rebase from hard fork into soft fork that follows upstream

src/components/BlogCard.astro

@@ -1,10 +1,6 @@
 ---
-import AvatarComponent from '@/components/ui/avatar'
-import { Badge } from '@/components/ui/badge'
 import { Separator } from '@/components/ui/separator'
-import { parseAuthors } from '@/lib/server-utils'
 import { formatDate, readingTime } from '@/lib/utils'
-import { Icon } from 'astro-icon/components'
 import { Image } from 'astro:assets'
 import type { CollectionEntry } from 'astro:content'
 import Link from './Link.astro'
@@ -19,19 +15,15 @@ const { entry } = Astro.props as {
 
 const formattedDate = formatDate(entry.data.date)
 const readTime = readingTime(entry.body!)
-const authors = await parseAuthors(entry.data.authors ?? [])
 ---
 
 <div
-  class="hover:bg-secondary/50 rounded-xl border p-4 transition-colors duration-300 ease-in-out"
+  class="not-prose hover:bg-secondary/50 rounded-xl border p-4 transition-colors duration-300 ease-in-out"
 >
-  <Link
-    href={`/${entry.collection}/${entry.id}`}
-    class="flex flex-col gap-4 sm:flex-row"
-  >
+  <Link href={`/blog/${entry.id}`} class="flex flex-col gap-4 sm:flex-row">
     {
       entry.data.image && (
-        <div class="max-w-[200px] sm:shrink-0">
+        <div class="max-w-[200px] sm:flex-shrink-0">
           <Image
             src={entry.data.image}
             alt={entry.data.title}
@@ -42,8 +34,8 @@ const authors = await parseAuthors(entry.data.authors ?? [])
         </div>
       )
     }
-    <div class="grow">
-      <h3 class="mb-1 text-lg font-medium">
+    <div class="flex-grow">
+      <h3 class="mb-1 text-lg font-semibold">
         {entry.data.title}
       </h3>
       <p class="text-muted-foreground mb-2 text-sm">
@@ -52,41 +44,10 @@ const authors = await parseAuthors(entry.data.authors ?? [])
       <div
         class="text-muted-foreground mb-2 flex flex-wrap items-center gap-x-2 text-xs"
       >
-        {
-          authors.length > 0 && (
-            <>
-              {authors.map((author) => (
-                <div class="flex items-center gap-x-1.5">
-                  <AvatarComponent
-                    client:load
-                    src={author.avatar}
-                    alt={author.name}
-                    fallback={author.name[0]}
-                    className="size-5 rounded-full"
-                  />
-                  <span>{author.name}</span>
-                </div>
-              ))}
-              <Separator orientation="vertical" className="h-4!" />
-            </>
-          )
-        }
         <span>{formattedDate}</span>
-        <Separator orientation="vertical" className="h-4!" />
+        <Separator orientation="vertical" className="h-4" />
         <span>{readTime}</span>
       </div>
-      {
-        entry.data.tags && (
-          <div class="flex flex-wrap gap-2">
-            {entry.data.tags.map((tag) => (
-              <Badge variant="secondary" className="flex items-center gap-x-1">
-                <Icon name="lucide:hash" class="size-3" />
-                {tag}
-              </Badge>
-            ))}
-          </div>
-        )
-      }
     </div>
   </Link>
 </div>