code quality

apps/website/templates/DashboardTemplate.tsx

@@ -4,6 +4,8 @@ import { DashboardKpiRow } from '@/components/dashboard/DashboardKpiRow';
 import { RecentActivityTable, type ActivityItem } from '@/components/dashboard/RecentActivityTable';
 import { TelemetryPanel } from '@/components/dashboard/TelemetryPanel';
 import type { DashboardViewData } from '@/lib/view-data/DashboardViewData';
+import { routes } from '@/lib/routing/RouteConfig';
+import { useRouter } from 'next/navigation';
 import { Box } from '@/ui/Box';
 import { Button } from '@/ui/Button';
 import { Grid } from '@/ui/Grid';
@@ -26,6 +28,7 @@ export function DashboardTemplate({
   viewData,
   onNavigateToRaces,
 }: DashboardTemplateProps) {
+  const router = useRouter();
   const {
     currentDriver,
     nextRace,
@@ -109,6 +112,7 @@ export function DashboardTemplate({
                       pb={2}
                       data-testid={`league-standing-${standing.leagueId}`}
                       cursor="pointer"
+                      onClick={() => router.push(routes.league.detail(standing.leagueId))}
                     >
                       <Box data-testid="league-standing-link">
                         <Text size="xs" weight="bold" truncate block maxWidth="180px">{standing.leagueName}</Text>
@@ -129,7 +133,12 @@ export function DashboardTemplate({
               <Stack direction="col" gap={4}>
                 {upcomingRaces.length > 0 ? (
                   upcomingRaces.slice(0, 3).map((race) => (
-                    <Box key={race.id} cursor="pointer" data-testid={`upcoming-race-${race.id}`}>
+                    <Box
+                      key={race.id}
+                      cursor="pointer"
+                      data-testid={`upcoming-race-${race.id}`}
+                      onClick={() => router.push(routes.race.detail(race.id))}
+                    >
                       <Box display="flex" justifyContent="between" alignItems="start" mb={1} data-testid="upcoming-race-link">
                         <Text size="xs" weight="bold">{race.track}</Text>
                         <Text size="xs" font="mono" variant="low">{race.timeUntil}</Text>

apps/website/templates/DriverProfileTemplate.tsx

@@ -90,6 +90,7 @@ export function DriverProfileTemplate({
         <Stack gap={4}>
           <Box display="flex" alignItems="center" justifyContent="between">
             <Button
+              data-testid="back-to-drivers-button"
               variant="secondary"
               onClick={onBackClick}
               icon={<ArrowLeft size={16} />}
@@ -125,18 +126,22 @@ export function DriverProfileTemplate({
 
         {/* Stats Grid */}
         {careerStats.length > 0 && (
-          <DriverStatsPanel stats={careerStats} />
+          <Box data-testid="driver-stats-panel">
+            <DriverStatsPanel stats={careerStats} />
+          </Box>
         )}
 
         {/* Team Memberships */}
         {teamMemberships.length > 0 && (
-          <TeamMembershipGrid 
-            memberships={teamMemberships.map((m) => ({
-              team: { id: m.teamId, name: m.teamName },
-              role: m.role,
-              joinedAtLabel: m.joinedAtLabel
-            }))} 
-          />
+          <Box data-testid="team-membership-grid">
+            <TeamMembershipGrid
+              memberships={teamMemberships.map((m) => ({
+                team: { id: m.teamId, name: m.teamName },
+                role: m.role,
+                joinedAtLabel: m.joinedAtLabel
+              }))}
+            />
+          </Box>
         )}
 
         {/* Tab Navigation */}
@@ -146,28 +151,32 @@ export function DriverProfileTemplate({
         {activeTab === 'overview' && (
           <Stack gap={6}>
             {stats && (
-              <DriverPerformanceOverview 
-                stats={{
-                  wins: stats.wins,
-                  podiums: stats.podiums,
-                  totalRaces: stats.totalRaces,
-                  consistency: stats.consistency || 0,
-                  dnfs: stats.dnfs,
-                  bestFinish: stats.bestFinish || 0,
-                  avgFinish: stats.avgFinish || 0
-                }} 
-              />
+              <Box data-testid="performance-overview">
+                <DriverPerformanceOverview
+                  stats={{
+                    wins: stats.wins,
+                    podiums: stats.podiums,
+                    totalRaces: stats.totalRaces,
+                    consistency: stats.consistency || 0,
+                    dnfs: stats.dnfs,
+                    bestFinish: stats.bestFinish || 0,
+                    avgFinish: stats.avgFinish || 0
+                  }}
+                />
+              </Box>
             )}
             
             {extendedProfile && (
-              <DriverRacingProfile 
-                racingStyle={extendedProfile.racingStyle}
-                favoriteTrack={extendedProfile.favoriteTrack}
-                favoriteCar={extendedProfile.favoriteCar}
-                availableHours={extendedProfile.availableHours}
-                lookingForTeam={extendedProfile.lookingForTeam}
-                openToRequests={extendedProfile.openToRequests}
-              />
+              <Box data-testid="driver-racing-profile">
+                <DriverRacingProfile
+                  racingStyle={extendedProfile.racingStyle}
+                  favoriteTrack={extendedProfile.favoriteTrack}
+                  favoriteCar={extendedProfile.favoriteCar}
+                  availableHours={extendedProfile.availableHours}
+                  lookingForTeam={extendedProfile.lookingForTeam}
+                  openToRequests={extendedProfile.openToRequests}
+                />
+              </Box>
             )}
 
             {extendedProfile && extendedProfile.achievements.length > 0 && (

apps/website/templates/DriversTemplate.tsx

@@ -54,6 +54,7 @@ export function DriversTemplate({
           />
 
           <Input
+            data-testid="driver-search-input"
             placeholder="Search drivers by name or nationality..."
             value={searchQuery}
             onChange={(e) => onSearchChange(e.target.value)}

apps/website/templates/shared/StatusTemplates.tsx

@@ -31,8 +31,8 @@ export function EmptyTemplate({ title, description }: EmptyTemplateProps) {
   return (
     <Container size="lg">
       <Stack align="center" gap={2} py={12}>
-        <Text size="xl" weight="semibold" color="text-white">{title}</Text>
-        <Text color="text-gray-400">{description}</Text>
+        <Text data-testid="empty-state-title" size="xl" weight="semibold" color="text-white">{title}</Text>
+        <Text data-testid="empty-state-description" color="text-gray-400">{description}</Text>
       </Stack>
     </Container>
   );