From e02f7ee46876d32ca094c2b5cf3647248baf7645 Mon Sep 17 00:00:00 2001 From: physcik Date: Sun, 3 May 2026 21:26:49 +0500 Subject: Register page + logout --- front/src/Authentication/LoginPage.tsx | 4 ++- front/src/Authentication/LogoutPage.tsx | 11 ++++++ front/src/Authentication/RegisterPage.tsx | 59 +++++++++++++++++++++++++++++++ 3 files changed, 73 insertions(+), 1 deletion(-) create mode 100644 front/src/Authentication/LogoutPage.tsx create mode 100644 front/src/Authentication/RegisterPage.tsx (limited to 'front/src/Authentication') diff --git a/front/src/Authentication/LoginPage.tsx b/front/src/Authentication/LoginPage.tsx index e98c506..e673418 100644 --- a/front/src/Authentication/LoginPage.tsx +++ b/front/src/Authentication/LoginPage.tsx @@ -3,7 +3,6 @@ import { useContext, useState } from "react"; import { useNavigate } from "react-router"; import { BackendURL } from "../Config"; import { Authentication, SaveState } from "./ContextProvider"; -import { useCookies } from 'react-cookie'; import { GetLocalizedString } from "../Locales/Locales"; import { LanguageContext } from "../Locales/Context"; @@ -40,6 +39,9 @@ function LoginPage() { window.location.reload(); }); }}> { GetLocalizedString("Log in", lang) } + + +

Don't have an account? Click here.

); } diff --git a/front/src/Authentication/LogoutPage.tsx b/front/src/Authentication/LogoutPage.tsx new file mode 100644 index 0000000..a234985 --- /dev/null +++ b/front/src/Authentication/LogoutPage.tsx @@ -0,0 +1,11 @@ +import { useNavigate } from "react-router"; + +function LogoutPage() { + const navigate = useNavigate(); + + document.cookie = "X-AUTH-TOKEN=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; + navigate("/"); + return (

Click here if you were not redirected already

); +} + +export default LogoutPage; diff --git a/front/src/Authentication/RegisterPage.tsx b/front/src/Authentication/RegisterPage.tsx new file mode 100644 index 0000000..b30b182 --- /dev/null +++ b/front/src/Authentication/RegisterPage.tsx @@ -0,0 +1,59 @@ +import axios from "axios"; +import { useContext, useState } from "react"; +import { useNavigate } from "react-router"; +import { BackendURL } from "../Config"; +import { Authentication, SaveState } from "./ContextProvider"; +import { GetLocalizedString } from "../Locales/Locales"; +import { LanguageContext } from "../Locales/Context"; + +const RegisterURL = `${BackendURL}/auth/register`; + +function RegisterPage() { + const lang = useContext(LanguageContext); + + const [username, setUsername] = useState(""); + const [passw, setPassw] = useState(""); + const navigate = useNavigate(); + + function SetAuthState(newAuthState: Authentication | null) { + if (newAuthState) { + console.log(`Logging in as ${newAuthState.User}...`); + } else { + console.log(`Logging out...`); + } + SaveState(newAuthState, (cookie: string) => { + document.cookie = `X-AUTH-TOKEN=${cookie}; path=/;`; + }) + } + + return ( +
+

{ GetLocalizedString("Username", lang) }

+ setUsername(ev.target.value)} /> +

{ GetLocalizedString("Password", lang) }

+ setPassw(ev.target.value)} /> + +
+ ); +} + +async function Register(username: string, passw: string, onSuccess: (data: Authentication) => void) { + await axios.post( + RegisterURL, { + Username: username, + Password: passw + } + ).then(resp => { + onSuccess(resp.data); + }).catch(err => { + console.log(`Failed to send a login responce: ${err}`); + }); +} + +export default RegisterPage; -- cgit v1.3