| interface ProgressBarProps { | |
| current: number; | |
| total: number; | |
| label?: string; | |
| } | |
| export function ProgressBar({ current, total, label }: ProgressBarProps) { | |
| const pct = total > 0 ? Math.round((current / total) * 100) : 0; | |
| return ( | |
| <div className="space-y-2"> | |
| <div className="flex justify-between items-center text-sm"> | |
| <span className="text-slate-400">{label ?? "Processing images…"}</span> | |
| <span className="font-mono text-brand-400"> | |
| {current}/{total} · {pct}% | |
| </span> | |
| </div> | |
| <div className="h-2 rounded-full bg-surface-600 overflow-hidden"> | |
| <div | |
| className="h-full rounded-full bg-gradient-to-r from-brand-600 to-brand-400 transition-all duration-300" | |
| style={{ width: `${pct}%` }} | |
| /> | |
| </div> | |
| </div> | |
| ); | |
| } | |