51c8a86be4
Server Component met data-fetching via getSprintTokenHistory/getDayTokenData/ getPbiTokenAggregates. SprintTokenHistoryTable, TokenDayChart (Recharts LineChart), PbiTokenTable en TokenSelectors (client, URL-params). Link toegevoegd in insights/page.tsx. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
40 lines
1.5 KiB
TypeScript
40 lines
1.5 KiB
TypeScript
import type { SprintTokenRow } from '@/lib/insights/token-history'
|
|
|
|
interface Props {
|
|
rows: SprintTokenRow[]
|
|
selectedSprintId: string
|
|
}
|
|
|
|
export function SprintTokenHistoryTable({ rows, selectedSprintId }: Props) {
|
|
if (rows.length === 0) {
|
|
return <p className="text-muted-foreground text-sm">Geen sprint-data met token-registratie.</p>
|
|
}
|
|
|
|
return (
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full text-sm">
|
|
<thead>
|
|
<tr className="border-b border-border bg-muted text-muted-foreground text-xs uppercase tracking-wide">
|
|
<th className="py-2 pr-4 text-left font-medium">Sprint</th>
|
|
<th className="py-2 pr-4 text-right font-medium">Tokens</th>
|
|
<th className="py-2 pr-4 text-right font-medium">Kosten (USD)</th>
|
|
<th className="py-2 text-right font-medium">Jobs</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rows.map(r => (
|
|
<tr
|
|
key={r.sprintId}
|
|
className={`border-b border-border last:border-0 ${r.sprintId === selectedSprintId ? 'bg-muted/50' : ''}`}
|
|
>
|
|
<td className="py-2 pr-4 text-foreground max-w-72 truncate">{r.sprintGoal}</td>
|
|
<td className="py-2 pr-4 text-right tabular-nums">{r.totalTokens.toLocaleString()}</td>
|
|
<td className="py-2 pr-4 text-right tabular-nums">${r.totalCostUsd.toFixed(4)}</td>
|
|
<td className="py-2 text-right tabular-nums">{r.jobCount}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)
|
|
}
|