From 4c8aa58301ed73c32259245bc82fe2d6503b4995 Mon Sep 17 00:00:00 2001 From: andrei Date: Sat, 5 Oct 2024 10:22:43 +0500 Subject: [PATCH] ._. --- src/App.jsx | 24 ++++---- src/AppRouter.jsx | 19 +++--- src/AuthContext.jsx | 44 +++++++------- src/api.jsx | 72 +++++++++++----------- src/components/PrivateRoute.jsx | 16 ++--- src/index.jsx | 16 ++--- src/pages/Home.jsx | 11 ++-- src/pages/Login.jsx | 102 ++++++++++++++++---------------- 8 files changed, 155 insertions(+), 149 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 508150f..ab39322 100755 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,18 +1,18 @@ -import React from 'react'; -import RoutesComponent from './AppRouter.jsx'; -import { AuthProvider } from './AuthContext.jsx'; -import { BrowserRouter as Router } from 'react-router-dom'; +import React from "react"; +import RoutesComponent from "./AppRouter.jsx"; +import { AuthProvider } from "./AuthContext.jsx"; +import { BrowserRouter as Router } from "react-router-dom"; const App = () => { - return ( + return ( - -
- -
-
+ +
+ +
+
- ); + ); }; -export default App; \ No newline at end of file +export default App; diff --git a/src/AppRouter.jsx b/src/AppRouter.jsx index 53e7006..f19e626 100755 --- a/src/AppRouter.jsx +++ b/src/AppRouter.jsx @@ -1,14 +1,15 @@ -import { Routes, Route, Navigate } from 'react-router-dom'; -import Login from './pages/Login'; -import PrivateRoute from './components/PrivateRoute'; +import { Routes, Route, Navigate } from "react-router-dom"; +import Login from "./pages/Login"; +import Home from "./pages/Home.jsx"; +import PrivateRoute from "./components/PrivateRoute"; const RoutesComponent = () => ( - - } /> - }> - - - + + } /> + }> + } /> + + ); export default RoutesComponent; diff --git a/src/AuthContext.jsx b/src/AuthContext.jsx index dacd1d0..7b3a501 100644 --- a/src/AuthContext.jsx +++ b/src/AuthContext.jsx @@ -1,34 +1,34 @@ -import React, { createContext, useContext, useState, useEffect } from 'react'; +import React, { createContext, useContext, useState, useEffect } from "react"; const AuthContext = createContext(); export const useAuth = () => { - return useContext(AuthContext); + return useContext(AuthContext); }; export const AuthProvider = ({ children }) => { - const [isAuthenticated, setIsAuthenticated] = useState(() => { - const savedAuth = localStorage.getItem('isAuthenticated'); - return savedAuth === 'true'; - }); + const [isAuthenticated, setIsAuthenticated] = useState(() => { + const savedAuth = localStorage.getItem("isAuthenticated"); + return savedAuth === "true"; + }); - const login = () => { - setIsAuthenticated(true); - }; + const login = () => { + setIsAuthenticated(true); + }; - const logout = () => { - setIsAuthenticated(false); - localStorage.removeItem('token'); - localStorage.removeItem('isAuthenticated'); - }; + const logout = () => { + setIsAuthenticated(false); + localStorage.removeItem("token"); + localStorage.removeItem("isAuthenticated"); + }; - useEffect(() => { - localStorage.setItem('isAuthenticated', isAuthenticated); - }, [isAuthenticated]); + useEffect(() => { + localStorage.setItem("isAuthenticated", isAuthenticated); + }, [isAuthenticated]); - return ( - - {children} - - ); + return ( + + {children} + + ); }; diff --git a/src/api.jsx b/src/api.jsx index 05e5849..02dad8b 100755 --- a/src/api.jsx +++ b/src/api.jsx @@ -1,44 +1,50 @@ -import axios from 'axios'; +import axios from "axios"; -const API_URL = 'http://localhost:8000/api'; +const API_URL = "http://localhost:8000/api"; const getAuthToken = () => { - return localStorage.getItem('token'); + return localStorage.getItem("token"); }; export const loginUser = async (loginData) => { - const params = new URLSearchParams(); - params.append('grant_type', 'password'); - params.append('username', loginData.login); - params.append('password', loginData.password); + const params = new URLSearchParams(); + params.append("grant_type", "password"); + params.append("username", loginData.login); + params.append("password", loginData.password); - try { - const response = await axios.post(`${API_URL}/token`, params, { - headers: { - 'Content-Type': 'application/x-www-form-urlencoded', - 'Accept': 'application/json', - }, - }); - console.log(response.data); - return response.data; - } catch (error) { - console.log('Ошибка при запросе:', error.response ? error.response.data : error); - throw error.response ? error.response.data : error; - } + try { + const response = await axios.post(`${API_URL}/token`, params, { + headers: { + "Content-Type": "application/x-www-form-urlencoded", + Accept: "application/json", + }, + }); + console.log(response.data); + return response.data; + } catch (error) { + console.log( + "Ошибка при запросе:", + error.response ? error.response.data : error + ); + throw error.response ? error.response.data : error; + } }; export const getAccessories = async () => { - try { - const token = getAuthToken(); - const response = await axios.get(`${API_URL}/accessories`, { - headers: { - 'Authorization': `Bearer ${token}`, - 'Accept': 'application/json', - }, - }); - return response.data; - } catch (error) { - console.error('Ошибка при запросе аксессуаров:', error.response ? error.response.data : error); - throw error.response ? error.response.data : error; - } + try { + const token = getAuthToken(); + const response = await axios.get(`${API_URL}/accessories`, { + headers: { + Authorization: `Bearer ${token}`, + Accept: "application/json", + }, + }); + return response.data; + } catch (error) { + console.error( + "Ошибка при запросе аксессуаров:", + error.response ? error.response.data : error + ); + throw error.response ? error.response.data : error; + } }; diff --git a/src/components/PrivateRoute.jsx b/src/components/PrivateRoute.jsx index 96e0150..68edf49 100644 --- a/src/components/PrivateRoute.jsx +++ b/src/components/PrivateRoute.jsx @@ -1,15 +1,15 @@ -import React from 'react'; -import { Navigate, Outlet } from 'react-router-dom'; -import { useAuth } from '../AuthContext.jsx'; +import React from "react"; +import { Navigate, Outlet } from "react-router-dom"; +import { useAuth } from "../AuthContext.jsx"; const PrivateRoute = () => { - const { isAuthenticated } = useAuth(); + const { isAuthenticated } = useAuth(); - if (isAuthenticated === null) { - return
Loading...
; - } + if (isAuthenticated === null) { + return
Loading...
; + } - return isAuthenticated ? : ; + return isAuthenticated ? : ; }; export default PrivateRoute; diff --git a/src/index.jsx b/src/index.jsx index 4db0035..8db5acb 100755 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,10 +1,10 @@ -import React from 'react'; -import ReactDOM from 'react-dom/client'; -import App from './App'; +import React from "react"; +import ReactDOM from "react-dom/client"; +import App from "./App"; -const root = ReactDOM.createRoot(document.getElementById('root')); +const root = ReactDOM.createRoot(document.getElementById("root")); root.render( - - - -); \ No newline at end of file + + + +); diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx index 3ece38a..1ea8253 100644 --- a/src/pages/Home.jsx +++ b/src/pages/Home.jsx @@ -1,10 +1,7 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect } from "react"; const Home = () => { + return
sadvsgrhgrtshte
; +}; - return ( -
- sadvsgrhgrtshte -
- ) -} \ No newline at end of file +export default Home; diff --git a/src/pages/Login.jsx b/src/pages/Login.jsx index 6722402..ce3fcdd 100644 --- a/src/pages/Login.jsx +++ b/src/pages/Login.jsx @@ -1,59 +1,61 @@ -import React, { useState } from 'react'; -import { loginUser } from '../api'; -import { useNavigate } from 'react-router-dom'; -import { useAuth } from '../AuthContext'; // Подключаем AuthContext +import React, { useState } from "react"; +import { loginUser } from "../api"; +import { useNavigate } from "react-router-dom"; +import { useAuth } from "../AuthContext"; const Login = () => { - const [login, setLogin] = useState(''); - const [password, setPassword] = useState(''); - const [error, setError] = useState(''); - const navigate = useNavigate(); - const { login: authenticate } = useAuth(); // Вытаскиваем метод login из контекста + const [login, setLogin] = useState(""); + const [password, setPassword] = useState(""); + const [error, setError] = useState(""); + const navigate = useNavigate(); + const { login: authenticate } = useAuth(); - const handleSubmit = async (e) => { - e.preventDefault(); + const handleSubmit = async (e) => { + e.preventDefault(); - try { - const userData = await loginUser({ login, password }); - localStorage.setItem('token', userData.access_token); - authenticate(); - navigate('/'); - } catch (error) { - setError(error.detail ? error.detail : 'Ошибка авторизации'); - } - }; + try { + const userData = await loginUser({ login, password }); + localStorage.setItem("token", userData.access_token); + authenticate(); + navigate("/"); + } catch (error) { + setError(error.detail ? error.detail : "Ошибка авторизации"); + } + }; - return ( -
-

Вход

- {error &&

{error}

} -
-
- - setLogin(e.target.value)} - required - /> -
-
- - setPassword(e.target.value)} - required - /> -
- -
+ return ( +
+

Вход

+ {error &&

{error}

} +
+
+ + setLogin(e.target.value)} + required + />
- ); +
+ + setPassword(e.target.value)} + required + /> +
+ +
+
+ ); }; export default Login;