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" ? ( + setCurrent(dir === "left" ? "register" : "login")} + infinite={false} + > +
+ + + + + + +
- ) : ( -
- - - - - - -
- )} +
); diff --git a/frontend/app/src/components/HeaderComponent.tsx b/frontend/app/src/components/HeaderComponent.tsx index 1b20934..6b754f7 100644 --- a/frontend/app/src/components/HeaderComponent.tsx +++ b/frontend/app/src/components/HeaderComponent.tsx @@ -5,7 +5,7 @@ import { SettingOutlined, UserOutlined, } from "@ant-design/icons"; -import { Layout, Menu, MenuProps, Popover, Select } from "antd"; +import { Layout, Menu, MenuProps, Popover } from "antd"; import React, { useState } from "react"; import AuthModal from "./AuthModal"; import "./styles.css"; diff --git a/frontend/app/src/components/queue/QueuesList.tsx b/frontend/app/src/components/queue/QueuesList.tsx index c9f4c11..fd0382d 100644 --- a/frontend/app/src/components/queue/QueuesList.tsx +++ b/frontend/app/src/components/queue/QueuesList.tsx @@ -17,7 +17,6 @@ type Queue = { const QueuesList = (): JSX.Element => { const { data, isLoading } = useGetQueuesQuery({}); - console.log(isLoading); return (