Dont display players with 0 totalGames

This commit is contained in:
Anthony Mineo 2020-04-05 11:39:03 -04:00
parent 15b96d197e
commit 77a564125a

View file

@ -11,39 +11,45 @@ const returnTotalSumGames = (player) => {
};
const PlayerRow = (player, index) =>
<li key={index}>
<InertiaLink href={`/player/${player.player_guid}`} className="block hover:bg-gray-50 focus:outline-none focus:bg-gray-50 transition duration-150 ease-in-out">
<div className="flex items-center px-4 py-4 sm:px-6">
<div className="min-w-0 flex-1 flex items-center">
<div className="min-w-0 flex-1 md:grid md:grid-cols-2 md:gap-4">
<div>
<div className="text-sm leading-5 font-medium text-indigo-600 truncate">{player.player_name}</div>
<div className="mt-2 flex items-center text-sm leading-5 text-gray-500">
<span className="truncate">Last Active: {player.updated_at.split(/[T]/)[0]}</span>
</div>
</div>
<div className="hidden md:block">
const PlayerRow = (player, index) => {
let totalGames = returnTotalSumGames(player);
// only display players that have games associated
if (totalGames === 0){return}
return <li key={index}>
<InertiaLink href={`/player/${player.player_guid}`} className="block hover:bg-gray-50 focus:outline-none focus:bg-gray-50 transition duration-150 ease-in-out">
<div className="flex items-center px-4 py-4 sm:px-6">
<div className="min-w-0 flex-1 flex items-center">
<div className="min-w-0 flex-1 md:grid md:grid-cols-2 md:gap-4">
<div>
<div className="text-sm leading-5 text-gray-900">
Total Games Played
<div className="text-sm leading-5 font-medium text-indigo-600 truncate">{player.player_name}</div>
<div className="mt-2 flex items-center text-sm leading-5 text-gray-500">
<span className="truncate">Last Active: {player.updated_at.split(/[T]/)[0]}</span>
</div>
<div className="mt-2 flex items-center">
<span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium leading-4 bg-gray-100 text-gray-800">{ returnTotalSumGames(player) }</span>
</div>
<div className="hidden md:block">
<div>
<div className="text-sm leading-5 text-gray-900">
Total Games Played
</div>
<div className="mt-2 flex items-center">
<span className="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium leading-4 bg-gray-100 text-gray-800">{ totalGames }</span>
</div>
</div>
</div>
</div>
</div>
<div>
<svg className="h-5 w-5 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clipRule="evenodd"/>
</svg>
</div>
</div>
<div>
<svg className="h-5 w-5 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clipRule="evenodd"/>
</svg>
</div>
</div>
</InertiaLink>
</li>;
</InertiaLink>
</li>;
}
export default function Players(props) {