code quality
Some checks failed
CI / lint-typecheck (pull_request) Failing after 10s
CI / tests (pull_request) Has been skipped
CI / contract-tests (pull_request) Has been skipped
CI / e2e-tests (pull_request) Has been skipped
CI / comment-pr (pull_request) Has been skipped
CI / commit-types (pull_request) Has been skipped

This commit is contained in:
2026-01-27 17:36:39 +01:00
parent 9894c4a841
commit e04282d77e
32 changed files with 431 additions and 246 deletions

View File

@@ -16,17 +16,18 @@ interface DriverStatsPanelProps {
export function DriverStatsPanel({ stats }: DriverStatsPanelProps) {
return (
<Box display="grid" gridCols={{ base: 2, sm: 3, lg: 6 }} gap="px" overflow="hidden" rounded="xl" border borderColor="border-charcoal-outline" bg="bg-charcoal-outline">
<Box data-testid="driver-stats-panel-grid" display="grid" gridCols={{ base: 2, sm: 3, lg: 6 }} gap="px" overflow="hidden" rounded="xl" border borderColor="border-charcoal-outline" bg="bg-charcoal-outline">
{stats.map((stat, index) => (
<Box key={index} display="flex" flexDirection="col" gap={1} bg="bg-deep-charcoal" p={5} transition hoverBg="bg-deep-charcoal/80">
<Text size="xs" weight="bold" color="text-gray-500" uppercase letterSpacing="wider">
<Box key={index} data-testid={`stat-item-${stat.label.toLowerCase().replace(/\s+/g, '-')}`} display="flex" flexDirection="col" gap={1} bg="bg-deep-charcoal" p={5} transition hoverBg="bg-deep-charcoal/80">
<Text data-testid={`stat-label-${stat.label.toLowerCase().replace(/\s+/g, '-')}`} size="xs" weight="bold" color="text-gray-500" uppercase letterSpacing="wider">
{stat.label}
</Text>
<Box display="flex" alignItems="baseline" gap={1.5}>
<Text
size="2xl"
weight="bold"
font="mono"
<Text
data-testid={`stat-value-${stat.label.toLowerCase().replace(/\s+/g, '-')}`}
size="2xl"
weight="bold"
font="mono"
color={stat.color || 'text-white'}
>
{stat.value}