Felix Förtsch
109a9f383b
server: metadata cache + fetch service, image proxy with disk cache, POST /igdb/metadata + GET /igdb/image/:id/:size routes. client: 002-metadata migration, enrichment wired into sync pipeline, extracted SyncProgress component, square cover icons in list items, genres/rating/summary on discover cards, tap-to-navigate on card stack, rich game detail with screenshots, trailer embed, developer info. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
import { t } from "@/shared/i18n"
|
|
import { Loader2 } from "lucide-react"
|
|
|
|
export function SyncProgress({ progress }: { progress: string | null }) {
|
|
if (!progress) return null
|
|
|
|
if (progress === "fetching") {
|
|
return (
|
|
<div className="mt-4 flex items-center gap-2 text-sm text-muted-foreground">
|
|
<Loader2 className="h-4 w-4 animate-spin" />
|
|
{t("settings.syncFetching")}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
if (progress.startsWith("saving:")) {
|
|
const [, current, total] = progress.split(":")
|
|
return (
|
|
<div className="mt-4 space-y-1.5">
|
|
<div className="flex items-center gap-2 text-sm text-muted-foreground">
|
|
<Loader2 className="h-4 w-4 animate-spin" />
|
|
{t("settings.syncSaving", { current, total })}
|
|
</div>
|
|
<div className="h-2 overflow-hidden rounded-full bg-muted">
|
|
<div
|
|
className="h-full rounded-full bg-primary transition-all"
|
|
style={{ width: `${(Number(current) / Number(total)) * 100}%` }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
if (progress === "enriching:ids") {
|
|
return (
|
|
<div className="mt-4 flex items-center gap-2 text-sm text-muted-foreground">
|
|
<Loader2 className="h-4 w-4 animate-spin" />
|
|
{t("settings.syncEnrichingIds")}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
if (progress === "enriching:metadata") {
|
|
return (
|
|
<div className="mt-4 flex items-center gap-2 text-sm text-muted-foreground">
|
|
<Loader2 className="h-4 w-4 animate-spin" />
|
|
{t("settings.syncEnrichingMetadata")}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return null
|
|
}
|