44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import type { PipelineStats } from "../types";
|
|
|
|
interface Props {
|
|
stats: PipelineStats;
|
|
}
|
|
|
|
export function StatsPanel({ stats }: Props) {
|
|
return (
|
|
<div className="stats-panel">
|
|
<div className="panel-header">
|
|
<h2>Stats</h2>
|
|
</div>
|
|
<div className="stats-grid">
|
|
<div className="stat">
|
|
<div className="stat-value">{stats.total_chunks}</div>
|
|
<div className="stat-label">Total Chunks</div>
|
|
</div>
|
|
<div className="stat">
|
|
<div className="stat-value">{stats.processed}</div>
|
|
<div className="stat-label">Processed</div>
|
|
</div>
|
|
<div className="stat">
|
|
<div className="stat-value">{stats.failed}</div>
|
|
<div className="stat-label">Failed</div>
|
|
</div>
|
|
<div className="stat">
|
|
<div className="stat-value">{stats.retries}</div>
|
|
<div className="stat-label">Retries</div>
|
|
</div>
|
|
<div className="stat">
|
|
<div className="stat-value">
|
|
{stats.throughput_mbps.toFixed(2)}
|
|
</div>
|
|
<div className="stat-label">MB/s</div>
|
|
</div>
|
|
<div className="stat">
|
|
<div className="stat-value">{stats.elapsed.toFixed(2)}s</div>
|
|
<div className="stat-label">Elapsed</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|