1 | import {useDispatch, useSelector} from "react-redux";
|
---|
2 | import {useEffect, useState} from "react";
|
---|
3 | import {ApplicationActions} from "../../redux/actions/applicationActions";
|
---|
4 | import {ViewApplicationDetails} from "./ViewApplicationDetails";
|
---|
5 | import Select from "react-select";
|
---|
6 |
|
---|
7 | export const ApplicationsByJobSeeker = () => {
|
---|
8 | const dispatch = useDispatch();
|
---|
9 | const [applicationsByJobSeeker, setApplicationsByJobSeeker] = useState([]);
|
---|
10 | let applicationsByJobSeekerState = useSelector(state => state.appl.applicationsByJobSeeker);
|
---|
11 | const [dispatched, setDispatched] = useState(false);
|
---|
12 |
|
---|
13 | useEffect(() => {
|
---|
14 | if(!dispatched && applicationsByJobSeekerState.length === 0) {
|
---|
15 | dispatch(ApplicationActions.fetchApplicationsByJobSeeker((success, response) => {
|
---|
16 | if(success && response.data.length > 0) {
|
---|
17 | setApplicationsByJobSeeker(response.data);
|
---|
18 | }
|
---|
19 | console.log("Fetch applications by job seeker GET")
|
---|
20 | }))
|
---|
21 | setDispatched(true)
|
---|
22 | } else {
|
---|
23 | setApplicationsByJobSeeker(applicationsByJobSeekerState);
|
---|
24 | console.log("Fetch applications by job seeker STATE")
|
---|
25 | }
|
---|
26 | }, [applicationsByJobSeekerState])
|
---|
27 |
|
---|
28 | const options = [
|
---|
29 | {value: 'PROPOSED', label: <span><i className="fa-solid fa-paper-plane"></i> Proposed</span>},
|
---|
30 | {value: 'UNDER_REVIEW', label: <span><i className="fa-solid fa-file-pen"></i> Under Review</span>},
|
---|
31 | {value: 'ACCEPTED', label: <span><i className="fa-solid fa-user-check"></i> Accepted</span>},
|
---|
32 | {value: 'DENIED', label: <span><i className="fa-solid fa-user-slash"></i> Denied</span>}
|
---|
33 | ];
|
---|
34 |
|
---|
35 | let handleDefaultValue = (status) => {
|
---|
36 | return options.find(option => option.value === status);
|
---|
37 | }
|
---|
38 |
|
---|
39 |
|
---|
40 |
|
---|
41 | return (
|
---|
42 | <div className="applications-container">
|
---|
43 | <div className="application-title">
|
---|
44 |
|
---|
45 | </div>
|
---|
46 | {applicationsByJobSeeker && applicationsByJobSeeker.map((application, index) => (
|
---|
47 | <div key={index} className="application-card">
|
---|
48 | <div className="left-box">
|
---|
49 | <span className="jobAd-title">{application.jobAdTitle}</span>
|
---|
50 | <br/>
|
---|
51 | <br/>
|
---|
52 | <div className="contact-info">
|
---|
53 | <div className="contact-item">
|
---|
54 | <i className="fa-solid fa-building"></i> <span>{application.recruiterName}</span>
|
---|
55 | </div>
|
---|
56 | <div className="contact-item">
|
---|
57 | <i className="fa-solid fa-envelope"></i> <span>{application.recruiterEmail}</span>
|
---|
58 | </div>
|
---|
59 | <div className="contact-item">
|
---|
60 | <i className="fa-solid fa-phone"></i> <span>{application.recruiterPhoneNumber}</span>
|
---|
61 | </div>
|
---|
62 | <span> • Submitted on <b>{new Date(application.submittedOn).toLocaleString('default', {
|
---|
63 | day: 'numeric',
|
---|
64 | month: 'long',
|
---|
65 | year: 'numeric'
|
---|
66 | })}</b></span>
|
---|
67 | </div>
|
---|
68 | </div>
|
---|
69 |
|
---|
70 | <div className="right-box">
|
---|
71 | <ViewApplicationDetails application={application}/>
|
---|
72 | <div className="select">
|
---|
73 | <Select isDisabled={true} options={options} defaultValue={handleDefaultValue(application.status)}/>
|
---|
74 | </div>
|
---|
75 |
|
---|
76 | </div>
|
---|
77 | </div>
|
---|
78 | ))}
|
---|
79 |
|
---|
80 | </div>
|
---|
81 | )
|
---|
82 | } |
---|