website refactor

apps/website/components/leaderboards/TeamLeaderboardTable.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { TeamRankingRow } from './TeamRankingRow';
+import { LeaderboardList } from '@/ui/LeaderboardList';
 import { LeaderboardTableShell } from '@/ui/LeaderboardTableShell';
 
 interface LeaderboardTeam {
@@ -19,30 +20,24 @@ interface TeamLeaderboardTableProps {
 }
 
 export function TeamLeaderboardTable({ teams, onTeamClick }: TeamLeaderboardTableProps) {
-  const columns = [
-    { key: 'rank', label: 'Rank', width: '8rem' },
-    { key: 'team', label: 'Team' },
-    { key: 'rating', label: 'Rating', align: 'center' as const },
-    { key: 'wins', label: 'Wins', align: 'center' as const },
-    { key: 'races', label: 'Races', align: 'center' as const },
-  ];
-
   return (
-    <LeaderboardTableShell columns={columns}>
-      {teams.map((team) => (
-        <TeamRankingRow
-          key={team.id}
-          rank={team.position}
-          id={team.id}
-          name={team.name}
-          logoUrl={team.logoUrl}
-          rating={team.rating}
-          wins={team.totalWins}
-          races={team.totalRaces}
-          memberCount={team.memberCount}
-          onClick={() => onTeamClick?.(team.id)}
-        />
-      ))}
+    <LeaderboardTableShell>
+      <LeaderboardList>
+        {teams.map((team) => (
+          <TeamRankingRow
+            key={team.id}
+            rank={team.position}
+            id={team.id}
+            name={team.name}
+            logoUrl={team.logoUrl}
+            rating={team.rating}
+            wins={team.totalWins}
+            races={team.totalRaces}
+            memberCount={team.memberCount}
+            onClick={() => onTeamClick?.(team.id)}
+          />
+        ))}
+      </LeaderboardList>
     </LeaderboardTableShell>
   );
 }