From 87e6745a50d05a4dd41931c8833931be46dd825b Mon Sep 17 00:00:00 2001 From: romaing Date: Thu, 4 Jan 2024 18:35:27 +0100 Subject: [PATCH] added login --- backend/src/controllers/authControllers.js | 23 ++++++++ backend/src/models/UserManager.js | 11 ++++ backend/src/router.js | 15 +++-- frontend/src/App.jsx | 29 +++++++-- frontend/src/main.jsx | 5 ++ frontend/src/pages/Login.jsx | 68 ++++++++++++++++++++++ 6 files changed, 142 insertions(+), 9 deletions(-) create mode 100644 backend/src/controllers/authControllers.js create mode 100644 frontend/src/pages/Login.jsx diff --git a/backend/src/controllers/authControllers.js b/backend/src/controllers/authControllers.js new file mode 100644 index 0000000..1b6cc11 --- /dev/null +++ b/backend/src/controllers/authControllers.js @@ -0,0 +1,23 @@ +// Import access to database tables +const tables = require("../tables"); + +const login = async (req, res, next) => { + try { + // Fetch all users from the database + const user = await tables.user.readByEmail(req.body.email); + + if (user == null || user.password !== req.body.password) { + res.sendStatus(422); + } else { + // Respond with the users in JSON format + res.json(user); + } + } catch (err) { + // Pass any errors to the error-handling middleware + next(err); + } +}; + +module.exports = { + login, +}; diff --git a/backend/src/models/UserManager.js b/backend/src/models/UserManager.js index b2dba22..c3c2fff 100644 --- a/backend/src/models/UserManager.js +++ b/backend/src/models/UserManager.js @@ -41,6 +41,17 @@ class UserManager extends AbstractManager { return rows; } + async readByEmail(email) { + // Execute the SQL SELECT query to retrieve a specific user by its email + const [rows] = await this.database.query( + `select * from ${this.table} where email = ?`, + [email] + ); + + // Return the first row of the result, which represents the user + return rows[0]; + } + // The U of CRUD - Update operation // TODO: Implement the update operation to modify an existing user diff --git a/backend/src/router.js b/backend/src/router.js index 30c8bbf..c75961e 100644 --- a/backend/src/router.js +++ b/backend/src/router.js @@ -6,6 +6,13 @@ const router = express.Router(); // Define Your API Routes Here /* ************************************************************************* */ +// Import itemControllers module for handling item-related operations +const itemControllers = require("./controllers/itemControllers"); + +router.get("/items", itemControllers.browse); +router.get("/items/:id", itemControllers.read); +router.post("/items", itemControllers.add); + // Import userControllers module for handling user-related operations const userControllers = require("./controllers/userControllers"); @@ -13,12 +20,10 @@ router.get("/users", userControllers.browse); router.get("/users/:id", userControllers.read); router.post("/users", userControllers.add); -// Import itemControllers module for handling item-related operations -const itemControllers = require("./controllers/itemControllers"); +// Import authControllers module for handling auth-related operations +const authControllers = require("./controllers/authControllers"); -router.get("/items", itemControllers.browse); -router.get("/items/:id", itemControllers.read); -router.post("/items", itemControllers.add); +router.post("/login", authControllers.login); /* ************************************************************************* */ diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index dfee829..f889e57 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -1,8 +1,11 @@ import { Link, Outlet } from "react-router-dom"; import "./App.css"; +import { useState } from "react"; function App() { + const [user, setUser] = useState(); + return ( <>
- +
); diff --git a/frontend/src/main.jsx b/frontend/src/main.jsx index fc73dc9..c8fd6f7 100644 --- a/frontend/src/main.jsx +++ b/frontend/src/main.jsx @@ -6,6 +6,7 @@ import { createBrowserRouter, RouterProvider } from "react-router-dom"; import App from "./App"; import Home from "./pages/Home"; +import Login from "./pages/Login"; import Register from "./pages/Register"; const router = createBrowserRouter([ @@ -16,6 +17,10 @@ const router = createBrowserRouter([ path: "/", element: , }, + { + path: "/login", + element: , + }, { path: "/register", element: , diff --git a/frontend/src/pages/Login.jsx b/frontend/src/pages/Login.jsx new file mode 100644 index 0000000..f67f5f6 --- /dev/null +++ b/frontend/src/pages/Login.jsx @@ -0,0 +1,68 @@ +import { useRef } from "react"; +import { useNavigate, useOutletContext } from "react-router-dom"; + +function Login() { + // Références pour les champs email et mot de passe + const emailRef = useRef(); + const passwordRef = useRef(); + + const { setUser } = useOutletContext(); + + // Hook pour la navigation + const navigate = useNavigate(); + + // Gestionnaire de soumission du formulaire + const handleSubmit = async (event) => { + event.preventDefault(); + + try { + // Appel à l'API pour demander une connexion + const response = await fetch( + `${import.meta.env.VITE_BACKEND_URL}/api/login`, + { + method: "post", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ + email: emailRef.current.value, + password: passwordRef.current.value, + }), + } + ); + + // Redirection vers la page de connexion si la création réussit + if (response.status === 200) { + const user = await response.json(); + + setUser(user); + + navigate("/"); + } else { + // Log des détails de la réponse en cas d'échec + console.info(response); + } + } catch (err) { + // Log des erreurs possibles + console.error(err); + } + }; + + // Rendu du composant formulaire + return ( +
+
+ {/* Champ pour l'email */} + {" "} + +
+
+ {/* Champ pour le mot de passe */} + {" "} + +
+ {/* Bouton de soumission du formulaire */} + +
+ ); +} + +export default Login;