refactor: split modules and harden scraping workflows

2026-10-04 04:26:38 +08:00 · 2026-06-24 11:59:18 +08:00
parent efca3cbe69
commit 192f35d9fa
470 changed files with 47957 additions and 33839 deletions
@@ -0,0 +1,94 @@
+import { Info } from 'lucide-react'
+
+import type { DiscoverItem } from '../api/discover'
+import { imageURL } from '../api/client'
+import { discoverItemSource } from './discoverPageModel'
+
+export function ContentRow({
+  title,
+  items,
+  onSelect,
+}: {
+  title: string
+  items: DiscoverItem[]
+  onSelect: (item: DiscoverItem) => void
+}) {
+  return (
+    <section className="space-y-4">
+      <h2 className="pl-1 font-display text-2xl font-semibold text-ink-600">{title}</h2>
+      <div className="grid grid-cols-3 gap-4 sm:grid-cols-4 md:grid-cols-5 lg:grid-cols-7 xl:grid-cols-8">
+        {items.map((item, index) => (
+          <DiscoverCard key={discoverKey(item, index)} item={item} onSelect={onSelect} />
+        ))}
+      </div>
+    </section>
+  )
+}
+
+export function DiscoverSkeleton() {
+  return (
+    <div className="space-y-8">
+      {[1, 2, 3].map((section) => (
+        <section key={section} className="space-y-4">
+          <div className="h-8 w-48 animate-pulse rounded-xl bg-gray-100" />
+          <div className="grid grid-cols-3 gap-4 sm:grid-cols-4 md:grid-cols-5 lg:grid-cols-7 xl:grid-cols-8">
+            {[1, 2, 3, 4, 5, 6, 7, 8].map((item) => (
+              <div key={item} className="aspect-[2/3] animate-pulse rounded-xl bg-gray-100" />
+            ))}
+          </div>
+        </section>
+      ))}
+    </div>
+  )
+}
+
+function DiscoverCard({ item, onSelect }: { item: DiscoverItem; onSelect: (item: DiscoverItem) => void }) {
+  const source = discoverItemSource(item)
+  return (
+    <button
+      type="button"
+      onClick={() => onSelect(item)}
+      className="group relative overflow-hidden rounded-xl border border-gray-200 bg-gray-50 text-left transition-all duration-300 hover:-translate-y-1 hover:border-primary-500/30 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary-400/40"
+    >
+      <div className="relative aspect-[2/3] w-full overflow-hidden bg-surface-900">
+        {item.poster_url ? (
+          <img
+            src={imageURL(item.poster_url)}
+            alt={item.title}
+            loading="lazy"
+            referrerPolicy="no-referrer"
+            className="h-full w-full object-cover transition-transform duration-500 group-hover:scale-105"
+          />
+        ) : (
+          <div className="flex h-full w-full items-center justify-center text-xs text-gray-500">
+            无海报
+          </div>
+        )}
+        <div className="absolute left-1.5 top-1.5 rounded-xl border border-white/20 bg-black/65 px-1.5 py-0.5 text-[10px] font-semibold uppercase text-white backdrop-blur-sm">
+          {source}
+        </div>
+        {(item.rating ?? 0) > 0 && (
+          <div className="absolute right-1.5 top-1.5 rounded-xl border border-yellow-400/30 bg-black/70 px-1.5 py-0.5 text-[11px] font-semibold text-yellow-400 backdrop-blur-sm">
+            ★ {(item.rating ?? 0).toFixed(1)}
+          </div>
+        )}
+      </div>
+      <div className="space-y-0.5 px-2.5 py-2">
+        <p className="truncate text-xs font-medium text-ink-600 transition-colors group-hover:text-brand-500">
+          {item.title}
+        </p>
+        <p className="text-[11px] text-sand-500">
+          {[item.media_type, item.year && item.year > 0 ? item.year : ''].filter(Boolean).join(' · ') || '推荐'}
+        </p>
+        <p className="flex items-center gap-1 pt-1 text-[10px] font-semibold text-brand-500">
+          <Info size={10} />
+          详情 / 订阅
+        </p>
+      </div>
+    </button>
+  )
+}
+
+function discoverKey(item: DiscoverItem, index: number): string {
+  return `${item.source || 'source'}:${item.tmdb_id || item.douban_id || item.bangumi_id || item.title}:${index}`
+}