aboutsummaryrefslogtreecommitdiff
path: root/FrontEnd/src/views
diff options
context:
space:
mode:
Diffstat (limited to 'FrontEnd/src/views')
-rw-r--r--FrontEnd/src/views/login/index.css8
-rw-r--r--FrontEnd/src/views/login/index.tsx159
2 files changed, 0 insertions, 167 deletions
diff --git a/FrontEnd/src/views/login/index.css b/FrontEnd/src/views/login/index.css
deleted file mode 100644
index aefe57e8..00000000
--- a/FrontEnd/src/views/login/index.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.login-container {
- max-width: 25em;
-}
-
-.login-container input[type="text"],
-.login-container input[type="password"] {
- width: 100%;
-}
diff --git a/FrontEnd/src/views/login/index.tsx b/FrontEnd/src/views/login/index.tsx
deleted file mode 100644
index cc1d9865..00000000
--- a/FrontEnd/src/views/login/index.tsx
+++ /dev/null
@@ -1,159 +0,0 @@
-import * as React from "react";
-import { Link, useNavigate } from "react-router-dom";
-import { useTranslation, Trans } from "react-i18next";
-
-import { useUser, userService } from "@/services/user";
-
-import AppBar from "../common/AppBar";
-import LoadingButton from "../common/button/LoadingButton";
-
-import "./index.css";
-
-const LoginPage: React.FC = () => {
- const { t } = useTranslation();
-
- const navigate = useNavigate();
-
- const [username, setUsername] = React.useState<string>("");
- const [usernameDirty, setUsernameDirty] = React.useState<boolean>(false);
- const [password, setPassword] = React.useState<string>("");
- const [passwordDirty, setPasswordDirty] = React.useState<boolean>(false);
- const [rememberMe, setRememberMe] = React.useState<boolean>(true);
- const [process, setProcess] = React.useState<boolean>(false);
- const [error, setError] = React.useState<string | null>(null);
-
- const user = useUser();
-
- React.useEffect(() => {
- if (user != null) {
- const id = setTimeout(() => navigate("/"), 3000);
- return () => {
- clearTimeout(id);
- };
- }
- }, [navigate, user]);
-
- if (user != null) {
- return (
- <>
- <AppBar />
- <p>{t("login.alreadyLogin")}</p>
- </>
- );
- }
-
- const submit = (): void => {
- if (username === "" || password === "") {
- setUsernameDirty(true);
- setPasswordDirty(true);
- return;
- }
-
- setProcess(true);
- userService
- .login(
- {
- username: username,
- password: password,
- },
- rememberMe
- )
- .then(
- () => {
- if (history.length === 0) {
- navigate("/");
- } else {
- navigate(-1);
- }
- },
- (e: Error) => {
- setProcess(false);
- setError(e.message);
- }
- );
- };
-
- const onEnterPressInPassword: React.KeyboardEventHandler = (e) => {
- if (e.key === "Enter") {
- submit();
- }
- };
-
- return (
- <div className="login-container container-fluid mt-2">
- <h1 className="cru-text-center cru-color-primary">{t("welcome")}</h1>
- <div className="cru-operation-dialog-group">
- <label className="cru-operation-dialog-label" htmlFor="username">
- {t("user.username")}
- </label>
- <input
- id="username"
- type="text"
- disabled={process}
- onChange={(e) => {
- setUsername(e.target.value);
- setUsernameDirty(true);
- }}
- value={username}
- />
- {usernameDirty && username === "" && (
- <div className="cru-operation-dialog-error-text">
- {t("login.emptyUsername")}
- </div>
- )}
- </div>
- <div className="cru-operation-dialog-group">
- <label className="cru-operation-dialog-label" htmlFor="password">
- {t("user.password")}
- </label>
- <input
- id="password"
- type="password"
- disabled={process}
- onChange={(e) => {
- setPassword(e.target.value);
- setPasswordDirty(true);
- }}
- value={password}
- onKeyDown={onEnterPressInPassword}
- />
- {passwordDirty && password === "" && (
- <div className="cru-operation-dialog-error-text">
- {t("login.emptyPassword")}
- </div>
- )}
- </div>
- <div className="cru-operation-dialog-group">
- <input
- id="remember-me"
- type="checkbox"
- checked={rememberMe}
- onChange={(e) => {
- setRememberMe(e.currentTarget.checked);
- }}
- />
- <label className="cru-operation-dialog-inline-label">
- {t("user.rememberMe")}
- </label>
- </div>
- {error ? <p className="cru-color-danger">{t(error)}</p> : null}
- <div className="cru-text-end">
- <LoadingButton
- loading={process}
- onClick={(e) => {
- submit();
- e.preventDefault();
- }}
- disabled={username === "" || password === "" ? true : undefined}
- >
- {t("user.login")}
- </LoadingButton>
- </div>
- <Trans i18nKey="login.noAccount">
- 0<Link to="/register">1</Link>2
- </Trans>
- </div>
- );
-};
-
-export default LoginPage;