mirror of
https://github.com/AgentSeal/codeburn.git
synced 2026-08-10 17:14:48 +00:00
Add a Vite + React 19 + Tailwind v4 + Recharts SPA (dash/) and a 'web' command that serves the built UI plus a local /api/usage endpoint backed by the existing menubar aggregation. Midnight theme with CodeBurn's orange chart ramp: hero cost, a stacked-by-model daily bar chart with a custom tooltip and hover-dim, metric cards, by-tool and by-activity bar lists, and top-projects and tools tables. Period and provider filters, react-query with skeleton loading. Stays 100% local. build:dash builds the SPA into dist/dash (shipped via package files, served at runtime); a missing build falls back to a helpful message.
38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
import type { ReactNode } from 'react'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
export type Column = { key: string; label: string; num?: boolean }
|
|
|
|
export function DataTable({ columns, rows }: { columns: Column[]; rows: Array<Record<string, ReactNode>> }) {
|
|
if (!rows.length) return <div className="py-8 text-center text-sm text-tertiary-foreground">No data.</div>
|
|
return (
|
|
<table className="w-full text-sm">
|
|
<thead>
|
|
<tr>
|
|
{columns.map((c) => (
|
|
<th
|
|
key={c.key}
|
|
className={cn(
|
|
'pb-2 text-[11px] font-medium uppercase tracking-wider text-tertiary-foreground',
|
|
c.num ? 'text-right' : 'text-left',
|
|
)}
|
|
>
|
|
{c.label}
|
|
</th>
|
|
))}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rows.map((r, i) => (
|
|
<tr key={i} className="border-t border-border">
|
|
{columns.map((c) => (
|
|
<td key={c.key} className={cn('py-2 tabular-nums', c.num ? 'text-right' : 'text-left')}>
|
|
{r[c.key]}
|
|
</td>
|
|
))}
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
)
|
|
}
|