import { getMediaUrl } from '@/lib/utilities/media';
import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
import { Podium } from '@/ui/Podium';
import React from 'react';

interface TeamPodiumProps {
  teams: TeamSummaryViewModel[];
  onClick: (id: string) => void;
}

export function TeamPodium({ teams, onClick }: TeamPodiumProps) {
  const top3 = teams.slice(0, 3);
  if (top3.length < 3) return null;

  const entries = top3.map((team, index) => ({
    name: team.name,
    avatar: team.logoUrl || getMediaUrl('team-logo', team.id),
    value: `${team.totalWins} Wins`,
    position: (index + 1) as 1 | 2 | 3
  }));

  return (
    <Podium 
      title="Top 3 Teams" 
      entries={entries}
    />
  );
}