++

- Can now join games
- Can continue games using table
- Can create accounts
- Can create Games

frontend/src/pages/joinGame.jsx

@@ -1,20 +1,16 @@
-
-import React, { useState } from 'react';
+import React, { useState, useContext } from 'react';
 import { useNavigate } from 'react-router-dom';
+import axios from 'axios';
+import { UserContext } from '../context/UserContext';
 
 const JoinGamePage = () => {
   const [gameCode, setGameCode] = useState('');
   const [error, setError] = useState('');
   const navigate = useNavigate();
-
-  // Mock function to check if game exists (replace with your real logic)
-  const checkGameExists = (code) => {
-    const availableGames = ['game123', 'game456', 'game789']; // Example game codes
-    return availableGames.includes(code);
-  };
+  const { userId } = useContext(UserContext);
 
   // Handle form submission
-  const handleJoinGame = (e) => {
+  const handleJoinGame = async (e) => {
     e.preventDefault();
 
     if (gameCode.trim() === '') {
@@ -22,14 +18,16 @@ const JoinGamePage = () => {
       return;
     }
 
-    if (checkGameExists(gameCode)) {
-      // Simulate adding user to the game (replace with your actual logic)
-      setError('');
-      setTimeout(() => {
-        navigate('/games'); // Redirect to the games page
-      }, 1000);
-    } else {
-      setError('Game not found!');
+    try {
+      const response = await axios.post(`http://localhost:5000/joinGame/${gameCode}`, { userId });
+      if (response.status === 201) {
+        setError('');
+          navigate(`/games/${gameCode}`); // Redirect to the games page
+      } else {
+        setError('Failed to join the game.');
+      }
+    } catch (err) {
+      setError(err.response ? err.response.data.error : 'Error joining the game');
     }
   };
 
@@ -50,4 +48,4 @@ const JoinGamePage = () => {
   );
 };
 
-export default JoinGamePage;
+export default JoinGamePage;