Changeset 08f82ec for jobvista-frontend/src/views

Timestamp:

06/20/24 11:57:13 (5 months ago)

Author:

223021 <daniel.ilievski.2@…>

Branches:

main

Children:

0f0add0

Parents:

befb988

Message:

Did more refactoring

Location:

jobvista-frontend/src/views

Files:

• admin_panel/AdminPanel.css (modified) (1 diff)
• admin_panel/AdminPanel.js (modified) (1 diff)
• applications/ApplicationDetailsModal.js (modified) (3 diffs)
• applications/Applications.css (modified) (5 diffs)
• applications/ApplicationsByJobSeeker.js (modified) (2 diffs)
• applications/ApplyToJobAdModal.js (modified) (6 diffs)
• auth/SignUpRecruiterForm.js (modified) (2 diffs)
• dashboard/Dashboard.js (modified) (4 diffs)
• job_advertisements/AddJobAdModal.js (modified) (2 diffs)
• job_advertisements/DeleteJobAdModal.js (modified) (2 diffs)
• job_advertisements/EditJobAdModal.js (modified) (1 diff)
• job_advertisements/JobAdDetails.css (modified) (1 diff)
• job_advertisements/JobAdDetails.js (modified) (1 diff)
• job_advertisements/JobManagementHub.js (moved) (moved from jobvista-frontend/src/views/job_advertisements/RecruiterWorkspace.js ) (3 diffs)
• profiles/JobSeekerEditProfile.css (added)
• profiles/JobSeekerEditProfile.js (added)
• profiles/RecruiterEditProfile.css (added)
• profiles/RecruiterEditProfile.js (added)
• profiles/RecruiterProfile.js (added)
• shared_css/Modal.css (modified) (1 diff)
• shared_css/Random.css (added)
• static/AboutUs.css (added)
• static/AboutUs.js (added)
• static/Header.css (modified) (1 diff)
• static/Loading.css (added)
• static/Loading.js (added)

jobvista-frontend/src/views/admin_panel/AdminPanel.css

@@ -3 +3 @@
 }
 
+.table tbody tr:nth-child(even) {
+    background-color: #fff; /* Light gray */
+}
+
+.table tbody tr:nth-child(odd) {
+    background-color: #f2f2f2; /* White */
+}
 /* The switch - the box around the slider */
 .switch {

jobvista-frontend/src/views/admin_panel/AdminPanel.js

@@ -54 +54 @@
     return (
         <div className="custom-container mt-5">
-            <table className="table table-striped">
+            <table className="table">
                 <thead>
                 <tr>

jobvista-frontend/src/views/applications/ApplicationDetailsModal.js

@@ -32 +32 @@
 
     useEffect(() => {
-        if(application) {
-            dispatch(ApplicationActions.downloadResume(application.fileName, (success, response) => {
-                if(success) {
+        if (application) {
+            ApplicationActions.downloadResume(application.id, (success, response) => {
+                if (success) {
                     setResumeUrl(response);
                 }
-            }))
+            })
         }
-    }, [application])
+    }, [])
+
+    function getFileName(path) {
+        let fileName = path.split('\\').pop().split('/').pop();
+
+        fileName = fileName.trim();
+
+        return fileName;
+    }
 
     return (<div className="modal-wrap">
         <button onClick={toggleModal} className="application-button">View application</button>
-        <Modal open={modal} onClose={toggleModal} center >
+        <Modal open={modal} onClose={toggleModal} center>
             <div className="head-modal">
                 <h3>{application.jobSeekerName}'s application for {application.jobAdTitle}</h3>
@@ -49 +57 @@
             </div>
 
-            <div className="modal-content" >
+            <div className="modal-content">
                 <form>
                     <div className="row">
                         <div className="col-md-6">
                             <label className="label">Why are you interested in joining our company?</label>
-                            <textarea disabled type="text" defaultValue={application.questionAnswers[0]} disabled placeholder="Write your answer here..." className="application-textarea"/>
-
-
+                            <textarea disabled type="text" defaultValue={application.questionAnswers[0]} disabled
+                                      placeholder="Write your answer here..." className="application-textarea"/>
+                            <br/><br/>
                             <label className="label">What makes you a good fit for this position?</label>
-                            <textarea disabled type="text" defaultValue={application.questionAnswers[1]}  placeholder="Write your answer here..." className="application-textarea"/>
-
-
-                            <label className="label">What do you hope to achieve in your first 6 months in this role?</label>
-                            <textarea disabled type="text" defaultValue={application.questionAnswers[2]}  placeholder="Write your answer here..." className="application-textarea"/>
+                            <textarea disabled type="text" defaultValue={application.questionAnswers[1]}
+                                      placeholder="Write your answer here..." className="application-textarea"/>
+                            <br/><br/>
+                            <label className="label">What do you hope to achieve in your first 6 months in this
+                                role?</label>
+                            <textarea disabled type="text" defaultValue={application.questionAnswers[2]}
+                                      placeholder="Write your answer here..." className="application-textarea"/>
 
                         </div>
@@ -68 +78 @@
                             <label htmlFor="start">Curriculum vitae (CV)</label>
                             <br/>
-                            <a className="resume-link" href={resumeUrl} target="_blank" rel="noopener noreferrer">{application.fileName}</a>
+                            <a className="resume-link" href={resumeUrl} target="_blank"
+                               rel="noopener noreferrer">{getFileName(application.fileName)}</a>
                             <br/>
 
                             <br/>
                             <label className="label">Message to the recruiter</label>
-                            <textarea disabled type="text" defaultValue={application.message} placeholder="Optional..." className="application-textarea"/>
+                            <textarea disabled type="text" defaultValue={application.message} placeholder="Optional..."
+                                      className="application-textarea"/>
 
                         </div>

jobvista-frontend/src/views/applications/Applications.css

@@ -32 +32 @@
     padding: 20px 20px;
     display: flex;
-    justify-content: center;
-    gap: 20px;
+    /*justify-content: center;*/
+    /*gap: 20px;*/
     margin: 15px 0;
     /*z-index: -1000;*/
@@ -39 +39 @@
 .application-card .app-job-seeker-pic {
     border: 1px solid gray;
-    border-radius: 50%
+    border-radius: 50%;
+    margin-right: 20px;
 }
 .application-card .app-job-seeker-pic img {
@@ -45 +46 @@
 }
 
+.application-card .app-company-logo {
+    width: 8%;
+}
+
 .application-card .app-info {
-    width: 60%;
+    width: 65%;
     display: inline-flex;
     flex-direction: column;
@@ -56 +61 @@
 .application-card .app-info .jobAd-title {
     font-weight: 600;
+    font-size: 1.2rem;
     /*text-transform: uppercase;*/
     font-family: 'Segoe UI', sans-serif;
-    /*font-size: 22px;*/
+    text-decoration: none;
+    color: black
 }
-.application-card .app-info .jobAd-title
+
+.
 
 .application-card .app-info .contact-info {
@@ -78 +86 @@
 
 .application-card .app-status {
-    width: 40%;
+    width: 28%;
     display: inline-flex;
     justify-content: end;

jobvista-frontend/src/views/applications/ApplicationsByJobSeeker.js

@@ -7 +7 @@
 import {RecruiterActions} from "../../redux/actions/recruiterActions";
 import {sortElementsBy} from "../../utils/utils";
+import {Link} from "react-router-dom";
 
 export const ApplicationsByJobSeeker = () => {
@@ -97 +98 @@
 
                     <div className="app-info">
-                        <div className="jobAd-title">{application.jobAdTitle}</div>
+                        <Link to={`/job-advertisements/${application.jobAdId}`} className="jobAd-title">{application.jobAdTitle}</Link>
+                        {/*<h5 className="jobAd-title"></h5>*/}
                         <div className="contact-info">
                             <div className="contact-item">

jobvista-frontend/src/views/applications/ApplyToJobAdModal.js

@@ -51 +51 @@
 
             dispatch(ApplicationActions.submitApplication(
-                formData,(success, response) => {
-                    if(success) {
+                formData, (success) => {
+                    if (success) {
                         toggleModal()
                         notifyJobAdApply()
@@ -66 +66 @@
 
     return (<div className="modal-wrap">
-        {role===Roles.JOBSEEKER &&
+        {role === Roles.JOBSEEKER &&
             <>
-                {jobAd.active && <button onClick={toggleModal} className="apply-button apply">Apply now</button> }
-                {!jobAd.active && <button className="card-button apply disabled">Apply now</button> }
+                {jobAd.active && <button onClick={toggleModal} className="apply-button apply">Apply now</button>}
+                {!jobAd.active && <button className="card-button apply disabled">Apply now</button>}
             </>
         }
-        <Modal open={modal} onClose={toggleModal} center >
+        <Modal open={modal} onClose={toggleModal} center>
             <div className="head-modal">
                 <h3>Applying to {jobAd.title} at {jobAd.recruiterName}</h3>
@@ -78 +78 @@
             </div>
 
-            <div className="modal-content" >
+            <div className="modal-content">
                 <form onSubmit={handleSubmit(submitApplication)}>
                     <div className="row">
@@ -92 +92 @@
                             <p style={{color: "red"}}>{errors.answerTwo?.message}</p>
 
-                            <label className="label">What do you hope to achieve in your first 6 months in this role?</label>
-                            <textarea type="text"  placeholder="Write your answer here..."
-                                   {...register("answerThree")} className="application-textarea"/>
+                            <label className="label">What do you hope to achieve in your first 6 months in this
+                                role?</label>
+                            <textarea type="text" placeholder="Write your answer here..."
+                                      {...register("answerThree")} className="application-textarea"/>
                             <p style={{color: "red"}}>{errors.answerThree?.message}</p>
 
@@ -101 +102 @@
                             <label htmlFor="start">Curriculum vitae (CV)</label>
                             <br/>
-                            <input {...register("file")} className="resume-link" onChange={(e) => setResumeFile(e.target.files[0])} required type="file" id="fileUpload" accept=".pdf"/>
+                            <input {...register("file")} className="resume-link"
+                                   onChange={(e) => setResumeFile(e.target.files[0])} required type="file"
+                                   id="fileUpload" accept=".pdf"/>
 
                             <br/>
@@ -109 +112 @@
 
                             <br/><br/>
-                            <p style={{color: "red"}}>Please note that your personal data from your account will be used to identify and process your application.</p>
+                            <p style={{color: "red"}}>Please note that your personal data from your account will be used
+                                to identify and process your application.</p>
                         </div>
                     </div>

jobvista-frontend/src/views/auth/SignUpRecruiterForm.js

@@ -13 +13 @@
     const schema = yup.object().shape({
         companyNameReg: yup.string().required("Company name is required."),
-        phoneNumberReg: yup.number().required("Phone number is required"),
+        phoneNumberReg: yup.string().required("Phone number is required"),
         companyEmailReg: yup.string().required("Email is required.").email("Email is not valid."),
         passwordReg: yup.string().min(6, "Password must be at least 6 characters.").required("Password is required."),
@@ -32 +32 @@
                     //     theme: success ? 'success' : 'error'
                     // });
-                    success && navigate("/");
+                    success && navigate("/no-access");
                 }));
         } catch (err) {

jobvista-frontend/src/views/dashboard/Dashboard.js

@@ -34 +34 @@
 
 
-
-    // const [user, setUser] = useState(null);
-    //
-    // useEffect(() => {
-    //     const token = localStorage.getItem(AUTH_TOKEN);
-    //     if (token!=null) {
-    //         try {
-    //             const decodedToken = jwtDecode(token);
-    //             setUser({
-    //                 name: decodedToken.name,
-    //                 role: decodedToken.role,
-    //                 hasAccess: decodedToken.access,
-    //             });
-    //         } catch (error) {
-    //             console.error('Failed to decode token', error);
-    //         }
-    //     }
-    //     console.log(user)
-    // }, [auth]);
-
-    // useEffect(() => {
-    //     if (auth) {
-    //         setRole(auth.role);
-    //     }
-    //     console.log(props)
-    // }, [auth]);
-
     useEffect(() => {
         if (!jobDispatched && jobAdvertisementsState.length == 0) {
@@ -72 +45 @@
 
         } else {
-            setJobAdvertisements(jobAdvertisementsState)
+            setJobAdvertisements(sortElementsBy(jobAdvertisementsState, "postedOn"))
             console.log("Fetch all job advertisements STATE")
 
@@ -160 +133 @@
                     jobAdvertisements.map((jobAd, index) => (
                         <div key={index} className="col">
-                            <div className="custom-card">
+                            <div className="custom-card dashboard-card">
                                 <div className="card-head">
                                     <span className="hourly-salary"><b>${jobAd.startingSalary}/hr</b></span>
@@ -187 +160 @@
                                     </div>
 
-                                    <div className="aligned">
-                                        <Link to={`/job-advertisements/${jobAd.id}`} className="card-button">Read
-                                            more</Link>
-                                    </div>
-
+                                </div>
+                                <div className="card-foot">
+                                    <Link to={`/job-advertisements/${jobAd.id}`} className="card-button">Read
+                                        more</Link>
                                 </div>
                             </div>

jobvista-frontend/src/views/job_advertisements/AddJobAdModal.js

@@ -43 +43 @@
 
     const addJobAdvertisement = async (values) => {
-        //const description = values.description.replace(/\n/g, "\\n");
         try {
             dispatch(JobAdvertisementActions.addJobAdvertisement(
@@ -55 +54 @@
                     jobType: values.jobType.value,
                     employmentStatus: values.employmentStatus.value,
-                }, (success, response) => {
+                }, (success) => {
                     if (success) {
-                        // console.log("Job Advertisement added")
                         toggleModal()
                         notifyJobAdPost()

jobvista-frontend/src/views/job_advertisements/DeleteJobAdModal.js

@@ -26 +26 @@
     };
 
-    const addJobAdvertisement = async () => {
+    const deleteJobAdvertisement = async () => {
         try {
-            dispatch(JobAdvertisementActions.deleteJobAdvertisement(jobAd.props.id, (success, response) => {
+            dispatch(JobAdvertisementActions.deleteJobAdvertisement(jobAd.props.id, (success) => {
                 if (success) {
-                    // console.log("Job Advertisement deleted")
                     toggleModal()
                     notifyJobAdDelete()
@@ -54 +53 @@
                 <div className="modal-delete-buttons">
                     <button className="cancel-btn" onClick={toggleModal}>Cancel</button>
-                    <button className="delete-btn" onClick={addJobAdvertisement}> Delete</button>
+                    <button className="delete-btn" onClick={deleteJobAdvertisement}> Delete</button>
                 </div>
             </div>

jobvista-frontend/src/views/job_advertisements/EditJobAdModal.js

@@ -54 +54 @@
                     jobType: values.jobType.value,
                     employmentStatus: values.employmentStatus.value,
-                }, jobAd.props.id, (success, response) => {
+                }, jobAd.props.id, (success) => {
                     if(success) {
-                        // console.log("Job Advertisement edited")
                         toggleModal()
                         notifyJobAdEdit()

jobvista-frontend/src/views/job_advertisements/JobAdDetails.css

@@ -20 +20 @@
     /*scrollbar-width: thin; !* "auto" hides scrollbar on some browsers, "thin" shows a thin scrollbar *!*/
     /*scrollbar-color: #999999 #fff;*/
+}
+
+.min-wrap {
+    min-height: 80vh;
 }
 

jobvista-frontend/src/views/job_advertisements/JobAdDetails.js

@@ -63 +63 @@
         <div className="row">
             <div className="col-md-9">
-                <div className="details-wrap">
+                <div className="details-wrap min-wrap">
                     <div className="row">
                         <div className="col-md-9">

jobvista-frontend/src/views/job_advertisements/JobManagementHub.js

@@ -66 +66 @@
 
     let filterJobAdvertisements = () => {
-        JobAdvertisementActions.filterJobAdvertisementsByRecruiter({
+        JobAdvertisementActions.filterJobAdvertisementsByRecruiter(auth.id, {
             searchTerm: searchTerm, industry: selectedIndustry, sortOrder: selectedSortOrder
         }, (success, response) => {
@@ -127 +127 @@
                 {jobAdvertisementsByRecruiter && jobAdvertisementsByRecruiter.map((jobAd, index) => (
                     <div key={index} className="col">
-                        <div className="custom-card">
+                        <div className="custom-card hub-card">
                             <div className="card-head">
                                 <span className="hourly-salary"><b>${jobAd.startingSalary}/hr</b></span>
@@ -150 +150 @@
                                 </div>
 
-                                <div className="aligned">
-                                    <Link to={`/job-management-hub/applications/${jobAd.id}`}
-                                          className="card-button solo">View applications</Link>
-                                </div>
+                            </div>
 
+
+                            <div className="card-foot">
+                                <Link to={`/job-management-hub/applications/${jobAd.id}`}
+                                      className="card-button">View applications</Link>
                             </div>
                         </div>

jobvista-frontend/src/views/shared_css/Modal.css

@@ -89 +89 @@
 .application-textarea {
     height: 100px;
+    /*margin-bottom: 20px;*/
 }
 

jobvista-frontend/src/views/static/Header.css

@@ -19 +19 @@
 
 .navbar {
-    width: calc(100% - 17px);
+    width: 100%;
     height: 80px;
     background-color: #f8f9fa;