Function PlayerDisplay

apps/frontend/src/components/GameEndModal.tsx:23–54

({
    player,
    gameResult,
    isWhite,
  }: {
    player?: { id: string; name: string };
    gameResult: Result;
    isWhite: boolean;
  })

  };

  const PlayerDisplay = ({
    player,
    gameResult,
    isWhite,
  }: {
    player?: { id: string; name: string };
    gameResult: Result;
    isWhite: boolean;
  }) => {
    const imageSrc = isWhite ? WhiteKing : BlackKing;
    const borderColor =
      gameResult === (isWhite ? Result.WHITE_WINS : Result.BLACK_WINS)
        ? 'border-green-400'
        : 'border-red-400';

    return (
      <div className="flex flex-col items-center">
        <div className={`border-4 rounded-full p-2 ${borderColor}`}>
          <img
            src={imageSrc}
            alt={`${isWhite ? 'White' : 'Black'} King`}
            className="w-10 h-10"
          />
        </div>
        <div className="text-center text-xm p-2">
          <p className="text-white truncate w-24" title={getPlayerName(player)}>
            {getPlayerName(player)}
          </p>
        </div>
      </div>
    );
  };

  const getWinnerMessage = (result: Result) => {
    switch (result) {