csatlakozas-mukodesdemodemodemo

SerpentRace_Frontend/src/pages/Landing/Home.jsx

@@ -1,24 +1,75 @@
 // src/pages/Home/Home.jsx
 // Régi PlayMenu-s oldal, "Home" néven
 
-import { useEffect } from "react"
+import { useEffect, useState } from "react"
+import { useNavigate } from "react-router-dom"
 import useRequireAuth from "../../hooks/useRequireAuth"
 import Navbar from "../../components/Navbar/Navbar"
 import Footer from "../../components/Footer/Footer.jsx"
 import Background from "../../assets/backgrounds/Background.jsx"
 import PlayMenu from "../../components/Landingpage/PlayMenu.jsx"
+import { joinGame } from "../../api/gameApi.js"
 
 export default function Home() {
+  const navigate = useNavigate()
   // a hook inicializálja a user-t a localStorage-ból és visszaadja a state-et + settert
   const [user, setUser] = useRequireAuth({ redirect: false }) // no redirect on unauthenticated visitors
+  const [isJoining, setIsJoining] = useState(false)
 
-  // Dummy callbackok és user példa
-  const handleJoinGame = (code) => {
-    alert(`Csatlakozás játékhoz: ${code}`)
+  // Join game handler - csatlakozás játékhoz kóddal
+  const handleJoinGame = async (code) => {
+    if (!user) {
+      alert('Kérlek először jelentkezz be!')
+      navigate('/login')
+      return
+    }
+
+    console.log('=== JOIN GAME DEBUG ===')
+    console.log('Current user:', user)
+    console.log('Game code:', code)
+    console.log('LocalStorage username:', localStorage.getItem('username'))
+    console.log('LocalStorage authLevel:', localStorage.getItem('authLevel'))
+    console.log('======================')
+
+    setIsJoining(true)
+    try {
+      const joinData = {
+        gameCode: code.toUpperCase(),
+        playerName: user || 'Player',
+      }
+
+      console.log('Sending join request with:', joinData)
+      const response = await joinGame(joinData)
+      console.log('Joined game:', response)
+      
+      // Backend returns game object directly
+      if (response.gameToken) {
+        localStorage.setItem('gameToken', response.gameToken)
+      }
+      
+      navigate('/lobby', { state: { gameCode: code.toUpperCase() } })
+    } catch (err) {
+      const errorMsg = err.response?.data?.error || err.response?.data?.message || 'Nem sikerült csatlakozni a játékhoz'
+      alert(errorMsg)
+      console.error('Join game error:', err)
+      console.error('Error details:', err.response?.data)
+    } finally {
+      setIsJoining(false)
+    }
   }
+
+  // Create game handler - új játék létrehozása
   const handleCreateGame = () => {
-    alert("Új játék létrehozása")
+    if (!user) {
+      alert('Kérlek először jelentkezz be!')
+      navigate('/login')
+      return
+    }
+    
+    // Navigate to choose deck page to start game creation flow
+    navigate('/choosedeck')
   }
+
   const userObj = { name: user }
 
   // ha szükséges a user módosítása máshol: setUser("újnév") automatikusan menti localStorage-be