Correctly implement end of game

1 files changed, 24 insertions, 8 deletions

diff --git a/front/pages/index.tsx b/front/pages/index.tsx
index 9dd7293..17dca58 100644
--- a/front/pages/index.tsx
+++ b/front/pages/index.tsx
@@ -18,6 +18,20 @@ interface GameState {
 const rankStrs = ['', 'A', '2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K'];
 const suitChars = ['♣', '♦', '♥', '♠'];
 
+const rules = String.raw`Welcome to BSX!\n
+<br/>
+There are only 5 simple rules!<br />
+
+1. You will first be dealt 5 cards.
+
+2. At the beginning of each round, you must rearrange the order of your cards and place them face down in a stack.
+
+3. During the round, players go around in a circle, claiming increasingly greater numbers. If it is you turn to claim a number, you must either claim a larger number than the previously claimed number or call BS. If you call BS, the previous player must flip over their claimed number of black (clubs or spades) cards from the tops of everyone's stacks.
+
+4. If the previous player manages to flip over their claimed number of black cards, you must choose a card from your stack to give up. Otherwise, the previous player must choose one of their cards to give up.
+
+5. If you give up all your cards, you lose! Last player remaining wins!`
+
 function useForceUpdate(){
     const [value, setValue] = useState(0);
     return () => setValue(value => value + 1);
@@ -71,14 +85,16 @@ export default function Game() {
 	if (!socket) return null;
 	if (!loggedIn) {
 		return (
-			<LoginForm
-				socket={socket}
-				finish={(s) => {
-					setLoggedIn(true);
-					setUsername(s);
-				}}
-				username={username}
-			/>
+			<>
+				<LoginForm
+					socket={socket}
+					finish={(s) => {
+						setLoggedIn(true);
+						setUsername(s);
+					}}
+					username={username}
+				/>
+			</>
 		);
 	}
 	if (!room) {