diff --git a/SerpentRace_Frontend/src/App.jsx b/SerpentRace_Frontend/src/App.jsx index 7ed485e4..68e6f66b 100644 --- a/SerpentRace_Frontend/src/App.jsx +++ b/SerpentRace_Frontend/src/App.jsx @@ -17,6 +17,7 @@ import GameScreen from "./pages/Game/GameScreen" import Reports from "./pages/Report/Reports" import Lobby from "./pages/Lobby/Lobby" import { ToastConfig } from "./components/Toastify/toastifyServices" // ✅ fontos: named import, nem default! +import VerifyEmailPage from "./pages/Auth/VerifyEmailPage" @@ -50,6 +51,7 @@ function App() { <> + } /> } /> } /> } /> diff --git a/SerpentRace_Frontend/src/api/userApi.js b/SerpentRace_Frontend/src/api/userApi.js index 24e6a546..ae8cf15c 100644 --- a/SerpentRace_Frontend/src/api/userApi.js +++ b/SerpentRace_Frontend/src/api/userApi.js @@ -45,3 +45,16 @@ export const getUserStats = async () => { throw error } } + + +// Email verification - POST +export const verifyEmail = async (token) => { + try { + const response = await apiClient.post(`/users/verify-email/${token}`); + return response; + } catch (error) { + throw error; + } +}; + + diff --git a/SerpentRace_Frontend/src/pages/Auth/VerifyEmailPage.jsx b/SerpentRace_Frontend/src/pages/Auth/VerifyEmailPage.jsx new file mode 100644 index 00000000..fb4cd655 --- /dev/null +++ b/SerpentRace_Frontend/src/pages/Auth/VerifyEmailPage.jsx @@ -0,0 +1,89 @@ +import { useEffect, useState, useRef } from "react"; +import { useNavigate, useLocation } from "react-router-dom"; +import Background from "../../assets/backgrounds/Background"; +import { notifySuccess, notifyError } from "../../components/Toastify/toastifyServices"; +import { verifyEmail } from "../../api/userApi"; + +export default function VerifyEmailPage() { + const navigate = useNavigate(); + const location = useLocation(); + const [status, setStatus] = useState("loading"); + const [message, setMessage] = useState("Email címe hitelesítés alatt..."); + const hasNotified = useRef(false); // <-- ez biztosítja, hogy csak egyszer legyen a toast + + useEffect(() => { + const queryParams = new URLSearchParams(location.search); + const token = queryParams.get("token"); + + if (!token) { + setStatus("error"); + setMessage("Hiányzó hitelesítő token!"); + if (!hasNotified.current) { + notifyError("❌ Hiányzó hitelesítő token!"); + hasNotified.current = true; + } + return; + } + + const verify = async () => { + try { + const response = await verifyEmail(token); + const data = response.data; + + if (data?.success) { + setStatus("success"); + setMessage("Sikeres hitelesítés!"); + if (!hasNotified.current) { + notifySuccess("✅ Email címe sikeresen hitelesítve!"); + hasNotified.current = true; + } + setTimeout(() => navigate("/login"), 2500); + } else { + throw new Error(data?.message || "Sikertelen hitelesítés"); + } + } catch (err) { + setStatus("error"); + setMessage("Sikertelen hitelesítés. Kérjük, vegye fel velünk a kapcsolatot!"); + if (!hasNotified.current) { + notifyError("❌ Sikertelen hitelesítés!"); + hasNotified.current = true; + } + } + }; + + verify(); + }, [location, navigate]); + + return ( +
+
+ +
+ +
+ {status === "loading" && ( +
+
+

{message}

+
+ )} + + {status === "success" && ( +
+ +

{message}

+

Átirányítás a bejelentkezéshez...

+
+ )} + + {status === "error" && ( +
+ +

{message}

+

support@serpentrace.hu

+
+ )} +
+
+ ); +}