MosswartOverlord/frontend/src/components/sidebar/PlayerList.tsx

import React from 'react';
import { PlayerRow } from './PlayerRow';
import type { TelemetrySnapshot, VitalsMessage } from '../../types';

interface Props {
  players: TelemetrySnapshot[];
  vitals: Map<string, VitalsMessage>;
  getColor: (name: string) => string;
  onSelect: (name: string) => void;
}

export const PlayerList: React.FC<Props> = ({ players, vitals, getColor, onSelect }) => (
  <ul className="ml-player-list">
    {players.map(p => (
      <PlayerRow
        key={p.character_name}
        player={p}
        vitals={vitals.get(p.character_name) ?? null}
        color={getColor(p.character_name)}
        onSelect={() => onSelect(p.character_name)}
      />
    ))}
  </ul>
);