diff --git a/src/index.tsx b/src/index.tsx index 8817b12..063472b 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,9 +1,9 @@ import * as React from "react"; import CssBaseline from "@mui/material/CssBaseline"; -import { SnackbarProvider } from 'notistack'; -import { ThemeProvider } from '@mui/material/styles'; -import { createRoot } from 'react-dom/client'; -import { BrowserRouter, Routes, Route, Outlet, Navigate } from "react-router-dom"; +import { SnackbarProvider } from "notistack"; +import { ThemeProvider } from "@mui/material/styles"; +import { createRoot } from "react-dom/client"; +import { BrowserRouter, Routes, Route } from "react-router-dom"; import theme from "./theme"; import PublicRoute from "@kitUI/publicRoute"; import PrivateRoute from "@kitUI/privateRoute"; @@ -21,44 +21,82 @@ import PromocodeManagement from "@pages/dashboard/Content/PromocodeManagement"; import Support from "@root/pages/dashboard/Content/Support/Support"; import "./index.css"; - const componentsArray = [ - ["/users", ], - ["/entities",], - ["/tariffs", ], - ["/discounts", ], - ["/promocode", ], - ["/support", ], - ["/support/:ticketId", ], -] + ["/users", ], + ["/entities", ], + ["/tariffs", ], + ["/discounts", ], + ["/promocode", ], + ["/support", ], + ["/support/:ticketId", ], +]; -const container = document.getElementById('root'); +const container = document.getElementById("root"); const root = createRoot(container!); -root.render( - - - - - - - } /> - } /> - } /> - } /> - } /> - }> - {componentsArray.map((e:any, i) => ( - - ))} - - } - /> - - - - - -); \ No newline at end of file +root.render( + + + + + + + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + /> + + + + } + > + {componentsArray.map((e: any, i) => ( + + ))} + + + } /> + + + + + +); diff --git a/src/kitUI/privateRoute.tsx b/src/kitUI/privateRoute.tsx index 2a64373..f8bd098 100644 --- a/src/kitUI/privateRoute.tsx +++ b/src/kitUI/privateRoute.tsx @@ -1,12 +1,13 @@ +import { authStore } from "@root/stores/auth"; import * as React from "react"; -import { useLocation, Navigate } from 'react-router-dom' +import { useLocation, Navigate } from "react-router-dom"; export default ({ children }: any) => { - const location = useLocation() -//Если пользователь авторизован, перенаправляем его на нужный путь. Иначе выкидываем в регистрацию - if (localStorage.getItem('AT')) { - return children - } - return - -} + const { token } = authStore(); + const location = useLocation(); + //Если пользователь авторизован, перенаправляем его на нужный путь. Иначе выкидываем в регистрацию + if (token) { + return children; + } + return ; +}; diff --git a/src/kitUI/publicRoute.tsx b/src/kitUI/publicRoute.tsx index 377b655..4759b4a 100644 --- a/src/kitUI/publicRoute.tsx +++ b/src/kitUI/publicRoute.tsx @@ -1,12 +1,16 @@ -import * as React from "react"; -import { useLocation, Navigate } from 'react-router-dom' +import { useLocation, Navigate } from "react-router-dom"; -export default ({ children }: any) => { - const location = useLocation() -//Если пользователь авторизован, перенаправляем его в приложение. Иначе пускаем куда хотел - if (localStorage.getItem('AT')) { - return - } - return children +import { authStore } from "@root/stores/auth"; -} +const PublicRoute = ({ children }: any) => { + const location = useLocation(); + const { token } = authStore(); + + if (token) { + return ; + } + + return children; +}; + +export default PublicRoute; diff --git a/src/pages/Authorization/signin.tsx b/src/pages/Authorization/signin.tsx index 9cf93c4..80503b0 100644 --- a/src/pages/Authorization/signin.tsx +++ b/src/pages/Authorization/signin.tsx @@ -19,48 +19,55 @@ interface Values { function validate(values: Values) { const errors = {} as any; + if (!values.email) { errors.email = "Required"; } + if (!values.password) { errors.password = "Required"; - } else if (!/^[\S]{8,25}$/i.test(values.password)) { + } + + if (values.password && !/^[\S]{8,25}$/i.test(values.password)) { errors.password = "Invalid password"; } + return errors; } -export default () => { + +const SigninForm = () => { const theme = useTheme(); const navigate = useNavigate(); - const [isReady, setIsReady] = React.useState(true); + const [isReady] = React.useState(true); + const { makeRequest } = authStore(); + const initialValues: Values = { + email: "", + password: "", + }; + + const onSignFormSubmit = (values: Values) => { + makeRequest({ + url: "https://admin.pena.digital/auth/login", + body: { + email: values.email, + password: values.password, + }, + useToken: false, + }) + .then((e) => { + console.log(e); + navigate("/users"); + }) + .catch((e) => { + console.log(e); + enqueueSnackbar(e.message ? e.message : `Unknown error`); + }); + }; + return ( - { - makeRequest({ - url: "https://admin.pena.digital/auth/login", - body: { - email: values.email, - password: values.password, - }, - useToken: false, - }) - .then((e) => { - console.log(e); - navigate("/users"); - }) - .catch((e) => { - console.log(e); - enqueueSnackbar(e.message ? e.message : `Unknown error`); - }); - }} - > +
{ ); }; + +export default SigninForm; diff --git a/src/stores/auth.ts b/src/stores/auth.ts index 50e8ee0..24ad1b6 100644 --- a/src/stores/auth.ts +++ b/src/stores/auth.ts @@ -1,4 +1,4 @@ -import axios, { AxiosResponse } from "axios"; +import axios, { AxiosError, AxiosResponse } from "axios"; import { create } from "zustand"; import { devtools } from "zustand/middleware"; @@ -60,7 +60,7 @@ async function makeRequest({ if (contentType) headers["Content-Type"] = "application/json"; try { - const response = await axios>({ + const { data } = await axios>({ url, method, headers, @@ -68,12 +68,14 @@ async function makeRequest({ signal, }); - if (response.data?.accessToken) { - HC(response.data.accessToken); + if (data?.accessToken) { + HC(data.accessToken); } - return response.data; - } catch (error: any) { + return data; + } catch (nativeError: unknown) { + const error = nativeError as AxiosError; + if (error?.response?.status === 401 && counterRefresh) { const refreshResponse = await refresh(); if (refreshResponse.data?.accessToken) HC(refreshResponse.data.accessToken);