webui: Add i18n

This commit is contained in:
Kevin Kandlbinder 2022-03-06 01:31:02 +01:00
parent ac5faca859
commit 9e05c54d81
30 changed files with 1098 additions and 112 deletions

View file

@ -1,12 +1,13 @@
import React, {useRef, useState} from "react";
import React, {useState} from "react";
import styles from "./AuthViews.module.scss";
import {ReactComponent as Logo} from "../../logo.svg";
import {Link, useLocation, useNavigate} from "react-router-dom";
import {Link, useLocation} from "react-router-dom";
import {AuthLocationState} from "../../layouts/AuthLayout";
import {useAppDispatch, useAppSelector} from "../../app/hooks";
import {selectAuth} from "../../features/auth/authSlice";
import {useAppDispatch} from "../../app/hooks";
import {Helmet} from "react-helmet";
import {Trans, useTranslation} from "react-i18next";
const RegisterView = () => {
const [username, setUsername] = useState("");
@ -19,22 +20,28 @@ const RegisterView = () => {
const dispatch = useAppDispatch()
const {t} = useTranslation()
const onSubmit = () => {
console.log(username, password)
console.log(username, password, matrix)
}
return <>
<Logo width={64} height={64} />
<h1>Register</h1>
<Helmet>
<title>{t("auth:register.htmlTitle", "Register with Veles")}</title>
</Helmet>
<h1><Trans i18nKey={"auth:register.title"}>Register</Trans></h1>
<form onSubmit={(e) => {e.preventDefault(); onSubmit()}} className={styles.authForm}>
<input onChange={(ev) => setUsername(ev.target.value)} value={username} placeholder={"Username"} autoCapitalize={"no"} autoCorrect={"no"} />
<input onChange={(ev) => setPassword(ev.target.value)} value={password} placeholder={"Password"} type={"password"} autoCapitalize={"no"} autoCorrect={"no"} />
<input onChange={(ev) => setMatrix(ev.target.value)} value={matrix} placeholder={"Matrix-Handle (@user:matrix.org)"} autoCapitalize={"no"} autoCorrect={"no"} />
<button onClick={() => onSubmit()}>Register</button>
<input onChange={(ev) => setUsername(ev.target.value)} value={username} placeholder={t("auth:username", "Username")} autoCapitalize={"no"} autoCorrect={"no"} />
<input onChange={(ev) => setPassword(ev.target.value)} value={password} placeholder={t("auth:password", "Password")} type={"password"} autoCapitalize={"no"} autoCorrect={"no"} />
<input onChange={(ev) => setMatrix(ev.target.value)} value={matrix} placeholder={t("auth:matrix_handle", "Matrix-Handle")+" (@user:matrix.org)"} autoCapitalize={"no"} autoCorrect={"no"} />
<button onClick={() => onSubmit()}><Trans i18nKey={"auth:register.register"}>Register</Trans></button>
</form>
<Link to={"/auth/login"} className={styles.mindChangedLink} aria-label={"Register"} state={locationState}>I already have an account</Link>
<Link to={"/auth/login"} className={styles.mindChangedLink} aria-label={t("auth:login.login", "Login")} state={locationState}><Trans i18nKey={"auth:register.login_instead"}>I already have an account</Trans></Link>
</>
}