refactor: refactor: auth-context, popup-login, popup-registration

src/App.tsx

@@ -3,7 +3,7 @@ import Layout from './layouts/layout/layout.tsx';
 import Home from './pages/home';
 import Profile from './pages/profile/index.tsx';
 import { ProtectedRoute } from './utils/protected-route.tsx';
-// import { useAuth } from './hooks/use-auth.ts';
+import { useAuth } from './hooks/use-auth.ts';
 import Product from '@pages/product/index.tsx';
 import Catalog from '@pages/catalog/index.tsx';
 import { URLS } from '@data/constants.ts';
@@ -17,7 +17,6 @@ import ProfileFavorites from '@pages/profile/profile-favorites/index.tsx';
 // import Checkout from '@pages/checkout/index.tsx';
 import ShoppingCart from '@pages/shopping-cart/index.tsx';
 
-
 // импорт временных массивов для отображения каталогов и продуктов
 // временное решение для верстки, потом удалить
 
@@ -28,7 +27,7 @@ import ShoppingCart from '@pages/shopping-cart/index.tsx';
 // <CardCatalogLink title="Овощи" type="single-row" array={products} />
 
 function App() {
-	// const { isLoggedIn } = useAuth();
+	const { isLoggedIn } = useAuth();
 
 	return (
 		<div className="app">
@@ -41,7 +40,7 @@ function App() {
 					<Route path="/cart" element={<ShoppingCart />} />
 					<Route
 						path={URLS.PROFILE}
-						element={<ProtectedRoute element={Profile} loggedIn={true} />}
+						element={<ProtectedRoute element={Profile} loggedIn={isLoggedIn} />}
 					>
 						<Route path="user" element={<ProfileUser />} />
 						<Route index element={<h2>Мои заказы</h2>} />

src/components/popups/popup-login/index.tsx

@@ -7,13 +7,15 @@ import { useFormAndValidation } from '@hooks/use-form-and-validation.ts';
 import api from '@services/api.ts';
 import Cookies from 'js-cookie';
 import { useAuth } from '@hooks/use-auth.ts';
+import { useNavigate } from 'react-router';
 
 const PopupLogin: React.FC = () => {
 	const { values, handleChange, validateInputsHandleSubmit, errors, isValid, resetForm } =
 		useFormAndValidation();
 	const { popupState, handleClosePopup, handleOpenPopup } = usePopup();
 	const { checkAuthentication } = useAuth();
 	const [disabledButton, setDisabledButton] = useState(false);
+	const navigate = useNavigate();
 
 	function onSubmitLogin(e: React.FormEvent<HTMLFormElement>) {
 		e.preventDefault();
@@ -32,12 +34,15 @@ const PopupLogin: React.FC = () => {
 					email: `${values.login_email}`,
 				})
 				.then((data) => {
-					handleClosePopup('openPopupLogin');
 					Cookies.set('token', data.auth_token, {
 						expires: 14,
 					});
-					checkAuthentication();
+				})
+				.then(() => checkAuthentication())
+				.then(() => {
+					handleClosePopup('openPopupLogin');
 					resetForm();
+					navigate('/profile');
 				})
 				.catch((err) => {
 					console.log(err);

src/components/popups/popup-registration/index.tsx

@@ -39,6 +39,7 @@ const PopupRegistration: React.FC = () => {
 				.then(() => {
 					handleClosePopup('openPopupRegistration');
 					resetForm();
+					handleOpenPopup('openPopupLogin');
 				})
 				.catch((err) => {
 					console.log(err);
@@ -132,14 +133,14 @@ const PopupRegistration: React.FC = () => {
 					</button>
 				</form>
 				<p className={styles['popupLogin__registration-prompt']}>
-					Нет аккаунта?{' '}
+					Есть аккаунт?{' '}
 					<button
 						className={styles['popupLogin__registration-button']}
 						type="button"
 						onClick={openRegistrationPopup}
 					>
 						{' '}
-						Войти
+						Зарегистрироваться
 					</button>
 				</p>
 			</div>

src/contexts/auth-context.tsx

@@ -6,15 +6,15 @@ type AuthContextType = {
 	user: Record<string, unknown>;
 	loading: boolean;
 	updateUsers: (newUserData: Record<string, unknown>) => void;
-	checkAuthentication: () => void;
+	checkAuthentication: () => Promise<void>;
 };
 
 const AuthContext = createContext<AuthContextType>({
 	isLoggedIn: false,
 	user: {},
 	loading: true,
 	updateUsers: () => {},
-	checkAuthentication: () => {},
+	checkAuthentication: () => Promise.resolve(),
 });
 
 type AuthProviderProps = {