From 52f59c1ad5a7458f8670e9de506c3a735c0f3575 Mon Sep 17 00:00:00 2001 From: OlvMrn Date: Wed, 7 Feb 2024 16:52:04 +0100 Subject: [PATCH 1/2] =?UTF-8?q?suppression=20modale=20et=20affichage=20du?= =?UTF-8?q?=20bouton=20postuler=20uniquement=20si=20connect=C3=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/components/JobCard.jsx | 4 ++-- frontend/src/components/headJobs.jsx | 28 ++++++++++++++++++---------- frontend/src/pages/jobId.css | 1 + frontend/src/pages/jobId.jsx | 19 ++++++------------- 4 files changed, 27 insertions(+), 25 deletions(-) diff --git a/frontend/src/components/JobCard.jsx b/frontend/src/components/JobCard.jsx index ae2c027..df5a216 100644 --- a/frontend/src/components/JobCard.jsx +++ b/frontend/src/components/JobCard.jsx @@ -37,8 +37,8 @@ function JobCard({ job, cardStyle, refresh, isUserPage }) {

{job.title}

diff --git a/frontend/src/components/headJobs.jsx b/frontend/src/components/headJobs.jsx index 6d0cac1..c753d8b 100644 --- a/frontend/src/components/headJobs.jsx +++ b/frontend/src/components/headJobs.jsx @@ -1,7 +1,9 @@ -import React, { useRef } from "react"; +import React, { useContext } from "react"; import { useLoaderData } from "react-router-dom"; -import Modal from "./modal"; +import { AuthContext } from "../contexts/auth"; +import connexion from "../services/connexion"; + import "./headJobs.css"; function formatDate(time) { @@ -10,11 +12,16 @@ function formatDate(time) { function HeadJob() { const job = useLoaderData(); - const modal = useRef(null); + const { connected } = useContext(AuthContext); - function toggleRefModal() { - modal.current.toggleModal(); - } + const handleClick = async () => { + const application = { job_id: job.id, user_id: connected.id }; + try { + connexion.post("/application", application); + } catch (err) { + console.error(err); + } + }; return (
@@ -22,10 +29,11 @@ function HeadJob() {

{job.title}

- - + {connected.role_id && ( + + )}
    diff --git a/frontend/src/pages/jobId.css b/frontend/src/pages/jobId.css index 58b864a..b08799f 100644 --- a/frontend/src/pages/jobId.css +++ b/frontend/src/pages/jobId.css @@ -30,4 +30,5 @@ border: none; border-radius: 5px; font-weight: bold; + cursor: pointer; } diff --git a/frontend/src/pages/jobId.jsx b/frontend/src/pages/jobId.jsx index c1f4853..5f214f5 100644 --- a/frontend/src/pages/jobId.jsx +++ b/frontend/src/pages/jobId.jsx @@ -1,7 +1,6 @@ -import React, { useRef, useContext } from "react"; +import React, { useContext } from "react"; import { useLoaderData } from "react-router-dom"; -import Modal from "../components/modal"; import HeadJob from "../components/headJobs"; import connexion from "../services/connexion"; import { AuthContext } from "../contexts/auth"; @@ -16,14 +15,8 @@ function formatDate(time) { function JobId() { const job = useLoaderData(); const { connected } = useContext(AuthContext); - const modal = useRef(null); - - function toggleRefModal() { - modal.current.toggleModal(); - } const handleClick = async () => { - toggleRefModal(); const application = { job_id: job.id, user_id: connected.id }; try { connexion.post("/application", application); @@ -56,17 +49,17 @@ function JobId() {

    Type de contrat:{job.working_type}

    Le processus

    {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 && ( + + )}
); From 3cdbb5e75e2b1e701af403aecff8e400c3f9bf2f Mon Sep 17 00:00:00 2001 From: OlvMrn Date: Wed, 7 Feb 2024 16:53:27 +0100 Subject: [PATCH 2/2] =?UTF-8?q?suppression=20modale=20et=20affichage=20du?= =?UTF-8?q?=20bouton=20postuler=20uniquement=20si=20connect=C3=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/components/modal.css | 59 ------------------------------- frontend/src/components/modal.jsx | 50 -------------------------- 2 files changed, 109 deletions(-) delete mode 100644 frontend/src/components/modal.css delete mode 100644 frontend/src/components/modal.jsx diff --git a/frontend/src/components/modal.css b/frontend/src/components/modal.css deleted file mode 100644 index 062d26a..0000000 --- a/frontend/src/components/modal.css +++ /dev/null @@ -1,59 +0,0 @@ -body.active-modal { - overflow-y: hidden; -} - -.btn-modal { - padding: 10px 20px; - display: block; - margin: 100px auto 0; - font-size: 18px; -} - -.modal, -.overlay { - width: 100vw; - height: 100vh; - top: 0; - left: 0; - right: 0; - bottom: 0; - position: fixed; -} - -.overlay { - background: rgba(49, 49, 49, 0.8); -} -.modal-content { - display: flex; - justify-content: center; - align-items: center; - height: 150px; - position: absolute; - top: 40%; - left: 50%; - transform: translate(-50%, -50%); - line-height: 1.4; - background: #fc005b; - padding: 14px 28px; - border-radius: 3px; - max-width: 600px; - min-width: 300px; -} - -.close-modal { - background: #fc005b; - position: absolute; - top: 10px; - right: 10px; - padding: 5px 7px; - color: white; - height: 40px; - border: none; - border-radius: 5px; - font-weight: bold; -} - -.modal p { - color: white; - font-size: 24px; -} diff --git a/frontend/src/components/modal.jsx b/frontend/src/components/modal.jsx deleted file mode 100644 index f24dad2..0000000 --- a/frontend/src/components/modal.jsx +++ /dev/null @@ -1,50 +0,0 @@ -import React, { useState, forwardRef, useImperativeHandle } from "react"; -import "./modal.css"; - -const Modal = forwardRef((props, ref) => { - const [modal, setModal] = useState(false); - const toggleModal = () => { - setModal(!modal); - }; - - const handleKeyDown = (event) => { - if (event.key === "Enter") { - setModal(!modal); - } - }; - - if (modal) { - document.body.classList.add("active-modal"); - } else { - document.body.classList.remove("active-modal"); - } - - useImperativeHandle(ref, () => ({ - toggleModal, - })); - - return ( -
- {modal && ( -
-
-
-

Connecte toi pour accéder à cette page !

- -
-
- )} -
- ); -}); - -export default Modal;