Function GameEndModal

apps/frontend/src/components/GameEndModal.tsx:12–105

({
  blackPlayer,
  whitePlayer,
  gameResult,
})

}

const GameEndModal: React.FC<ModalProps> = ({
  blackPlayer,
  whitePlayer,
  gameResult,
}) => {
  const [isOpen, setIsOpen] = useState(true);

  const closeModal = () => {
    setIsOpen(false);
  };

  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) {
      case Result.BLACK_WINS:
        return 'Black Wins!';
      case Result.WHITE_WINS:
        return 'White Wins!';
      default:
        return "It's a Draw";
    }
  };

  const getPlayerName = (player: { id: string; name: string } | undefined) => {
    return player ? player.name : 'Unknown';
  };