summaryrefslogtreecommitdiff
path: root/front/src/Authentication/RegisterPage.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'front/src/Authentication/RegisterPage.tsx')
-rw-r--r--front/src/Authentication/RegisterPage.tsx59
1 files changed, 59 insertions, 0 deletions
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<string>("");
+ const [passw, setPassw] = useState<string>("");
+ 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 (
+ <div>
+ <h2> { GetLocalizedString("Username", lang) } </h2>
+ <input onChange={ev => setUsername(ev.target.value)} />
+ <h2> { GetLocalizedString("Password", lang) } </h2>
+ <input onChange={ev => setPassw(ev.target.value)} />
+ <button onClick={() => {
+ Register(username, passw, (data) => {
+ SetAuthState(data);
+ navigate("/");
+ window.location.reload();
+ });
+ }}> { GetLocalizedString("Register", lang) } </button>
+ </div>
+ );
+}
+
+async function Register(username: string, passw: string, onSuccess: (data: Authentication) => void) {
+ await axios.post<Authentication>(
+ RegisterURL, {
+ Username: username,
+ Password: passw
+ }
+ ).then(resp => {
+ onSuccess(resp.data);
+ }).catch(err => {
+ console.log(`Failed to send a login responce: ${err}`);
+ });
+}
+
+export default RegisterPage;