diff --git a/backend/src/validators/validateAccount.js b/backend/src/validators/validateAccount.js index e9c0353..ef180da 100644 --- a/backend/src/validators/validateAccount.js +++ b/backend/src/validators/validateAccount.js @@ -7,7 +7,7 @@ const schema = Joi.object({ status: Joi.string().allow(""), phone_number: Joi.number() .max(10 ** 10 - 1) - .allow(""), + .allow(null), city: Joi.string().allow(""), employment_type: Joi.string().allow(""), experience: Joi.string().allow(""), diff --git a/frontend/index.html b/frontend/index.html index 40a8a00..e433c98 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -6,6 +6,7 @@ rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Jost&family=Krona+One&display=swap" /> + Externatic diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 97d42f7..b542016 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -17,6 +17,7 @@ "react-router-dom": "^6.14.2", "react-select": "^5.8.0", "react-slick": "^0.29.0", + "react-toastify": "^10.0.4", "slick-carousel": "^1.8.1", "vite": "^4.4.7" }, @@ -1697,6 +1698,14 @@ "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==" }, + "node_modules/clsx": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.0.tgz", + "integrity": "sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg==", + "engines": { + "node": ">=6" + } + }, "node_modules/color-convert": { "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", @@ -4427,6 +4436,18 @@ "react-dom": "^0.14.0 || ^15.0.1 || ^16.0.0 || ^17.0.0 || ^18.0.0" } }, + "node_modules/react-toastify": { + "version": "10.0.4", + "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-10.0.4.tgz", + "integrity": "sha512-etR3RgueY8pe88SA67wLm8rJmL1h+CLqUGHuAoNsseW35oTGJEri6eBTyaXnFKNQ80v/eO10hBYLgz036XRGgA==", + "dependencies": { + "clsx": "^2.1.0" + }, + "peerDependencies": { + "react": ">=16", + "react-dom": ">=16" + } + }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", @@ -6542,6 +6563,11 @@ "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==" }, + "clsx": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.0.tgz", + "integrity": "sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg==" + }, "color-convert": { "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", @@ -8505,6 +8531,14 @@ "resize-observer-polyfill": "^1.5.0" } }, + "react-toastify": { + "version": "10.0.4", + "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-10.0.4.tgz", + "integrity": "sha512-etR3RgueY8pe88SA67wLm8rJmL1h+CLqUGHuAoNsseW35oTGJEri6eBTyaXnFKNQ80v/eO10hBYLgz036XRGgA==", + "requires": { + "clsx": "^2.1.0" + } + }, "react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", diff --git a/frontend/package.json b/frontend/package.json index 5cd9399..cf9cf74 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -17,6 +17,7 @@ "react-router-dom": "^6.14.2", "react-select": "^5.8.0", "react-slick": "^0.29.0", + "react-toastify": "^10.0.4", "slick-carousel": "^1.8.1", "vite": "^4.4.7" }, diff --git a/frontend/src/components/Carousel.css b/frontend/src/components/Carousel.css index 359c157..3b46b59 100644 --- a/frontend/src/components/Carousel.css +++ b/frontend/src/components/Carousel.css @@ -76,8 +76,8 @@ margin-top: 30px; } -@media only screen and (max-width: 820px) { +@media only screen and (max-width: 390px) { .slick-list { - margin-left: 180px; + margin-left: 10px; } } diff --git a/frontend/src/components/CarouselCompanies.css b/frontend/src/components/CarouselCompanies.css index 80f92b6..44ca9ed 100644 --- a/frontend/src/components/CarouselCompanies.css +++ b/frontend/src/components/CarouselCompanies.css @@ -44,3 +44,13 @@ margin-left: 220px; } } + +@media only screen and (max-width: 390px) { + .slick-list { + margin-left: 10px; + } + + .img-caroussel { + margin-left: 110px; + } +} diff --git a/frontend/src/components/CarouselCompanies.jsx b/frontend/src/components/CarouselCompanies.jsx index 7d0595d..1024f47 100644 --- a/frontend/src/components/CarouselCompanies.jsx +++ b/frontend/src/components/CarouselCompanies.jsx @@ -16,11 +16,21 @@ function CarouselCompanies() { window.addEventListener("resize", updateDimension); }, []); + const ShowBreakPoint = { + 821: 4, + 820: 2, + 390: 1, + }; + + const defaultShow = 4; + + const ToShow = ShowBreakPoint[windowSize] || defaultShow; + const settings = { infinite: true, speed: 500, slidesToScroll: 1, - slidesToShow: windowSize > 820 ? 4 : 2, + slidesToShow: ToShow, initialSlide: 0, autoplay: true, autoplaySpeed: 4000, @@ -42,7 +52,7 @@ function CarouselCompanies() { return (
-

Ils nous font confiance

{" "} +

Ils nous font confiance

{companies.map((compagny) => ( -
+
{compagny.name}
))} - {" "} +
); diff --git a/frontend/src/components/JobCard.jsx b/frontend/src/components/JobCard.jsx index 6911078..c243d42 100644 --- a/frontend/src/components/JobCard.jsx +++ b/frontend/src/components/JobCard.jsx @@ -6,15 +6,11 @@ import connexion from "../services/connexion"; import "./JobCard.css"; import { useJobContext } from "../contexts/context"; -import { useAuthContext } from "../contexts/auth"; function JobCard({ job, cardStyle, refresh, isUserPage }) { const { favorites, manageFavorites } = useJobContext(); - const { connected } = useAuthContext(); const { companyId } = useParams(); - const access = connected.role_id === 2 || connected.role_id === 3; - const dateDiffInDaysFromToday = (date) => { const targetDate = new Date(date); const today = new Date(); @@ -36,9 +32,9 @@ function JobCard({ job, cardStyle, refresh, isUserPage }) {

{job.title}

diff --git a/frontend/src/components/NavBar.css b/frontend/src/components/NavBar.css index 364ca6a..7ba67ea 100644 --- a/frontend/src/components/NavBar.css +++ b/frontend/src/components/NavBar.css @@ -69,3 +69,28 @@ font-size: 15px; } } + +@media only screen and (max-width: 390px) { + .logo { + width: 60px; + height: 50px; + } + + .link-page { + font-size: 20px; + transition: color 0.3s ease; + margin-left: 20px; + margin-right: 15px; + } + + .navbar { + border-bottom: solid 5px; + } + + .button-connect { + width: 75px; + height: 30px; + margin-top: 25px; + font-size: 12px; + } +} diff --git a/frontend/src/components/SearchBar.css b/frontend/src/components/SearchBar.css index abb039c..70a7342 100644 --- a/frontend/src/components/SearchBar.css +++ b/frontend/src/components/SearchBar.css @@ -60,3 +60,9 @@ .button-job { height: 2rem; } + +@media only screen and (max-width: 390px) { + .search-input { + width: 15rem; + } +} diff --git a/frontend/src/components/headJobs.jsx b/frontend/src/components/headJobs.jsx index c753d8b..616cff5 100644 --- a/frontend/src/components/headJobs.jsx +++ b/frontend/src/components/headJobs.jsx @@ -1,5 +1,7 @@ import React, { useContext } from "react"; import { useLoaderData } from "react-router-dom"; +import { ToastContainer, toast } from "react-toastify"; +import "react-toastify/dist/ReactToastify.css"; import { AuthContext } from "../contexts/auth"; import connexion from "../services/connexion"; @@ -18,8 +20,10 @@ function HeadJob() { const application = { job_id: job.id, user_id: connected.id }; try { connexion.post("/application", application); + toast.success("Votre candidature a été soumise avec succès"); } catch (err) { console.error(err); + toast.error("Une erreur s'est produite. Veuillez réessayer plus tard"); } }; @@ -48,6 +52,7 @@ function HeadJob() {
+ ); } diff --git a/frontend/src/pages/CandidatAccount.jsx b/frontend/src/pages/CandidatAccount.jsx index a652bc1..f358b93 100644 --- a/frontend/src/pages/CandidatAccount.jsx +++ b/frontend/src/pages/CandidatAccount.jsx @@ -12,7 +12,7 @@ function CandidatAccount() { email: connected.email, lastname: connected.lastname || "", firstname: connected.firstname || "", - phone_number: connected.phone_number || "", + phone_number: connected.phone_number || null, city: connected.city || "", employment_type: connected.employment_type || "", experience: connected.experience || "", diff --git a/frontend/src/pages/HomePage.css b/frontend/src/pages/HomePage.css index cc421c0..4438e42 100644 --- a/frontend/src/pages/HomePage.css +++ b/frontend/src/pages/HomePage.css @@ -180,3 +180,62 @@ font-size: 45px; } } + +@media only screen and (max-width: 390px) { + .small-image-1 { + left: 31%; + transform: translateX(-50%); + } + + .img-home-small { + width: auto; + height: 80px; + margin-top: 40px; + } + + .small-image-2 { + top: 140px; + left: 70%; + transform: translateX(-50%); + } + + .small-image-3 { + top: 350px; + left: 32%; + transform: translateX(-50%); + } + + .small-image-4 { + top: 570px; + left: 70%; + transform: translateX(-50%); + } + + .subtitle-externatic-red { + font-size: 25px; + } + + .externatic-red { + font-size: 45px; + } + .bar-arrow { + height: 750px; + } + + .account-img { + height: 175px; + } + + .post-img { + height: 110px; + } + + .consul-img { + height: 105px; + } + + .consul-container { + margin-top: 100px; + margin-left: 10px; + } +} diff --git a/frontend/src/pages/HomePage.jsx b/frontend/src/pages/HomePage.jsx index 2c8c008..b8791ec 100644 --- a/frontend/src/pages/HomePage.jsx +++ b/frontend/src/pages/HomePage.jsx @@ -58,10 +58,10 @@ function HomePage() {

Comment ça marche ?

- account - post + account + post
- consul + consul
diff --git a/frontend/src/pages/jobId.css b/frontend/src/pages/jobId.css index b08799f..b24ebb4 100644 --- a/frontend/src/pages/jobId.css +++ b/frontend/src/pages/jobId.css @@ -1,3 +1,9 @@ +:root { + --toastify-color-dark: #fc005b; + --toastify-color-success: #ffffff; + --toastify-color-error: #ffffff; +} + .resume { display: flex; justify-content: center; @@ -31,4 +37,6 @@ border-radius: 5px; font-weight: bold; cursor: pointer; + margin-bottom: 50px; + margin-top: 50px; } diff --git a/frontend/src/pages/jobId.jsx b/frontend/src/pages/jobId.jsx index 5f214f5..b64a154 100644 --- a/frontend/src/pages/jobId.jsx +++ b/frontend/src/pages/jobId.jsx @@ -1,5 +1,7 @@ import React, { useContext } from "react"; import { useLoaderData } from "react-router-dom"; +import { ToastContainer, toast } from "react-toastify"; +import "react-toastify/dist/ReactToastify.css"; import HeadJob from "../components/headJobs"; import connexion from "../services/connexion"; @@ -20,8 +22,10 @@ function JobId() { const application = { job_id: job.id, user_id: connected.id }; try { connexion.post("/application", application); + toast.success("Votre candidature a été soumise avec succès"); } catch (err) { console.error(err); + toast.error("Une erreur s'est produite. Veuillez réessayer plus tard"); } }; @@ -51,16 +55,13 @@ function JobId() {

{job.description_process}

Date de prise de l'emploi:{formatDate(job.starting_date)}

-
-

Votre consultant

-
-
Veuillez vous connecter pour en savoir plus
{connected.role_id && ( )} + ); }