cli
/
Chronobriq-react
Watch 8
Star 0
Fork 0
Code Issues 3 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Pulled master

Lou 3 years ago
parent
830ed6ab6b 720599832e
commit
905e52ad3e
22 changed files with 610 additions and 62 deletions
Split View Show Diff Stats
  1. 1
    1
      index.html
  2. 7
    1
      package.json
  3. 39
    7
      src/App.jsx
  4. 26
    11
      src/components/Navbar/index.jsx
  5. 4
    2
      src/components/Navbar/index.scss
  6. 22
    0
      src/components/buttons/LogoutButton/index.jsx
  7. 57
    2
      src/components/forms/LoginForm/index.jsx
  8. 56
    2
      src/components/forms/SignupForm/index.jsx
  9. 91
    0
      src/components/forms/UserUpdateForm/index.jsx
  10. 11
    3
      src/main.jsx
  11. 21
    1
      src/pages/Home/index.jsx
  12. 1
    13
      src/pages/Login/index.jsx
  13. 66
    0
      src/pages/Profile/index.jsx
  14. 14
    0
      src/redux/action/index.js
  15. 14
    0
      src/redux/reducer/index.js
  16. 23
    0
      src/redux/store/index.js
  17. 17
    0
      src/services/request/Delete.js
  18. 8
    6
      src/services/request/Get.js
  19. 22
    0
      src/services/request/Post.js
  20. 22
    0
      src/services/request/Update.js
  21. 3
    9
      src/services/request/config.js
  22. 85
    4
      yarn.lock

+ 1
- 1
index.html View File 

@@ -3,7 +3,7 @@
3 3 
   <head>
4 4 
     <meta charset="UTF-8" />
5 5 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6 
-    <title>Vite App</title>
6 
+    <title>Registra</title>
7 7 
     <link rel="icon" href="./src/assets/img/star.ico">
8 8 
   </head>
9 9 
   <body>

+ 7
- 1
package.json View File 

@@ -12,9 +12,15 @@
12 12 
     "axios": "^0.21.1",
13 13 
     "babel-jest": "^27.0.6",
14 14 
     "babel-preset-es2015": "^6.24.1",
15 
+    "js-cookie": "^2.2.1",
16 
+    "jwt-decode": "^3.1.2",
15 17 
     "react": "^17.0.0",
16 18 
     "react-dom": "^17.0.0",
17 
-    "react-router-dom": "^5.2.0"
19 
+    "react-redux": "^7.2.4",
20 
+    "react-router-dom": "^5.2.0",
21 
+    "redux": "^4.1.0",
22 
+    "redux-persist": "^6.0.0",
23 
+    "redux-thunk": "^2.3.0"
18 24 
   },
19 25 
   "devDependencies": {
20 26 
     "@babel/core": "^7.1.6",

+ 39
- 7
src/App.jsx View File 

@@ -1,12 +1,47 @@
1 1 
 import React from "react";
2 
-import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
2 
+import {
3 
+	BrowserRouter as Router,
4 
+	Route,
5 
+	Switch,
6 
+	Redirect
7 
+} from "react-router-dom";
8 
+import { useSelector } from "react-redux";
3 9
4 10 
 import Navbar from "./components/Navbar/";
5 11 
 import Home from "./pages/Home/";
6 12 
 import SignupPage from "./pages/Signup";
7 13 
 import LoginPage from "./pages/Login/";
14 
+import ProfilePage from "./pages/Profile";
8 15
9 16 
 const App = () => {
17 
+	const currentUser = useSelector((state) => state.currentUser);
18 
+
19 
+	const UnAuthRoute = ({ component: Component, ...rest }) => (
20 
+		<Route
21 
+			{...rest}
22 
+			render={(props) =>
23 
+				currentUser ? (
24 
+					<Redirect to={{ pathname: "/" }} />
25 
+				) : (
26 
+					<Component {...props} />
27 
+				)
28 
+			}
29 
+		/>
30 
+	);
31 
+
32 
+	const AuthRoute = ({ component: Component, ...rest }) => (
33 
+		<Route
34 
+			{...rest}
35 
+			render={(props) =>
36 
+				currentUser ? (
37 
+					<Component {...props} />
38 
+				) : (
39 
+					<Redirect to={{ pathname: "/signin" }} />
40 
+				)
41 
+			}
42 
+		/>
43 
+	);
44 
+
10 45 
 	return (
11 46 
 		<div className="App">
12 47 
 			<Router>
 
@@ -16,12 +51,9 @@ const App = () => {
16 51 
 						<Route exact path="/">
17 52 
 							<Home />
18 53 
 						</Route>
19 
-						<Route exact path="/login">
20 
-							<LoginPage />
21 
-						</Route>
22 
-						<Route exact path="/Signup">
23 
-							<SignupPage />
24 
-						</Route>
54 
+						<UnAuthRoute path="/login" component={LoginPage} />
55 
+						<UnAuthRoute path="/signup" component={SignupPage} />
56 
+						<AuthRoute path="/me" component={ProfilePage} />
25 57 
 					</Switch>
26 58 
 				</section>
27 59 
 			</Router>

+ 26
- 11
src/components/Navbar/index.jsx View File 

@@ -1,32 +1,47 @@
1 1 
 import React from "react";
2 2 
 import { Link } from "react-router-dom";
3 
+import { useSelector } from "react-redux";
4 
+
3 5 
 import "./index.scss";
4 
-// import Star from "../../assets/img/star-svgrepo-com.svg";
6 
+import Star from "../../assets/img/star.ico";
7 
+import LogoutButton from "../buttons/LogoutButton";
5 8
6 9 
 const Navbar = () => {
10 
+	const currentUser = useSelector((state) => state.currentUser);
11 
+
7 12 
 	return (
8 13 
 		<div className="navbar">
9 14 
 			<div className="navbar__LeftSide">
10 15 
 				<Link to="/">
11 
-					{/* <img
16 
+					<img
12 17 
 						src={Star}
13 18 
 						className="navbar__Icon"
14 19 
 						alt="Temporary icon"
15 20 
 						width="25"
16 21 
 						height="25"
17 
-					/> */}
22 
+					/>
18 23 
 					<p className="navbar__BrandName">Registra</p>
19 24 
 				</Link>
20 25 
 			</div>
21 26 
 			<div className="navbar__RightSide">
22 
-				<Link to="/signup">
23 
-					<button>S'inscrire</button>
24 
-				</Link>
25 
-				<Link to="/login">
26 
-					<button>Se connecter</button>
27 
-				</Link>
28 
-				<button>Profil</button>
29 
-				<button>Déconnexion</button>
27 
+				{!currentUser && (
28 
+					<>
29 
+						<Link to="/signup">
30 
+							<button>S'inscrire</button>
31 
+						</Link>
32 
+						<Link to="/login">
33 
+							<button>Se connecter</button>
34 
+						</Link>
35 
+					</>
36 
+				)}
37 
+				{currentUser && (
38 
+					<>
39 
+						<Link to="/me">
40 
+							<button>Profile</button>
41 
+						</Link>
42 
+						<LogoutButton />
43 
+					</>
44 
+				)}
30 45 
 			</div>
31 46 
 		</div>
32 47 
 	);

+ 4
- 2
src/components/Navbar/index.scss View File 

@@ -36,8 +36,10 @@
36 36
37 37 
   .navbar__RightSide{
38 38 
     display: flex;
39 
-    justify-content: space-between;
40 
-    width: 350px;
39 
+    justify-content: end;
41 40 
     margin-right: 15px;
41 
+    button {
42 
+      margin: 0px 10px;
43 
+    }
42 44 
   }
43 45 
 }

+ 22
- 0
src/components/buttons/LogoutButton/index.jsx View File 

@@ -0,0 +1,22 @@
1 
+import React from "react";
2 
+import { useDispatch } from "react-redux";
3 
+import { useHistory } from "react-router-dom";
4 
+import Cookies from "js-cookie";
5 
+import { removeCurrentUser } from "../../../redux/action/index";
6 
+
7 
+const LogoutButton = () => {
8 
+	const dispatch = useDispatch();
9 
+	const history = useHistory();
10 
+
11 
+	const handleLogout = (event) => {
12 
+		event.preventDefault();
13 
+		Cookies.remove("token");
14 
+		dispatch(removeCurrentUser());
15 
+		localStorage.removeItem("persist:root");
16 
+		history.push("/");
17 
+	};
18 
+
19 
+	return <button onClick={handleLogout}>Déconnexion</button>;
20 
+};
21 
+
22 
+export default LogoutButton;

+ 57
- 2
src/components/forms/LoginForm/index.jsx View File 

@@ -1,14 +1,69 @@
1 
-import React from "react";
1 
+import React, { useState, useEffect } from "react";
2 
+import { useDispatch } from "react-redux";
3 
+import { useHistory } from "react-router-dom";
4 
+import jwt_decode from "jwt-decode";
5 
+import Cookies from "js-cookie";
6 
+
7 
+import post from "../../../services/request/Post";
8 
+import { setCurrentUser } from "../../../redux/action";
2 9 
 import "./index.scss";
3 10
4 11 
 const LoginForm = () => {
12 
+	const [userData, setUserData] = useState(null);
13 
+
14 
+	const dispatch = useDispatch();
15 
+	const history = useHistory();
16 
+
17 
+	const handleSubmit = (e) => {
18 
+		e.preventDefault();
19 
+		const formdata = new FormData(e.currentTarget);
20 
+		setUserData({
21 
+			...userData,
22 
+			email: formdata.get("email"),
23 
+			password: formdata.get("password")
24 
+		});
25 
+	};
26 
+
27 
+	const handleLogin = async (data) => {
28 
+		// Écrire une fonction pour vérifier plus précisément que data
29 
+		// contient bien les données nécessaires
30 
+		if (data) {
31 
+			let body = {
32 
+				user: { email: data.email, password: data.password }
33 
+			};
34 
+			const response = await post("/tokens", body);
35 
+			// Pareil ici, utiliser une fonction qui vérifie la validité des données
36 
+			if (response != null) {
37 
+				Cookies.set("token", response.data.token, {
38 
+					sameSite: "strict",
39 
+					Secure: true
40 
+				});
41 
+				const payload = {
42 
+					type: "user",
43 
+					id: jwt_decode(response.data.token).user_id,
44 
+					email: userData.email,
45 
+					username: response.data.username
46 
+				};
47 
+				dispatch(setCurrentUser(payload));
48 
+				history.push("/");
49 
+			}
50 
+		}
51 
+	};
52 
+
53 
+	useEffect(() => {
54 
+		handleLogin(userData);
55 
+	}, [userData]);
56 
+
5 57 
 	return (
6 58 
 		<div className="LoginForm">
7 
-			<form>
59 
+			<form action="" onSubmit={handleSubmit}>
8 60 
 				<label htmlFor="email">Adresse email</label>
9 61 
 				<input type="email" id="email" name="email" />
62 
+
10 63 
 				<label htmlFor="password">Mot de passe</label>
11 64 
 				<input type="password" id="password" name="password" />
65 
+
66 
+				<button type="submit">Valider</button>
12 67 
 			</form>
13 68 
 		</div>
14 69 
 	);

+ 56
- 2
src/components/forms/SignupForm/index.jsx View File 

@@ -1,10 +1,63 @@
1 
-import React from "react";
1 
+import React, { useState, useEffect } from "react";
2 
+import { useHistory } from "react-router-dom";
3 
+
4 
+import post from "../../../services/request/Post";
2 5 
 import "./index.scss";
3 6
4 7 
 const SignupForm = () => {
8 
+	const [userData, setUserData] = useState(null);
9 
+	const [passwordCheck, setPasswordCheck] = useState(null);
10 
+
11 
+	const history = useHistory();
12 
+
13 
+	const handleSubmit = (event) => {
14 
+		event.preventDefault();
15 
+		const formdata = new FormData(event.currentTarget);
16 
+		let pwd = formdata.get("password");
17 
+		let c_pwd = formdata.get("confirm_password");
18 
+		let username = formdata.get("username");
19 
+		let email = formdata.get("email");
20 
+		if (pwd !== c_pwd) {
21 
+			setPasswordCheck(false);
22 
+		} else if (pwd === c_pwd) {
23 
+			setPasswordCheck(true);
24 
+		}
25 
+		setUserData({
26 
+			...userData,
27 
+			username,
28 
+			email,
29 
+			pwd
30 
+		});
31 
+	};
32 
+
33 
+	const handleSignup = async ({ email, username, pwd }) => {
34 
+		let body = {
35 
+			user: {
36 
+				email: email,
37 
+				username: username,
38 
+				password: pwd
39 
+			}
40 
+		};
41 
+		return await post("/users", body);
42 
+	};
43 
+
44 
+	useEffect(async () => {
45 
+		if (passwordCheck === false) {
46 
+			console.log("Passwords do not match"); // À afficher autrement
47 
+		} else if (passwordCheck === true && userData) {
48 
+			const response = await handleSignup(userData);
49 
+			if (response.status && response.status === 201) {
50 
+				history.push({
51 
+					pathname: "/",
52 
+					state: { status: "201 : user created" }
53 
+				});
54 
+			}
55 
+		}
56 
+	}, [passwordCheck, userData]);
57 
+
5 58 
 	return (
6 59 
 		<div className="signupForm">
7 
-			<form>
60 
+			<form action="" onSubmit={handleSubmit}>
8 61 
 				<label htmlFor="username">Nom d'utilisateur</label>
9 62 
 				<input type="text" id="username" name="username" />
10 63 
 				<label htmlFor="email">Adresse email</label>
 
@@ -13,6 +66,7 @@ const SignupForm = () => {
13 66 
 				<input type="password" id="password" name="password" />
14 67 
 				<label htmlFor="confirm_password">Confirmation du mot de passe</label>
15 68 
 				<input type="password" id="confirm_password" name="confirm_password" />
69 
+				<button type="submit">Valider</button>
16 70 
 			</form>
17 71 
 		</div>
18 72 
 	);

+ 91
- 0
src/components/forms/UserUpdateForm/index.jsx View File 

@@ -0,0 +1,91 @@
1 
+import React, { useState, useEffect } from "react";
2 
+import { useSelector, useDispatch } from "react-redux";
3 
+import { useHistory } from "react-router-dom";
4 
+import Cookies from "js-cookie";
5 
+
6 
+import update from "../../../services/request/Update";
7 
+import { setCurrentUser } from "../../../redux/action";
8 
+
9 
+const UserUpdateForm = () => {
10 
+	const [userData, setUserData] = useState(null);
11 
+	const currentUser = useSelector((state) => state.currentUser);
12 
+	const dispatch = useDispatch();
13 
+	const history = useHistory();
14 
+
15 
+	const handleSubmit = (e) => {
16 
+		e.preventDefault();
17 
+		const formdata = new FormData(e.currentTarget);
18 
+		if (formdata.get("email") !== "" && formdata.get("username") !== "") {
19 
+			const email = formdata.get("email");
20 
+			const username = formdata.get("username");
21 
+			setUserData({
22 
+				...userData,
23 
+				username: username,
24 
+				email: email
25 
+			});
26 
+		} else if (
27 
+			formdata.get("email") !== "" &&
28 
+			formdata.get("username") === ""
29 
+		) {
30 
+			const email = formdata.get("email");
31 
+			const username = currentUser.username;
32 
+			setUserData({
33 
+				...userData,
34 
+				username: username,
35 
+				email: email
36 
+			});
37 
+		} else if (
38 
+			formdata.get("email") === "" &&
39 
+			formdata.get("username") !== ""
40 
+		) {
41 
+			const email = currentUser.email;
42 
+			const username = formdata.get("username");
43 
+			setUserData({
44 
+				...userData,
45 
+				username: username,
46 
+				email: email
47 
+			});
48 
+		}
49 
+	};
50 
+
51 
+	const handleUpdate = async ({ username, email }) => {
52 
+		const token = Cookies.get("token");
53 
+		const body = { user: { username: username, email: email } };
54 
+		const response = await update(`/users/${currentUser.id}`, body, token);
55 
+		console.log(response);
56 
+		if (response.status === 200) {
57 
+			handleChange(response);
58 
+		}
59 
+	};
60 
+
61 
+	const handleChange = (res) => {
62 
+		console.log("handle change : " + res.data.attributes);
63 
+		const payload = {
64 
+			type: "user",
65 
+			id: res.data.data.id,
66 
+			email: res.data.data.attributes.email,
67 
+			username: res.data.data.attributes.username
68 
+		};
69 
+		console.log("Payload : " + payload);
70 
+		dispatch(setCurrentUser(payload));
71 
+		history.push("/me");
72 
+	};
73 
+
74 
+	useEffect(() => {
75 
+		if (userData !== null) {
76 
+			handleUpdate(userData);
77 
+		}
78 
+	}, [userData]);
79 
+
80 
+	return (
81 
+		<form action="" onSubmit={handleSubmit}>
82 
+			<label htmlFor="username">Nom d'utilisateur</label>
83 
+			<input type="text" id="username" name="username" />
84 
+			<label htmlFor="email">Adresse email</label>
85 
+			<input type="email" id="email" name="email" />
86 
+			<button type="submit">Valider</button>
87 
+		</form>
88 
+	);
89 
+};
90 
+
91 
+export default UserUpdateForm;

+ 11
- 3
src/main.jsx View File 

@@ -1,11 +1,19 @@
1 1 
 import React from "react";
2 2 
 import ReactDOM from "react-dom";
3 
-import "./main.scss";
3 
+import { Provider } from "react-redux";
4 
+import { PersistGate } from "redux-persist/integration/react";
5 
+import { store, persistor } from "./redux/store/index";
6 
+
4 7 
 import App from "./App.jsx";
8 
+import "./main.scss";
5 9
6 10 
 ReactDOM.render(
7 11 
 	<React.StrictMode>
8 
-		<App />
12 
+		<Provider store={store}>
13 
+			<PersistGate loading={null} persistor={persistor}>
14 
+				<App />
15 
+			</PersistGate>
16 
+		</Provider>
9 17 
 	</React.StrictMode>,
10 
-	document.getElementById("root"),
18 
+	document.getElementById("root")
11 19 
 );

+ 21
- 1
src/pages/Home/index.jsx View File 

@@ -1,9 +1,29 @@
1 
-import React from "react";
1 
+import React, { useEffect } from "react";
2 
+import { useLocation } from "react-router";
3 
+import { useSelector } from "react-redux";
4 
+
5 
+import Cookies from "js-cookie";
2 6
3 7 
 const Home = () => {
8 
+	const currentUser = useSelector((state) => state.currentUser);
9 
+
10 
+	const location = useLocation();
11 
+
4 12 
 	return (
5 13 
 		<div className="test">
6 14 
 			<h2>Home</h2>
15 
+			{currentUser && (
16 
+				<div>
17 
+					<p>Utilisateurice connecté·e, bravo !</p>
18 
+				</div>
19 
+			)}
20 
+
21 
+			{!currentUser && (
22 
+				<div>
23 
+					<p>Utilisateurice non connecté·e.</p>
24 
+				</div>
25 
+			)}
26 
+			<p>{location.state && location.state.status}</p>
7 27 
 		</div>
8 28 
 	);
9 29 
 };

+ 1
- 13
src/pages/Login/index.jsx View File 

@@ -1,19 +1,7 @@
1 
-import React, { useEffect } from "react";
1 
+import React from "react";
2 2 
 import LoginForm from "../../components/forms/LoginForm/";
3 3
4 
-import get from "../../services/request/Get";
5 
-
6 4 
 const LoginPage = () => {
7 
-	let jwt_token =
8 
-		"eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoxMSwiZXhwIjoxNjI0NjM2NTg3fQ.G2UH5uH2xsei6Msp_za50pSVeOKaes1peE0ntslnI1o";
9 
-
10 
-	useEffect(() => {
11 
-		console.log("HELLO 2");
12 
-		let response = get("/users", jwt_token);
13 
-		console.log("HELLO 3");
14 
-		console.log(response);
15 
-	}, []);
16 
-
17 5 
 	return (
18 6 
 		<div className="LoginPage">
19 7 
 			<h2>Page de connexion</h2>

+ 66
- 0
src/pages/Profile/index.jsx View File 

@@ -0,0 +1,66 @@
1 
+import React, { useState, useEffect } from "react";
2 
+import { useSelector, useDispatch } from "react-redux";
3 
+import { useHistory } from "react-router-dom";
4 
+import Cookies from "js-cookie";
5 
+
6 
+import del from "../../services/request/Delete";
7 
+import { removeCurrentUser } from "../../redux/action/index";
8 
+import UserUpdateForm from "../../components/forms/UserUpdateForm";
9 
+
10 
+const ProfilePage = () => {
11 
+	const [deleteSuccess, setDeleteSuccess] = useState(null);
12 
+	const [settings, setSettings] = useState(false);
13 
+	const currentUser = useSelector((state) => state.currentUser);
14 
+
15 
+	const dispatch = useDispatch();
16 
+	const history = useHistory();
17 
+
18 
+	const handleDelete = async () => {
19 
+		let token = Cookies.get("token");
20 
+		const response = await del(`/users/${currentUser.id}`, token);
21 
+		if (response.status === 204) {
22 
+			setDeleteSuccess(true);
23 
+		} else if (response.status === 403) {
24 
+			setDeleteSuccess(false);
25 
+		}
26 
+	};
27 
+
28 
+	const toogleSettings = () => {
29 
+		if (settings === false) {
30 
+			setSettings(true);
31 
+		} else {
32 
+			setSettings(false);
33 
+		}
34 
+	};
35 
+
36 
+	useEffect(() => {
37 
+		console.log(currentUser);
38 
+		if (deleteSuccess && deleteSuccess === true) {
39 
+			Cookies.remove("token");
40 
+			dispatch(removeCurrentUser());
41 
+			localStorage.removeItem("persist:root");
42 
+			history.push({
43 
+				pathname: "/",
44 
+				state: { status: "204 : user deleted" }
45 
+			});
46 
+		}
47 
+	}, [deleteSuccess]);
48 
+
49 
+	return (
50 
+		<div>
51 
+			<h1>Hello {currentUser.username}</h1>
52 
+			<button onClick={handleDelete}>Supprimer le compte</button>
53 
+			<button onClick={toogleSettings}>Mettre à jour les informations</button>
54 
+			{settings === true ? (
55 
+				<div className="truc">
56 
+					<h2>Modifiez vos informations :</h2>
57 
+					<UserUpdateForm />
58 
+				</div>
59 
+			) : (
60 
+				<> </>
61 
+			)}
62 
+		</div>
63 
+	);
64 
+};
65 
+
66 
+export default ProfilePage;

+ 14
- 0
src/redux/action/index.js View File 

@@ -0,0 +1,14 @@
1 
+const setCurrentUser = (currentUser) => {
2 
+  return {
3 
+    type: "SET_CURRENT_USER",
4 
+    payload: currentUser
5 
+  }
6 
+}
7 
+
8 
+const removeCurrentUser = () => {
9 
+  return {
10 
+    type: "REMOVE_CURRENT_USER"
11 
+  }
12 
+}
13 
+
14 
+export { setCurrentUser, removeCurrentUser }

+ 14
- 0
src/redux/reducer/index.js View File 

@@ -0,0 +1,14 @@
1 
+const initialState = { currentUser: null }
2 
+
3 
+const reducer = ( state = initialState, action ) => {
4 
+  switch (action.type){
5 
+    case "SET_CURRENT_USER":
6 
+      return { currentUser: action.payload };
7 
+    case "REMOVE_CURRENT_USER":
8 
+      return initialState;
9 
+    default:
10 
+      return { ...state }
11 
+  }
12 
+}
13 
+
14 
+export default reducer;

+ 23
- 0
src/redux/store/index.js View File 

@@ -0,0 +1,23 @@
1 
+import { createStore, compose, applyMiddleware } from 'redux';
2 
+import thunk from 'redux-thunk';
3 
+import { persistStore, persistReducer } from 'redux-persist'
4 
+import storage from 'redux-persist/lib/storage'
5 
+import reducer from "../reducer/index"
6 
+
7 
+const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
8 
+
9 
+const persistConfig = {
10 
+  key: 'root',
11 
+  storage,
12 
+}
13 
+
14 
+const persistedReducer = persistReducer(persistConfig, reducer)
15 
+
16 
+const store = createStore(
17 
+  persistedReducer,
18 
+  composeEnhancer(applyMiddleware(thunk))
19 
+  );
20 
+
21 
+const persistor = persistStore(store);
22 
+
23 
+export { store, persistor };

+ 17
- 0
src/services/request/Delete.js View File 

@@ -0,0 +1,17 @@
1 
+import axios from 'axios';
2 
+import { BASE_URL } from "./config.js";
3 
+
4 
+const del = async (
5 
+  endpoint,
6 
+  jwt_token = null,
7 
+  header = { "Authorization": jwt_token }) => {
8 
+
9 
+  try {
10 
+    const response = await axios.delete(BASE_URL + endpoint, { headers: header })
11 
+    return response
12 
+  } catch (err) {
13 
+    console.error(`An error occurred while trying to fetch ${endpoint}. ${err}`);
14 
+  }
15 
+}
16 
+
17 
+export default del;

+ 8
- 6
src/services/request/Get.js View File 

@@ -1,7 +1,6 @@
1 1 
 import axios from 'axios';
2 2 
 import { BASE_URL } from "./config.js";
3 3
4 
-
5 4 
 const get = async (
6 5 
   endpoint,
7 6 
   jwt_token = null,
 
@@ -12,11 +11,14 @@ const get = async (
12 11 
       opt["Authorization"] = jwt_token
13 12 
   }
14 13
15 
-  console.log("HELLO 1");
16 
-  const response = await axios.get(BASE_URL + endpoint, { headers: opt })
17 
-  console.log(response.data);
18 
-  return response.data
19 
-
14 
+  try {
15 
+    console.log("HELLO 1");
16 
+    const response = await axios.get(BASE_URL + endpoint, { headers: opt })
17 
+    console.log(response.data);
18 
+    return response.data
19 
+  } catch (err) {
20 
+    console.error(`An error occurred while trying to fetch` + endpoint + `:` + err);
21 
+  }
20 22 
 }
21 23
22 24 
 export default get;

+ 22
- 0
src/services/request/Post.js View File 

@@ -0,0 +1,22 @@
1 
+import axios from 'axios';
2 
+import { BASE_URL } from "./config.js";
3 
+
4 
+const post = async (
5 
+  endpoint,
6 
+  body = null,
7 
+  jwt_token = null,
8 
+  header = { "Content-Type": "application/json" }) => {
9 
+
10 
+  let opt = header;
11 
+  if (jwt_token){
12 
+      opt["Authorization"] = jwt_token
13 
+  }
14 
+
15 
+  try {
16 
+    return await axios.post(BASE_URL + endpoint, body, { headers: opt })
17 
+  } catch (err) {
18 
+    console.error(`An error occurred while trying to fetch ${endpoint}. ${err}`);
19 
+  }
20 
+}
21 
+
22 
+export default post;

+ 22
- 0
src/services/request/Update.js View File 

@@ -0,0 +1,22 @@
1 
+import axios from 'axios';
2 
+import { BASE_URL } from "./config.js";
3 
+
4 
+const update = async (
5 
+  endpoint,
6 
+  body = null,
7 
+  jwt_token = null,
8 
+  header = { "Content-Type": "application/json" }) => {
9 
+
10 
+  let opt = header;
11 
+  if (jwt_token){
12 
+      opt["Authorization"] = jwt_token
13 
+  }
14 
+
15 
+  try {
16 
+    return await axios.patch(BASE_URL + endpoint, body, { headers: opt })
17 
+  } catch (err) {
18 
+    console.error(`An error occurred while trying to fetch ${endpoint}. ${err}`);
19 
+  }
20 
+}
21 
+
22 
+export default update;

+ 3
- 9
src/services/request/config.js View File 

@@ -1,10 +1,4 @@
1 
-const BASE_URL = "https://registra-api.herokuapp.com/api/v1"
1 
+const BASE_URL = "https://registra.netlib.re/api/v1"
2 
+// const BASE_URL = "http://127.0.0.1:4000/api/v1"
2 3
3 
-const API_ENDPOINTS = {
4 
-  "users": "/users",
5 
-  "token": "/tokens",
6 
-  "activities": "/activities",
7 
-  "tasks": "/tasks"
8 
-}
9 
-
10 
-export { BASE_URL, API_ENDPOINTS }
4 
+export { BASE_URL }

+ 85
- 4
yarn.lock View File 

@@ -188,7 +188,7 @@
188 188 
   dependencies:
189 189 
     "@babel/helper-plugin-utils" "^7.14.5"
190 190
191 
-"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.1":
191 
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.9.2":
192 192 
   version "7.14.6"
193 193 
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.6.tgz#535203bc0892efc7dec60bdc27b2ecf6e409062d"
194 194 
   integrity sha512-/PCB2uJ7oM44tz8YhC4Z/6PeOKXp4K588f+5M3clr1M4zbqztlo0XEfJ2LEzj/FgwfgGcIdl8n7YYjTCI0BYwg==
 
@@ -227,6 +227,43 @@
227 227 
     "@babel/helper-validator-identifier" "^7.14.5"
228 228 
     to-fast-properties "^2.0.0"
229 229
230 
+"@types/hoist-non-react-statics@^3.3.0":
231 
+  version "3.3.1"
232 
+  resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
233 
+  integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
234 
+  dependencies:
235 
+    "@types/react" "*"
236 
+    hoist-non-react-statics "^3.3.0"
237 
+
238 
+"@types/prop-types@*":
239 
+  version "15.7.3"
240 
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
241 
+  integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
242 
+
243 
+"@types/react-redux@^7.1.16":
244 
+  version "7.1.16"
245 
+  resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.16.tgz#0fbd04c2500c12105494c83d4a3e45c084e3cb21"
246 
+  integrity sha512-f/FKzIrZwZk7YEO9E1yoxIuDNRiDducxkFlkw/GNMGEnK9n4K8wJzlJBghpSuOVDgEUHoDkDF7Gi9lHNQR4siw==
247 
+  dependencies:
248 
+    "@types/hoist-non-react-statics" "^3.3.0"
249 
+    "@types/react" "*"
250 
+    hoist-non-react-statics "^3.3.0"
251 
+    redux "^4.0.0"
252 
+
253 
+"@types/react@*":
254 
+  version "17.0.11"
255 
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.11.tgz#67fcd0ddbf5a0b083a0f94e926c7d63f3b836451"
256 
+  integrity sha512-yFRQbD+whVonItSk7ZzP/L+gPTJVBkL/7shLEF+i9GC/1cV3JmUxEQz6+9ylhUpWSDuqo1N9qEvqS6vTj4USUA==
257 
+  dependencies:
258 
+    "@types/prop-types" "*"
259 
+    "@types/scheduler" "*"
260 
+    csstype "^3.0.2"
261 
+
262 
+"@types/scheduler@*":
263 
+  version "0.16.1"
264 
+  resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.1.tgz#18845205e86ff0038517aab7a18a62a6b9f71275"
265 
+  integrity sha512-EaCxbanVeyxDRTQBkdLb3Bvl/HK7PBK6UJjsSixB0iHKoWxE5uu2Q/DgtpOhPIojN0Zl1whvOd7PoHs2P0s5eA==
266 
+
230 267 
 "@vitejs/plugin-react-refresh@^1.3.1":
231 268 
   version "1.3.3"
232 269 
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-react-refresh/-/plugin-react-refresh-1.3.3.tgz#d5afb3e0463f368a8afadfdd7305fe5c5fe78a6a"
 
@@ -335,6 +372,11 @@ convert-source-map@^1.7.0:
335 372 
   dependencies:
336 373 
     safe-buffer "~5.1.1"
337 374
375 
+csstype@^3.0.2:
376 
+  version "3.0.8"
377 
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.8.tgz#d2266a792729fb227cd216fb572f43728e1ad340"
378 
+  integrity sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw==
379 
+
338 380 
 debug@^4.1.0:
339 381 
   version "4.3.1"
340 382 
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.1.tgz#f0d229c505e0c6d8c49ac553d1b13dc183f6b2ee"
 
@@ -425,7 +467,7 @@ history@^4.9.0:
425 467 
     tiny-warning "^1.0.0"
426 468 
     value-equal "^1.0.1"
427 469
428 
-hoist-non-react-statics@^3.1.0:
470 
+hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2:
429 471 
   version "3.3.2"
430 472 
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
431 473 
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
 
@@ -468,6 +510,11 @@ isarray@0.0.1:
468 510 
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
469 511 
   integrity sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=
470 512
513 
+js-cookie@^2.2.1:
514 
+  version "2.2.1"
515 
+  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
516 
+  integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
517 
+
471 518 
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
472 519 
   version "4.0.0"
473 520 
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
 
@@ -485,6 +532,11 @@ json5@^2.1.2:
485 532 
   dependencies:
486 533 
     minimist "^1.2.5"
487 534
535 
+jwt-decode@^3.1.2:
536 
+  version "3.1.2"
537 
+  resolved "https://registry.yarnpkg.com/jwt-decode/-/jwt-decode-3.1.2.tgz#3fb319f3675a2df0c2895c8f5e9fa4b67b04ed59"
538 
+  integrity sha512-UfpWE/VZn0iP50d8cz9NrZLM9lSWhcJ+0Gt/nm4by88UL+J1SiKN8/5dkjMmbEzwL2CAe+67GsegCbIKtbp75A==
539 
+
488 540 
 loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1, loose-envify@^1.4.0:
489 541 
   version "1.4.0"
490 542 
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
 
@@ -556,7 +608,7 @@ postcss@^8.3.4:
556 608 
     nanoid "^3.1.23"
557 609 
     source-map-js "^0.6.2"
558 610
559 
-prop-types@^15.6.2:
611 
+prop-types@^15.6.2, prop-types@^15.7.2:
560 612 
   version "15.7.2"
561 613 
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
562 614 
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
 
@@ -574,11 +626,23 @@ react-dom@^17.0.0:
574 626 
     object-assign "^4.1.1"
575 627 
     scheduler "^0.20.2"
576 628
577 
-react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1:
629 
+react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1:
578 630 
   version "16.13.1"
579 631 
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
580 632 
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
581 633
634 
+react-redux@^7.2.4:
635 
+  version "7.2.4"
636 
+  resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.2.4.tgz#1ebb474032b72d806de2e0519cd07761e222e225"
637 
+  integrity sha512-hOQ5eOSkEJEXdpIKbnRyl04LhaWabkDPV+Ix97wqQX3T3d2NQ8DUblNXXtNMavc7DpswyQM6xfaN4HQDKNY2JA==
638 
+  dependencies:
639 
+    "@babel/runtime" "^7.12.1"
640 
+    "@types/react-redux" "^7.1.16"
641 
+    hoist-non-react-statics "^3.3.2"
642 
+    loose-envify "^1.4.0"
643 
+    prop-types "^15.7.2"
644 
+    react-is "^16.13.1"
645 
+
582 646 
 react-refresh@^0.9.0:
583 647 
   version "0.9.0"
584 648 
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf"
 
@@ -628,6 +692,23 @@ readdirp@~3.6.0:
628 692 
   dependencies:
629 693 
     picomatch "^2.2.1"
630 694
695 
+redux-persist@^6.0.0:
696 
+  version "6.0.0"
697 
+  resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-6.0.0.tgz#b4d2972f9859597c130d40d4b146fecdab51b3a8"
698 
+  integrity sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==
699 
+
700 
+redux-thunk@^2.3.0:
701 
+  version "2.3.0"
702 
+  resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"
703 
+  integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw==
704 
+
705 
+redux@^4.0.0, redux@^4.1.0:
706 
+  version "4.1.0"
707 
+  resolved "https://registry.yarnpkg.com/redux/-/redux-4.1.0.tgz#eb049679f2f523c379f1aff345c8612f294c88d4"
708 
+  integrity sha512-uI2dQN43zqLWCt6B/BMGRMY6db7TTY4qeHHfGeKb3EOhmOKjU3KdWvNLJyqaHRksv/ErdNH7cFZWg9jXtewy4g==
709 
+  dependencies:
710 
+    "@babel/runtime" "^7.9.2"
711 
+
631 712 
 regenerator-runtime@^0.13.4:
632 713 
   version "0.13.7"
633 714 
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55"

Write Preview
Loading…
Cancel
Save