readme update + recent games empty case

2 files changed, 35 insertions, 22 deletions

diff --git a/components/recentGames.tsx b/components/recentGames.tsx
index 92855a1..a37f662 100644
--- a/components/recentGames.tsx
+++ b/components/recentGames.tsx
@@ -41,27 +41,35 @@ function GameOutcome(props: { game: gameInfo }) {
 export default function RecentGames(props: { games?: Array<gameInfo> }) {
 	return <div>
 		<h2>Recente partijen</h2>
-		<table width="100%" style={{ marginTop: "16px", textAlign: "center" }}>
-			<tbody>
-				<tr>
-					<th style={{ width: "50%" }}>Tegenstander</th>
-					<th style={{ width: "15%" }}>Uitkomst</th>
-					<th style={{ width: "15%" }}>Zetten</th>
-					<th style={{ width: "20%" }}>Datum</th>
-				</tr>
-				{
-					props.games?.map(game => <tr>
-						<td style={LeftAlignedTableColumn}>{game.opponent?.username}</td>
-						<GameOutcome game={game}/>
-						<td>{Math.max(0, game.moves.length -1)}</td>
-						<td style={RightAlignedTableColumn}>{(() => {
-							var timeCreated = new Date(game.created);
-							return friendlyTime(timeCreated);
-						})()}</td>
-					</tr>)
-				}
-			</tbody>
-		</table>
+		{
+			props.games?.length > 0 ?
+			<table width="100%" style={{ marginTop: "16px", textAlign: "center" }}>
+				<tbody>
+					<tr>
+						<th style={{ width: "50%" }}>Tegenstander</th>
+						<th style={{ width: "15%" }}>Uitkomst</th>
+						<th style={{ width: "15%" }}>Zetten</th>
+						<th style={{ width: "20%" }}>Datum</th>
+					</tr>
+					{
+						props.games?.map(game => <tr>
+							<td style={LeftAlignedTableColumn}>{game.opponent?.username}</td>
+							<GameOutcome game={game}/>
+							<td>{Math.max(0, game.moves.length -1)}</td>
+							<td style={RightAlignedTableColumn}>{(() => {
+								var timeCreated = new Date(game.created);
+								return friendlyTime(timeCreated);
+							})()}</td>
+						</tr>)
+					}
+				</tbody>
+			</table> :
+			<h1 style={{
+				textAlign: "center",
+				opacity: .6,
+				margin: "32px 64px"
+			}}>Deze gebruiker heeft nog geen partijen gespeeld</h1>
+		}
 	</div>
 }
 
diff --git a/readme.md b/readme.md
index 8614305..ccc6f5d 100644
--- a/readme.md
+++ b/readme.md
@@ -4,7 +4,12 @@
 
 ## This is a school project using Python and SQL
 
-Some of this project's code is in Dutch (commit messages, documents etc.), along with the whole website. I'm planning on adding some form of localization system, and I'll try to maintain this after the assignment deadline because I think this is a pretty cool project. I'll also be fixing issues/merging pr's after the deadline. I think the deadline is ~January 25th~ sometime in March? though I'm not sure about this.
+Some of this project's code is in Dutch (commit messages, documents etc.),
+along with the whole website. I'm planning on adding some form of localization
+system, and I'll try to maintain this after the assignment deadline because I
+think this is a pretty cool project. I'll also be fixing issues/merging pr's
+after the deadline. ~I think the deadline is January 25th sometime in March?
+though I'm not sure about this.~ The deadline is March 19th.
 
 ## Things that we'd like to have working: