From d380327c9d218eb46fa7ae6902cc1cc74778bd70 Mon Sep 17 00:00:00 2001 From: Anastasia Sergeeva Date: Sun, 11 Jun 2023 18:58:12 +0300 Subject: [PATCH 1/2] refactor: separate Routing logic into Routing component --- src/Routing.tsx | 153 +++++++++++++++++++++++++++++++++++++ src/components/App/App.tsx | 134 ++++++-------------------------- 2 files changed, 175 insertions(+), 112 deletions(-) create mode 100644 src/Routing.tsx diff --git a/src/Routing.tsx b/src/Routing.tsx new file mode 100644 index 0000000..45ba870 --- /dev/null +++ b/src/Routing.tsx @@ -0,0 +1,153 @@ +import { Route, Routes } from "react-router-dom"; +import { ProtectedRoutes } from "@/components/ProtectedRoutes.js"; +import { Main } from "@/pages/main/Main.js"; +import { Tests } from "@/pages/tests/Tests.js"; +import { Test } from "@/components/Test/Test.js"; +import { Advices } from "@/pages/advices/Advices.js"; +import { Events } from "@/pages/events/Events.js"; +import { Bookmarks } from "@/pages/bookmarks/Bookmarks.js"; +import { Calendar } from "@/pages/calendar/Calendar.js"; +import { Account } from "@/pages/account/Account.js"; +import { Myteam } from "@/components/Myteam/Myteam.js"; +import { LoginPage } from "@/pages/login/LoginPage.js"; +import { RegisterPage } from "@/pages/register/RegisterPage.js"; +import { RefreshPasswordPage } from "@/pages/refreshpassword/RefreshPasswordPage.js"; +import React from "react"; + +interface Props { + loggedIn: any; + handleSignOut: any; + allTestsResults: any; + expressTest: any; + handleSendTestResult: any; + resultOfPsychoTest: any; + handleChangeUserInfo: any; + success: any; + error: any; + closeErrorPopup: any; + popupOpened: any; + resetMessages: any; + employees: any; + handleSendInviteCode: any; + handleLogin: any; + handleRegister: any; + handleSendResetCode: any; + handleResetPassword: any; +} +export const Routing: React.FC = ({ + loggedIn, + handleSignOut, + allTestsResults, + expressTest, + handleSendTestResult, + resultOfPsychoTest, + handleChangeUserInfo, + success, + error, + closeErrorPopup, + popupOpened, + resetMessages, + employees, + handleSendInviteCode, + handleLogin, + handleRegister, + handleSendResetCode, + handleResetPassword, +}) => { + return ( + + + } + > + } /> + + } + /> + + + } + /> + + } /> + + } /> + + } /> + + } /> + + } + /> + + } + /> + + + } + /> + + } + /> + + } + /> + + ); +}; diff --git a/src/components/App/App.tsx b/src/components/App/App.tsx index bca6fe2..f38b50a 100644 --- a/src/components/App/App.tsx +++ b/src/components/App/App.tsx @@ -1,21 +1,8 @@ import { useEffect, useState } from "react"; -import { Route, Routes, useNavigate } from "react-router-dom"; - -import { Main } from "../../pages/main/Main"; -import { Tests } from "../../pages/tests/Tests"; -import { Test } from "../Test/Test"; -import { Advices } from "../../pages/advices/Advices"; -import { Events } from "../../pages/events/Events"; -import { Bookmarks } from "../../pages/bookmarks/Bookmarks"; -import { Calendar } from "../../pages/calendar/Calendar"; -import { Myteam } from "../Myteam/Myteam"; +import { useNavigate } from "react-router-dom"; import { FormikValues } from "formik"; import styles from "./app.module.css"; -import { ProtectedRoutes } from "@/components/ProtectedRoutes"; -import { RegisterPage } from "@/pages/register/RegisterPage"; -import { RefreshPasswordPage } from "@/pages/refreshpassword/RefreshPasswordPage"; -import { LoginPage } from "@/pages/login/LoginPage"; import { ExpressDiagnoseResponse, jwtTypes, @@ -28,7 +15,6 @@ import { import * as ApiAuth from "@/shared/api/ApiAuth"; import * as Api from "@/shared/api/Api"; import { useLocation } from "react-router"; -import { Account } from "@/pages/account/Account"; import { useAppDispatch, useAppSelector } from "@/store/hooks"; import { resetCurrentUser, @@ -44,6 +30,7 @@ import { setCurrentUserLastName, setCurrentUserPosition, } from "@/store/reducers/currentUser/currentUserReducer"; +import { Routing } from "@/Routing"; export const App = () => { const [loggedIn, setLoggedIn] = useState(false); @@ -304,103 +291,26 @@ export const App = () => { return (
- - - } - > - } /> - - } - /> - - - } - /> - - } /> - - } /> - - } /> - - } /> - - } - /> - - } - /> - - - } - /> - - } - /> - - } - /> - +
); }; From a2fedcbad64c641bf47d86ac41c583d0668aef44 Mon Sep 17 00:00:00 2001 From: Anastasia Sergeeva Date: Sun, 11 Jun 2023 21:04:58 +0300 Subject: [PATCH 2/2] refactor: rename InfoPopup to AlertPopup and change its placement in App, delete it from all components --- src/Routing.tsx | 44 ++----------------- .../AddEmployeePopup/AddEmployeePopup.tsx | 15 ------- src/components/App/App.tsx | 10 +++-- .../EmailFormRefresh/EmailFormRefresh.tsx | 25 ----------- src/components/Myteam/Myteam.tsx | 9 ---- .../PasswordFormRefresh.tsx | 15 ------- src/pages/account/Account.tsx | 19 +------- src/pages/login/LoginPage.tsx | 19 +------- .../refreshpassword/RefreshPasswordPage.tsx | 19 +------- src/pages/register/RegisterPage.tsx | 19 +------- src/shared/styles/styles.css | 39 ---------------- .../AlertPopup.tsx} | 10 ++--- .../alertpopup.module.css} | 0 .../ui/{infoPopup => AlertPopup}/success.svg | 0 .../{infoPopup => AlertPopup}/warning__28.svg | 0 15 files changed, 19 insertions(+), 224 deletions(-) rename src/shared/ui/{infoPopup/InfoPopup.tsx => AlertPopup/AlertPopup.tsx} (74%) rename src/shared/ui/{infoPopup/infopopup.module.css => AlertPopup/alertpopup.module.css} (100%) rename src/shared/ui/{infoPopup => AlertPopup}/success.svg (100%) rename src/shared/ui/{infoPopup => AlertPopup}/warning__28.svg (100%) diff --git a/src/Routing.tsx b/src/Routing.tsx index 45ba870..9f0063c 100644 --- a/src/Routing.tsx +++ b/src/Routing.tsx @@ -23,9 +23,6 @@ interface Props { resultOfPsychoTest: any; handleChangeUserInfo: any; success: any; - error: any; - closeErrorPopup: any; - popupOpened: any; resetMessages: any; employees: any; handleSendInviteCode: any; @@ -43,9 +40,6 @@ export const Routing: React.FC = ({ resultOfPsychoTest, handleChangeUserInfo, success, - error, - closeErrorPopup, - popupOpened, resetMessages, employees, handleSendInviteCode, @@ -88,24 +82,13 @@ export const Routing: React.FC = ({ } /> - } + element={} /> = ({ } /> - - } - /> + } /> - } + element={} /> = ({ } /> diff --git a/src/components/AddEmployeePopup/AddEmployeePopup.tsx b/src/components/AddEmployeePopup/AddEmployeePopup.tsx index 92fd1fb..15c5de4 100644 --- a/src/components/AddEmployeePopup/AddEmployeePopup.tsx +++ b/src/components/AddEmployeePopup/AddEmployeePopup.tsx @@ -1,16 +1,12 @@ import { AddEmployeeForm } from "@/components/AddEmployeeForm/AddEmployeeForm"; import styles from "./addemployeepopup.module.css"; import React from "react"; -import { InfoPopup } from "@/shared/ui/infoPopup/InfoPopup"; interface Props { closeAddPopup: () => void; addPopupVisible: boolean; handleSendInviteCode: (email: string) => Promise; success: string; - error: string; - closeErrorPopup: () => void; - popupOpened: boolean; } export const AddEmployeePopup: React.FC = ({ @@ -18,9 +14,6 @@ export const AddEmployeePopup: React.FC = ({ addPopupVisible, handleSendInviteCode, success, - error, - closeErrorPopup, - popupOpened, }) => { const handleCloseOutside = ( event: React.MouseEvent @@ -52,14 +45,6 @@ export const AddEmployeePopup: React.FC = ({ addPopupVisible={addPopupVisible} /> {success &&
{success}
} - {error && ( - - )} ); diff --git a/src/components/App/App.tsx b/src/components/App/App.tsx index f38b50a..b984cbe 100644 --- a/src/components/App/App.tsx +++ b/src/components/App/App.tsx @@ -31,6 +31,7 @@ import { setCurrentUserPosition, } from "@/store/reducers/currentUser/currentUserReducer"; import { Routing } from "@/Routing"; +import { AlertPopup } from "@/shared/ui/AlertPopup/AlertPopup"; export const App = () => { const [loggedIn, setLoggedIn] = useState(false); @@ -291,6 +292,12 @@ export const App = () => { return (
+ { resultOfPsychoTest={resultOfPsychoTest} handleChangeUserInfo={handleChangeUserInfo} success={success} - error={error} - closeErrorPopup={closeErrorPopup} - popupOpened={popupOpened} resetMessages={resetMessages} employees={employees} handleSendInviteCode={handleSendInviteCode} diff --git a/src/components/EmailFormRefresh/EmailFormRefresh.tsx b/src/components/EmailFormRefresh/EmailFormRefresh.tsx index 7e63d92..7a1b073 100644 --- a/src/components/EmailFormRefresh/EmailFormRefresh.tsx +++ b/src/components/EmailFormRefresh/EmailFormRefresh.tsx @@ -5,22 +5,13 @@ import { Formik, Form } from "formik"; import { refreshEmailSchema } from "@/schemas/validationSchema"; import { Input } from "@/shared/ui/Input/Input"; import React from "react"; -import { InfoPopup } from "@/shared/ui/infoPopup/InfoPopup"; interface ComponentProps { handleSendResetCode: (email: string) => void; - success: string; - error: string; - closeErrorPopup: () => void; - popupOpened: boolean; } export const EmailFormRefresh: React.FC = ({ handleSendResetCode, - success, - error, - closeErrorPopup, - popupOpened, }) => { return ( <> @@ -46,22 +37,6 @@ export const EmailFormRefresh: React.FC = ({