Merge pull request #135 from WildCodeSchool/user_update

User update
WildCodeSchool · Feb 5, 2024 · d9afee1 · d9afee1
2 parents 20e17fb + 4d8964d
commit d9afee1
Show file tree

Hide file tree

Showing 19 changed files with 234 additions and 317 deletions.
diff --git a/frontend/src/App.css b/frontend/src/App.css
@@ -121,8 +121,9 @@ body {
 .container-page.with-rounded-border {
   border-top-left-radius: 50px;
   border-top-right-radius: 50px;
-  padding-top: 70px;
+  padding-top: 10px;
   margin-top: -170px;
+  margin-bottom: 100px;
 }
 
 #sign.container-page.with-rounded-border,

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
@@ -1,12 +1,14 @@
 import { Outlet } from "react-router-dom";
 import Navbar from "./components/NavBar/NavBar";
+import Footer from "./components/Footer/Footer";
 import "./App.css";
 
 function App() {
   return (
     <>
       <Navbar />
       <Outlet />
+      <Footer />
     </>
   );
 }

diff --git a/frontend/src/components/CardModel/card-model.css b/frontend/src/components/CardModel/card-model.css
@@ -3,7 +3,7 @@
   padding: 30px;
   border-radius: 6px;
   box-shadow: 5px 5px 15px 8px rgba(217, 217, 217, 0.53);
-  margin: 20px 0;
+  margin: 30px 0;
   overflow: hidden;
 }
 

diff --git a/frontend/src/components/Dashboards/RowDash2.jsx b/frontend/src/components/Dashboards/RowDash2.jsx
@@ -1,11 +1,11 @@
 import React, { useState, useEffect } from "react";
 import "./RowDash.css";
 import { useGlobalContext } from "../../contexts/GlobalContext";
-import { useAdminContext } from "../../contexts/AdminContext";
+// import { useAdminContext } from "../../contexts/AdminContext";
 
 function RowDash2() {
   const { apiService } = useGlobalContext();
-  const { goToEditUser } = useAdminContext();
+  // const { goToEditUser } = useAdminContext();
   const [users, setUsers] = useState([]);
 
   const fetchUsers = async () => {
@@ -48,14 +48,14 @@ function RowDash2() {
           <p className="bigArray-box">{user.email}</p>
           <p>{user.is_admin}</p>
           <div className="icon-dash">
-            <button
+            {/* <button
               type="button"
               aria-label="editeuser"
               onClick={() => goToEditUser(user.id)}
               className="invisible-button"
             >
               <i className="fa-solid fa-pen" />
-            </button>
+            </button> */}
             <button
               type="button"
               aria-label="deleteuser"

diff --git a/frontend/src/components/Footer/Footer.jsx b/frontend/src/components/Footer/Footer.jsx
@@ -0,0 +1,18 @@
+import React from "react";
+import { MDBFooter } from "mdb-react-ui-kit";
+
+export default function Footer() {
+  return (
+    <MDBFooter bgColor="light" className="text-center text-lg-left">
+      <div
+        className="text-center p-3"
+        style={{ backgroundColor: "#c91f61", color: "white" }}
+      >
+        &copy; {new Date().getFullYear()} Copyright:{" "}
+        <a className="text-light" href="https://mdbootstrap.com/">
+          Externatic.com
+        </a>
+      </div>
+    </MDBFooter>
+  );
+}
diff --git a/frontend/src/components/Footer/footer.css b/frontend/src/components/Footer/footer.css
diff --git a/frontend/src/components/Headers/HeaderLongUser.jsx b/frontend/src/components/Headers/HeaderLongUser.jsx
@@ -1,10 +1,9 @@
 import "./header.css";
 import { useState } from "react";
-import PropTypes from "prop-types";
 import Unknow from "../../assets/no-profile.jpg";
 import { useGlobalContext } from "../../contexts/GlobalContext";
 
-function HeaderLongUser({ textTitle, textTitle2 }) {
+function HeaderLongUser() {
   const [file, setFile] = useState();
   const { apiService, setUser, user } = useGlobalContext();
 
@@ -45,28 +44,26 @@ function HeaderLongUser({ textTitle, textTitle2 }) {
             alt=""
           />
         </div>
-        <form onSubmit={handleSubmit}>
-          <input
-            type="file"
-            accept="image/*"
-            onChange={(e) => setFile(e.target.files[0])}
-          />
-          <button type="submit">Modifier</button>
-        </form>
-        <h1>
-          {textTitle} {textTitle2}
-        </h1>
+        <div className="form-img">
+          <form className="yooo" onSubmit={handleSubmit}>
+            <label htmlFor="file" className="label-file">
+              {" "}
+              Choisir une image
+            </label>
+            <input
+              id="file"
+              className="input-img"
+              type="file"
+              accept="image/*"
+              onChange={(e) => setFile(e.target.files[0])}
+            />
+            <button type="submit">Modifier</button>
+          </form>
+        </div>
+        <h1>Modifier votre profil</h1>
       </div>
     </header>
   );
 }
 
-HeaderLongUser.propTypes = {
-  textTitle: PropTypes.string,
-  textTitle2: PropTypes.string,
-};
-HeaderLongUser.defaultProps = {
-  textTitle: "Titre par défaut",
-  textTitle2: "Titre 2 par défaut",
-};
 export default HeaderLongUser;
diff --git a/frontend/src/components/Headers/header.css b/frontend/src/components/Headers/header.css
@@ -3,7 +3,7 @@
   background-color: var(--main-color);
   padding-bottom: 40px;
   margin-top: -50px;
-  padding-top: 80px;
+  padding-top: 50px;
 }
 
 .edit-profile-btn {
@@ -39,8 +39,7 @@
 
 .header .header-content h1 {
   font-weight: 500;
-  margin-left: 30px;
-  margin-right: 30px;
+  margin-bottom: 180px;
 }
 
 .header .header-content h2 {
@@ -63,11 +62,35 @@
 }
 
 .header .profile-img-container img {
-  width: 100%;
+  width: 100px;
   height: auto;
   border-radius: 50%;
 }
 
+.input-img {
+  display: none;
+}
+.form-img {
+  display: flex;
+  width: 100%;
+  flex-direction: row;
+  justify-content: center;
+  padding: 20px 0;
+}
+.label-file {
+  cursor: pointer;
+  color: black;
+  background-color: white;
+  padding: 7px 12px;
+  border-radius: 50px;
+}
+
+.yooo {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 30px;
+}
 .header .header-content.user button {
   margin-top: -15px;
   background-color: white;
@@ -100,4 +123,8 @@
   .edit-profile-btn {
     margin-top: -200px;
   }
+
+  .header .header-content h1 {
+    margin: 80px 0 130px 0;
+  }
 }
diff --git a/frontend/src/components/HomeCard/HomeCard.css b/frontend/src/components/HomeCard/HomeCard.css
@@ -0,0 +1,50 @@
+.big-homeCard-container {
+  padding: 60px 0;
+}
+.big-homeCard-container span {
+  color: var(--second-color);
+  font-weight: 600;
+  font-style: italic;
+}
+
+.big-homeCard-container h1 {
+  padding-bottom: 20px;
+}
+
+.homeCard-container {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  color: black;
+}
+
+.card-one,
+.card-two,
+.card-three {
+  padding: 30px 15px;
+  margin: 20px 0;
+  border-radius: 5px;
+  box-shadow: 0 4px 8px rgba(85, 85, 85, 0.2);
+  background-color: var(--background-input);
+}
+
+.homeCard-container i {
+  font-size: 30px;
+  padding-bottom: 15px;
+  color: var(--main-color);
+}
+
+@media screen and (min-width: 768px) {
+  .homeCard-container {
+    display: flex;
+    justify-content: center;
+    flex-direction: row;
+    gap: 50px;
+  }
+  .card-one,
+  .card-two,
+  .card-three {
+    margin: 30px 0;
+    width: 30%;
+  }
+}
diff --git a/frontend/src/components/HomeCard/HomeCard.jsx b/frontend/src/components/HomeCard/HomeCard.jsx
@@ -0,0 +1,59 @@
+import { useGlobalContext } from "../../contexts/GlobalContext";
+import "./HomeCard.css";
+
+function HomeCard() {
+  const { user } = useGlobalContext();
+  return (
+    <div className="big-homeCard-container">
+      {user ? (
+        <h1>
+          {user.firstname}, Bienvenue chez <span>Externatic !</span>
+        </h1>
+      ) : (
+        <h1>
+          Bienvenue chez <span>Externatic !</span>
+        </h1>
+      )}
+      <div className="homeCard-container">
+        <div className="card-one">
+          <i className="fa-regular fa-address-book" />
+          <h2>Inscrivez-vous!</h2>
+          <p>
+            En vous inscrivant, initiez votre retour à l'emploi avec notre
+            plateforme ! Explorez des opportunités, acquérez des compétences,
+            créez des liens professionnels enrichissants. Notre engagement est
+            de vous fournir les outils nécessaires pour surmonter les défis et
+            atteindre vos objectifs professionnels, faisant ainsi de votre
+            avenir une promesse de réussite.{" "}
+          </p>
+        </div>
+        <div className="card-two">
+          <i className="fa-regular fa-file" />
+          <h2>Remplissez votre CV</h2>
+          <p>
+            Vous allez pouvoir ajouter vos différentes formations et expériences
+            qui valoriseront davantage votre profil auprès des recruteurs. Cette
+            vitrine renforcera votre présence en ligne, augmentant vos chances
+            de captiver l'attention des employeurs. Exploitez cette opportunité
+            pour renforcez votre position sur le marché du travail et donnez un
+            nouvel élan à votre carrière.{" "}
+          </p>
+        </div>
+        <div className="card-three">
+          <i className="fa-regular fa-eye" />
+          <h2>Consultez les offres</h2>
+          <p>
+            Avec votre CV completé, notre système sélectionne minutieusement des
+            offres alignées sur vos compétences, maximisant ainsi vos chances
+            d'entretiens réussis. Simplifiant votre parcours professionnel, nous
+            vous dirigeons vers des opportunités reflétant au mieux vos
+            aptitudes, facilitant la recherche d'emploi et favorisant des
+            entrevues significatives.{" "}
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default HomeCard;
diff --git a/frontend/src/components/NavBar/NavBar.jsx b/frontend/src/components/NavBar/NavBar.jsx
@@ -74,20 +74,13 @@ export default function Navbar() {
                 ) : null}
                 <div className="btn-nav">
                   {user ? (
-                    <>
-                      <Link
-                        to="/login"
-                        className="navbar-link"
-                        onClick={handleLogout}
-                      >
-                        Se déconnecter
-                      </Link>
-                      <Link className="navbar-link profile" to="/profile">
-                        {" "}
-                        {/* <i class="fa-solid fa-user"></i> */}
-                        Hello {user.firstname}
-                      </Link>
-                    </>
+                    <Link
+                      to="/login"
+                      className="navbar-link"
+                      onClick={handleLogout}
+                    >
+                      Se déconnecter
+                    </Link>
                   ) : (
                     <>
                       <Link to="/login">

diff --git a/frontend/src/contexts/AdminContext.jsx b/frontend/src/contexts/AdminContext.jsx
@@ -37,9 +37,9 @@ function AdminContextProvider({ children }) {
     navigate(`/dashboard/edit-offer/${id}`);
   };
 
-  const goToEditUser = (id) => {
-    navigate(`/dashboard/edit-user/${id}`);
-  };
+  // const goToEditUser = (id) => {
+  //   navigate(`/dashboard/edit-user/${id}`);
+  // };
 
   const contextValues = useMemo(
     () => ({
@@ -51,7 +51,7 @@ function AdminContextProvider({ children }) {
       handleOffers,
       handleUsers,
       goToEditOffer,
-      goToEditUser,
+      // goToEditUser,
     }),
     [
       isAdmin,
@@ -62,7 +62,7 @@ function AdminContextProvider({ children }) {
       handleAddOffer,
       handleOffers,
       goToEditOffer,
-      goToEditUser,
+      // goToEditUser,
     ]
   );
 

diff --git a/frontend/src/main.jsx b/frontend/src/main.jsx
@@ -94,9 +94,7 @@ const router = createBrowserRouter([
         path: "/dashboard",
         element: (
           <AdminContextProvider>
-            {/* <AdminChecker> */}
             <Dashboard1 />
-            {/* </AdminChecker> */}
           </AdminContextProvider>
         ),
         loader: async () => currentAdmin(apiService),