diff --git a/frontend/app/src/components/AuthModal.tsx b/frontend/app/src/components/AuthModal.tsx
index 4e605ee..d80c530 100644
--- a/frontend/app/src/components/AuthModal.tsx
+++ b/frontend/app/src/components/AuthModal.tsx
@@ -1,10 +1,10 @@
-import { Form, Input, Menu, MenuProps, Modal, Spin } from "antd";
+import { Carousel, Form, Input, Menu, MenuProps, Modal, Spin } from "antd";
import {
KeyOutlined,
LoadingOutlined,
UserAddOutlined,
} from "@ant-design/icons";
-import React, { useContext, useEffect, useState } from "react";
+import React, { useContext, useEffect, useRef, useState } from "react";
import {
TokenResponse,
useGetUserQuery,
@@ -21,6 +21,8 @@ const AuthModal = (props: {
setOpen: (arg0: boolean) => void;
}) => {
const navigate = useNavigate();
+ const messageApi = useContext(MessageContext);
+ const carousel = useRef();
const [loginForm] = Form.useForm();
const [registerForm] = Form.useForm();
@@ -33,7 +35,11 @@ const AuthModal = (props: {
}, [data, isFetching, useGetUserQuery]);
const [current, setCurrent] = useState("login");
- const messageApi = useContext(MessageContext);
+ useEffect(() => {
+ if (carousel?.current !== undefined) {
+ carousel.current.goTo(["login", "register"].indexOf(current));
+ }
+ }, [current]);
const [loginUser, { isLoading: isLoggingIn }] = useLoginMutation();
const [registerUser, { isLoading: isRegistering }] = useRegisterMutation();
@@ -48,11 +54,11 @@ const AuthModal = (props: {
.then((data: TokenResponse) => {
store.dispatch(updateToken(data.access_token));
})
+ .then(() => loginForm.resetFields())
.then(() => refetch())
.then(() => props.setOpen(false))
.then(() => navigate("/dashboard"))
.catch(() => messageApi.error(tr("Login failed!")));
- loginForm.resetFields();
};
const submitRegisterForm = (formData: {
@@ -63,6 +69,7 @@ const AuthModal = (props: {
}) => {
registerUser(formData)
.unwrap()
+ .then(() => submitLoginForm(formData))
.then(() => props.setOpen(false))
.catch(() => messageApi.error(tr("Registration failed!")));
};
@@ -108,7 +115,44 @@ const AuthModal = (props: {
/>
- {current === "register" ? (
+