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>
37 lines
1.3 KiB
TypeScript
37 lines
1.3 KiB
TypeScript
import type { PbiTokenRow } from '@/lib/insights/token-history'
|
|
|
|
interface Props {
|
|
rows: PbiTokenRow[]
|
|
}
|
|
|
|
export function PbiTokenTable({ rows }: Props) {
|
|
if (rows.length === 0) {
|
|
return <p className="text-muted-foreground text-sm">Geen PBI-data voor deze sprint.</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">PBI</th>
|
|
<th className="py-2 pr-4 text-right font-medium">Tokens</th>
|
|
<th className="py-2 text-right font-medium">Kosten (USD)</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rows.map(r => (
|
|
<tr key={r.pbiId} className="border-b border-border last:border-0">
|
|
<td className="py-2 pr-4 text-foreground">
|
|
<span className="text-muted-foreground mr-2">{r.pbiCode}</span>
|
|
{r.pbiTitle}
|
|
</td>
|
|
<td className="py-2 pr-4 text-right tabular-nums">{r.totalTokens.toLocaleString()}</td>
|
|
<td className="py-2 text-right tabular-nums">${r.totalCostUsd.toFixed(4)}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)
|
|
}
|