Merge branch 'avatar' of github.com:Dreallers/WildTube into avatar

Dreallers · Jan 24, 2024 · 5c3307f · 5c3307f
2 parents 3478891 + eeeaf58
commit 5c3307f
Show file tree

Hide file tree

Showing 14 changed files with 141 additions and 32 deletions.
diff --git a/backend/database/schema.sql b/backend/database/schema.sql
@@ -65,8 +65,8 @@ CREATE TABLE
     `Categorie_par_film` (
         `filmId` INT NOT NULL,
         `categorieId` INT NOT NULL,
-        CONSTRAINT FK_Categorie_Par_Film_film_id FOREIGN KEY (`filmId`) REFERENCES `Film` (`id`),
-        CONSTRAINT FK_Categorie_Par_Film_categorie_id FOREIGN KEY (`categorieId`) REFERENCES `Categorie` (`id`),
+        CONSTRAINT FK_Categorie_Par_Film_film_id FOREIGN KEY (`filmId`) REFERENCES `Film` (`id`) ON DELETE CASCADE,
+        CONSTRAINT FK_Categorie_Par_Film_categorie_id FOREIGN KEY (`categorieId`) REFERENCES `Categorie` (`id`) ON DELETE CASCADE,
         PRIMARY KEY (`filmId`, `categorieId`)
     );
 
@@ -80,6 +80,6 @@ CREATE TABLE
         `content` VARCHAR(500) NOT NULL,
         `date` DATETIME NOT NULL,
         `unique_key` VARCHAR(255) NOT NULL,
-        CONSTRAINT FK_Commentaire_Film_user_id FOREIGN KEY (`userId`) REFERENCES `User` (`id`),
-        CONSTRAINT FK_Commentaire_Film_film_id FOREIGN KEY (`filmId`) REFERENCES `Film` (`id`)
+        CONSTRAINT FK_Commentaire_Film_user_id FOREIGN KEY (`userId`) REFERENCES `User` (`id`) ON DELETE CASCADE,
+        CONSTRAINT FK_Commentaire_Film_film_id FOREIGN KEY (`filmId`) REFERENCES `Film` (`id`) ON DELETE CASCADE
     );
diff --git a/backend/src/controllers/filmControllers.js b/backend/src/controllers/filmControllers.js
@@ -110,6 +110,7 @@ const destroy = async (req, res, next) => {
 
 module.exports = {
   browse,
+  add,
   read,
   destroy,
   edit,

diff --git a/backend/src/controllers/userControllers.js b/backend/src/controllers/userControllers.js
@@ -98,20 +98,27 @@ const add = async (req, res, next) => {
     // Get the data submitted by the user in the request body
     const { name, email, naissance, civility, hashedPassword } = req.body;
 
-    // Add the new item to the database
-    const newUser = await tables.User.create({
-      name,
-      email,
-      naissance,
-      civility,
-      hashedPassword,
-    });
+    const existingUserEmail = await tables.User.readByEmail(email);
 
-    // Respond with the newly added item in JSON format
-    if (!newUser) {
-      res.status(400).json({ message: "Bad Request" });
+    if (existingUserEmail) {
+      // If the email already exists, respond with an error
+      res.status(400).json({ message: "Adresse email déjà utilisé" });
     } else {
-      res.status(201).json(newUser);
+      // Add the new item to the database
+      const newUser = await tables.User.create({
+        name,
+        email,
+        naissance,
+        civility,
+        hashedPassword,
+      });
+
+      // Respond with the newly added item in JSON format
+      if (!newUser) {
+        res.status(400).json({ message: "Bad Request" });
+      } else {
+        res.status(201).json(newUser);
+      }
     }
   } catch (err) {
     // Pass any errors to the error-handling middleware

diff --git a/backend/src/router.js b/backend/src/router.js
@@ -21,7 +21,7 @@ const commentaireFilmControllers = require("./controllers/commentaireFilmControl
 
 // Route to get a list of items
 router.get("/films", filmControllers.browse);
-// router.get("/films/:id", filmControllers.read);
+router.get("/films/:id", filmControllers.read);
 router.get(
   "/films/category/:id",
   categorieParFilmControllers.browseFilmsForSpecificCategorie

diff --git a/frontend/src/pages/AddVideos.jsx b/frontend/src/pages/AddVideos.jsx
@@ -1,5 +1,6 @@
 import { useState, useEffect } from "react";
 import axios from "axios";
+import toast from "react-hot-toast";
 
 function AddVideos() {
   const [file, setFile] = useState(undefined);
@@ -60,8 +61,10 @@ function AddVideos() {
         duration ||
         isAvailable) === (undefined || "" || false)
     ) {
+
       // eslint-disable-next-line no-alert
       alert("champ manquant");
+      toast.error("champ manquant");
     } else if (isAvailable === "utilisateur") {
       setIsAvailable(true);
     } else if (isAvailable === "visiteur") {

diff --git a/frontend/src/pages/AjoutAdmin.jsx b/frontend/src/pages/AjoutAdmin.jsx
@@ -1,9 +1,11 @@
 import { useState, useEffect } from "react";
 import axios from "axios";
 import toast from "react-hot-toast";
+import { useUser } from "../contexts/UserContext";
 import LogoContainer from "../components/LogoContainer";
 
 function AjoutAdmin() {
+  const { user: currentUser } = useUser();
   const [users, setUsers] = useState([]);
 
   const fetch = async () => {
@@ -18,6 +20,10 @@ function AjoutAdmin() {
   };
 
   const handleClick = async (user) => {
+    if (currentUser.id === user.id) {
+      toast.error("Vous ne pouvez pas supprimer votre propre compte");
+      return;
+    }
     if (user !== null) {
       try {
         await axios.put(

diff --git a/frontend/src/pages/Connection.jsx b/frontend/src/pages/Connection.jsx
@@ -1,7 +1,7 @@
-/*eslint-disable */
 import { NavLink, useNavigate } from "react-router-dom";
 import { useState } from "react";
 import axios from "axios";
+import toast from "react-hot-toast";
 import { useUser } from "../contexts/UserContext";
 import LogOut from "../components/LogOut";
 import LogoContainer from "../components/LogoContainer";
@@ -34,9 +34,11 @@ function Connection() {
         navigate("/");
       }
     } catch (err) {
+      toast.error("Email ou mot de passe incorect");
       console.error("Incorrect email or password");
     }
   };
+  // const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
 
   return (
     <div className="loginPage">
@@ -45,7 +47,13 @@ function Connection() {
       ) : (
         <>
           <LogoContainer />
-          <div className="form">
+          <form
+            className="form"
+            onSubmit={(e) => {
+              e.preventDefault();
+              handleLogin();
+            }}
+          >
             <div className="inputs">
               <div className="inputContainer">
                 <input
@@ -70,7 +78,7 @@ function Connection() {
               <div className="buttonContainer">
                 <div className="connectionButton">
                   <button
-                    type="button"
+                    type="submit"
                     className="connexion"
                     onClick={handleLogin}
                   >
@@ -93,7 +101,7 @@ function Connection() {
                 </span>
               </p>
             </div>
-          </div>
+          </form>
         </>
       )}
     </div>

diff --git a/frontend/src/pages/Inscription.jsx b/frontend/src/pages/Inscription.jsx
@@ -12,6 +12,8 @@ function Inscription() {
     password: "",
     avatar: "",
   });
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [emailError, setEmailError] = useState("");
 
   // const { updateUser, user: connectedUser } = useUser();
   const [showModal, setShowModal] = useState(false);
@@ -28,14 +30,23 @@ function Inscription() {
       [name]: value,
     }));
   };
+  const handleEmailChange = (e) => {
+    setEmailError("");
+    handleInputChange(e);
+  };
+
+  const handleConfirmPasswordChange = (e) => {
+    setConfirmPassword(e.target.value);
+  };
+
+  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
 
   const handleSubmit = async () => {
     if (user.civility === "Monsieur") {
       user.civility = true;
     } else if (user.civility === "Madame") {
       user.civility = false;
     }
-
     try {
       const result = await axios.post(
         `${import.meta.env.VITE_BACKEND_URL}/api/users`,
@@ -51,14 +62,25 @@ function Inscription() {
       // console.log("Request URL:", url);
       // console.log("User registered successfully");
     } catch (someError) {
-      console.error("Error during registration:", someError);
+      if (someError.response && someError.response.status === 400) {
+        // Si l'email existe déjà, définir l'erreur d'email
+        setEmailError(someError.response.data.message);
+      } else {
+        console.error("Error during registration:", someError);
+      }
     }
   };
   return (
     <div className="signUpPageMockupGuest">
       <div className="searchDisplaySection">
         <LogoContainer />
-        <form className="form">
+        <form
+          className="form"
+          onSubmit={(e) => {
+            e.preventDefault();
+            handleSubmit();
+          }}
+        >
           <div className="inputs">
             <div className="inputContainer">
               <input
@@ -74,28 +96,50 @@ function Inscription() {
               <input
                 type="email"
                 name="email"
-                className="input"
+                className={`input ${
+                  user.email && !emailRegex.test(user.email) ? "errorEmail" : ""
+                }`}
                 value={user.email}
-                onChange={handleInputChange}
+                onChange={handleEmailChange}
                 placeholder="Adresse Mail"
               />
+              {emailError && <div className="errorMessage">{emailError}</div>}
             </div>
             <div className="inputContainer">
               <input
                 type="password"
                 name="password"
-                className="input"
+                className={`input ${
+                  user.password && user.password.length < 8
+                    ? "errorPassword"
+                    : ""
+                }`}
+                minLength="8"
                 value={user.password}
                 onChange={handleInputChange}
                 placeholder="Mot de passe"
               />
+              {user.password && user.password.length < 8 && (
+                <div className="errorMessage">Min 8 caractères</div>
+              )}
             </div>
             <div className="inputContainer">
               <input
                 type="password"
-                className="input"
+                className={`input ${
+                  confirmPassword && user.password !== confirmPassword
+                    ? "errorPassword"
+                    : ""
+                }`}
+                value={confirmPassword}
+                onChange={handleConfirmPasswordChange}
                 placeholder="Confirmation du mot de passe"
               />
+              {confirmPassword && user.password !== confirmPassword && (
+                <div className="errorMessage">
+                  Les mots de passe ne sont pas identiques
+                </div>
+              )}
             </div>
           </div>
 
@@ -134,6 +178,7 @@ function Inscription() {
               <input
                 className="inputDate"
                 type="date"
+                max={new Date().toISOString().split("T")[0]}
                 name="naissance"
                 value={user.naissance}
                 onChange={handleInputChange}
@@ -144,7 +189,16 @@ function Inscription() {
             <button
               className="signUpButton"
               onClick={handleSubmit}
-              type="button"
+              type="submit"
+              disabled={
+                !user.name ||
+                !user.email ||
+                !user.password ||
+                !user.naissance ||
+                !user.civility ||
+                user.password.length < 8 ||
+                user.password !== confirmPassword
+              }
             >
               <p className="inscription">Inscription</p>
             </button>

diff --git a/frontend/src/pages/ParametreAdmin.jsx b/frontend/src/pages/ParametreAdmin.jsx
@@ -1,4 +1,4 @@
-import { useNavigate, Link, NavLink, useLocation } from "react-router-dom";
+import { useNavigate, Link, useLocation } from "react-router-dom";
 import { useUser } from "../contexts/UserContext";
 
 function ParametreAdmin() {
@@ -79,11 +79,11 @@ function ParametreAdmin() {
         <div className="params">
           <h3>Gérer les catégories</h3>
         </div>
-        <div className="params">
+        {/* <div className="params">
           <NavLink to="/AjoutAdmin">
             <h3>Ajouter des Administrateurs</h3>
           </NavLink>
-        </div>
+        </div> */}
         <div className="Useroption">
           <button
             className="RegarderPlusTardButton"

diff --git a/frontend/src/sass/_ajoutAdmin.scss b/frontend/src/sass/_ajoutAdmin.scss
@@ -12,8 +12,10 @@
 
   .containerUser {
     display: flex;
+    flex-wrap: wrap;
     flex-direction: column;
     justify-content: center;
+    max-width: 600px;
     gap: 5px;
     background: rgba(238, 226, 226, 0.1);
     border-bottom: 1px #ff509a solid;

diff --git a/frontend/src/sass/_connection.scss b/frontend/src/sass/_connection.scss
@@ -71,6 +71,7 @@
     justify-content: center;
     align-items: center;
     cursor: pointer;
+    max-width: 350px;
   }
   .signUpText {
     display: flex;

diff --git a/frontend/src/sass/_editVideo.scss b/frontend/src/sass/_editVideo.scss
@@ -20,6 +20,7 @@
       border-bottom: 1px #ff509a solid;
       height: 20vh;
       width: 80%;
+      max-width: 350px;
     }
     .min {
       position: absolute;
@@ -64,6 +65,7 @@
       height: 5vh;
       cursor: pointer;
       color: hsla(0, 0%, 86%, 1);
+      max-width: 250px;
     }
   }
   .delete {
@@ -74,5 +76,6 @@
     height: 5vh;
     cursor: pointer;
     color: hsla(0, 0%, 86%, 1);
+    max-width: 250px;
   }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -110,6 +110,7 @@ const destroy = async (req, res, next) => { @@
     module.exports = {
       browse,
+      add,
       read,
       destroy,
       edit,
@@ Expand Down @@