PenaSide/front-hub
3
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

fix direct transition to auth routes

Browse Source
This commit is contained in:
nflnkr 2023-05-19 12:44:18 +03:00
parent 9178054cfa
commit a70ae04dae
3 changed files with 23 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/index.tsx
View File

@ -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 <Navigate to="/signin" replace state={{ backgroundLocation: location }} />;
if (location.state?.redirectTo === "/signup") return <Navigate to="/signup" replace state={{ backgroundLocation: location }} />;
return (
<>
{state?.backgroundLocation &&
{location.state?.backgroundLocation &&
<Routes>
<Route path="/signin" element={<SigninDialog />} />
<Route path="/signup" element={<SignupDialog />} />
</Routes>
}
<Routes location={state?.backgroundLocation || location}>
<Routes location={location.state?.backgroundLocation || location}>
<Route path="/" element={<Landing />} />
<Route path="/signin" element={<Navigate to="/" replace state={{ redirectTo: "/signin" }} />} />
<Route path="/signup" element={<Navigate to="/" replace state={{ redirectTo: "/signup" }} />} />
<Route element={<Layout />}>
<Route path="/tariffs" element={<Tariffs />} />
<Route path="/tariffs/time" element={<TariffPage />} />

11
src/pages/auth/Signin.tsx
View File

@ -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<boolean>(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);

11
src/pages/auth/Signup.tsx
View File

@ -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<boolean>(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);