49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { TeamRankingRow } from './TeamRankingRow';
|
|
import { LeaderboardTableShell } from '@/ui/LeaderboardTableShell';
|
|
|
|
interface LeaderboardTeam {
|
|
id: string;
|
|
name: string;
|
|
logoUrl?: string;
|
|
position: number;
|
|
rating: number;
|
|
totalWins: number;
|
|
totalRaces: number;
|
|
memberCount: number;
|
|
}
|
|
|
|
interface TeamLeaderboardTableProps {
|
|
teams: LeaderboardTeam[];
|
|
onTeamClick?: (id: string) => void;
|
|
}
|
|
|
|
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>
|
|
);
|
|
}
|