diff --git a/src/index.tsx b/src/index.tsx index cbcaf82..c840792 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from "react"; import ReactDOM from "react-dom/client"; -import { BrowserRouter, Route, Routes, useLocation } from "react-router-dom"; +import { BrowserRouter, Navigate, Route, Routes, useLocation } from "react-router-dom"; import { CssBaseline, ThemeProvider } from "@mui/material"; import Faq from "./pages/Faq/Faq"; import Wallet from "./pages/Wallet"; @@ -41,18 +41,21 @@ const App = () => { }); }, [userId]); - const state = (location.state as { backgroundLocation?: Location; }); + if (location.state?.redirectTo === "/signin") return ; + if (location.state?.redirectTo === "/signup") return ; return ( <> - {state?.backgroundLocation && + {location.state?.backgroundLocation && } /> } /> } - + } /> + } /> + } /> }> } /> } /> diff --git a/src/pages/auth/Signin.tsx b/src/pages/auth/Signin.tsx index f727df2..c746900 100644 --- a/src/pages/auth/Signin.tsx +++ b/src/pages/auth/Signin.tsx @@ -9,9 +9,9 @@ import PenaLogo from "@components/PenaLogo"; import { enqueueSnackbar } from "notistack"; import { Link as RouterLink } from "react-router-dom"; import { object, string } from "yup"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { LoginRequest, LoginResponse } from "@root/model/auth"; -import { setUserId } from "@root/stores/user"; +import { setUserId, useUserStore } from "@root/stores/user"; interface Values { @@ -31,6 +31,7 @@ const validationSchema = object({ export default function SigninDialog() { const [isDialogOpen, setIsDialogOpen] = useState(true); + const user = useUserStore(state => state.user); const theme = useTheme(); const upMd = useMediaQuery(theme.breakpoints.up("md")); const navigate = useNavigate(); @@ -49,8 +50,8 @@ export default function SigninDialog() { useToken: false, withCredentials: true, }).then(result => { - setUserId(result._id); navigate("/tariffs"); + setUserId(result._id); }).catch((error: any) => { enqueueSnackbar(error.response?.data?.message ?? error.message ?? "Unknown error"); }).finally(() => { @@ -59,6 +60,10 @@ export default function SigninDialog() { }, }); + useEffect(function redirectIfSignedIn() { + if (user) navigate("/tariffs", { replace: true }); + }, [navigate, user]); + function handleClose() { setIsDialogOpen(false); setTimeout(() => navigate("/"), theme.transitions.duration.leavingScreen); diff --git a/src/pages/auth/Signup.tsx b/src/pages/auth/Signup.tsx index 6cfde6e..4a11d72 100644 --- a/src/pages/auth/Signup.tsx +++ b/src/pages/auth/Signup.tsx @@ -9,9 +9,9 @@ import { enqueueSnackbar } from "notistack"; import { authStore } from "@stores/makeRequest"; import { Link as RouterLink } from "react-router-dom"; import { object, ref, string } from "yup"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { RegisterRequest, RegisterResponse } from "@root/model/auth"; -import { setUserId } from "@root/stores/user"; +import { setUserId, useUserStore } from "@root/stores/user"; interface Values { @@ -34,6 +34,7 @@ const validationSchema = object({ export default function SignupDialog() { const [isDialogOpen, setIsDialogOpen] = useState(true); + const user = useUserStore(state => state.user); const theme = useTheme(); const upMd = useMediaQuery(theme.breakpoints.up("md")); const navigate = useNavigate(); @@ -54,8 +55,8 @@ export default function SignupDialog() { useToken: false, withCredentials: true, }).then(result => { - setUserId(result._id); navigate("/tariffs"); + setUserId(result._id); }).catch((error: any) => { enqueueSnackbar(error.response?.data?.message ?? error.message ?? "Unknown error"); }).finally(() => { @@ -64,6 +65,10 @@ export default function SignupDialog() { }, }); + useEffect(function redirectIfSignedIn() { + if (user) navigate("/tariffs", { replace: true }); + }, [navigate, user]); + function handleClose() { setIsDialogOpen(false); setTimeout(() => navigate("/"), theme.transitions.duration.leavingScreen);