bring up to date with github

src/components/LibraryCard.tsx

@@ -1,6 +1,7 @@
 'use client'
 
 import Link from 'next/link'
+import Image from 'next/image'
 import type { Library } from '@/types'
 
 const TYPE_LABELS: Record<string, string> = {
@@ -17,7 +18,7 @@ export default function LibraryCard({ library }: { library: Library }) {
   return (
     <Link
       href={`/library/${library.id}`}
-      className="group block rounded-xl border p-5 transition-colors"
+      className="group block rounded-xl border overflow-hidden transition-colors"
       style={{
         borderColor: 'var(--border)',
         backgroundColor: 'var(--surface)',
@@ -31,15 +32,34 @@ export default function LibraryCard({ library }: { library: Library }) {
         ;(e.currentTarget as HTMLElement).style.borderColor = 'var(--border)'
       }}
     >
-      <div className="text-3xl mb-3">{TYPE_ICONS[library.type] ?? '📁'}</div>
-      <div className="font-semibold text-base mb-1" style={{ color: 'var(--text-primary)' }}>
-        {library.name}
-      </div>
-      <div
-        className="text-xs font-medium px-2 py-0.5 rounded-full inline-block"
-        style={{ backgroundColor: 'var(--border)', color: 'var(--text-secondary)' }}
-      >
-        {TYPE_LABELS[library.type] ?? library.type}
+      {library.coverExt ? (
+        <div className="relative w-full aspect-video">
+          <Image
+            src={`/api/library-cover/${library.id}`}
+            alt={library.name}
+            fill
+            className="object-cover"
+            unoptimized
+          />
+        </div>
+      ) : (
+        <div
+          className="w-full aspect-video flex items-center justify-center text-4xl"
+          style={{ backgroundColor: 'var(--border)' }}
+        >
+          {TYPE_ICONS[library.type] ?? '📁'}
+        </div>
+      )}
+      <div className="p-4">
+        <div className="font-semibold text-base mb-1" style={{ color: 'var(--text-primary)' }}>
+          {library.name}
+        </div>
+        <div
+          className="text-xs font-medium px-2 py-0.5 rounded-full inline-block"
+          style={{ backgroundColor: 'var(--border)', color: 'var(--text-secondary)' }}
+        >
+          {TYPE_LABELS[library.type] ?? library.type}
+        </div>
       </div>
     </Link>
   )