Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3085 | Rev 3087 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3082 stevensc 1
import React, { useState } from 'react'
5 stevensc 2
import { useParams } from 'react-router-dom'
3
import { useDispatch } from 'react-redux'
3086 stevensc 4
import { Button, Grid, Tab, Tabs } from '@mui/material'
5 stevensc 5
 
3083 stevensc 6
import { axios, parse } from '@utils'
3082 stevensc 7
import { useFetch } from '@hooks'
8
import { addNotification } from '@store/notification/notification.actions'
3083 stevensc 9
 
10
import Spinner from '@components/UI/Spinner'
11
import JobCard from '@components/job/job-card'
12
import JobAttr from '@components/job/job-attr'
13
import ApplyModal from '@components/job/ApplyModal'
3086 stevensc 14
import CompanyInfo from '@components/job/company-info'
5 stevensc 15
 
16
const JobViewPage = () => {
17
  const [showApplyModal, setShowApplyModal] = useState(false)
18
  const [loading, setLoading] = useState(false)
19
  const { uuid } = useParams()
20
  const dispatch = useDispatch()
21
 
3083 stevensc 22
  const { data: job, isLoading, mutate } = useFetch(`/job/view/${uuid}`)
3082 stevensc 23
  const isJobApplied = job?.job_apply_operation === 'remove-apply'
24
 
3083 stevensc 25
  const toggleApplyModal = () => setShowApplyModal(!showApplyModal)
5 stevensc 26
 
3085 stevensc 27
  const toggleApplication = () => {
28
    mutate({
29
      ...job,
30
      job_apply_operation: isJobApplied ? 'apply' : 'remove-apply'
31
    })
5 stevensc 32
  }
33
 
34
  const removeApply = async () => {
35
    setLoading(true)
3082 stevensc 36
    try {
37
      const response = await axios.post(`/job/remove-apply-job/${job}`)
38
      const { data, success } = response.data
39
      if (!success) throw new Error('Error al eliminar la aplicación')
40
      dispatch(addNotification({ styled: 'success', msg: data }))
3085 stevensc 41
      toggleApplication()
3082 stevensc 42
    } catch (error) {
43
      dispatch(addNotification({ styled: 'danger', msg: error.message }))
44
    } finally {
45
      setLoading(false)
46
    }
47
  }
5 stevensc 48
 
3085 stevensc 49
  const apply = async (jobApply) => {
50
    setLoading(true)
51
 
52
    try {
53
      const url = `/job/apply-job/${job.job_uuid}`
54
      const formData = new FormData()
55
      Object.entries(jobApply).map(([key, value]) =>
56
        formData.append(key, value)
57
      )
58
 
59
      const response = await axios.post(url, formData)
60
      const { data, success } = response.data
61
 
62
      if (!success) throw new Error('Error al aplicar al trabajo')
63
 
64
      dispatch(addNotification({ style: 'success', msg: data }))
65
      toggleApplication()
66
    } catch (error) {
67
      dispatch(addNotification({ styled: 'danger', msg: error.message }))
68
    } finally {
69
      setLoading(false)
70
    }
71
  }
72
 
3082 stevensc 73
  if (isLoading) {
74
    return <Spinner />
5 stevensc 75
  }
76
 
77
  return (
78
    <>
3086 stevensc 79
      <Grid container spacing={1}>
80
        <Grid item xs md={8} direction='column' gap={1}>
81
          <Tabs>
82
            <Tab label='Avance' value='user' disableRipple />
83
            <Tab label='Información' value='group' disableRipple />
84
          </Tabs>
5 stevensc 85
 
3083 stevensc 86
          <JobCard job={job} />
87
 
3082 stevensc 88
          <JobAttr title='Visión general' info={parse(job?.job_description)} />
2806 stevensc 89
          <JobAttr
90
            title='Último día de aplicación'
91
            info={job?.last_date_of_application}
92
          />
93
          <JobAttr title='Tipo de empleo' info={job?.employment_type} />
94
          <JobAttr title='Ubicación' info={job?.location} />
95
          <JobAttr title='Experiencia' info={job?.experience} />
96
          <JobAttr title='Salario' info={job?.salary} />
97
          <JobAttr title='Categoría' info={job?.job_category} />
98
          <JobAttr title='Habilidades' info={job?.job_skills} />
99
          <JobAttr title='Idiomas' info={job?.job_languages} />
100
          <JobAttr title='Grados' info={job?.job_degrees} />
3082 stevensc 101
        </Grid>
2806 stevensc 102
 
3086 stevensc 103
        <Grid item xs md={4} direction='column' gap={1}>
104
          <Button
105
            variant={isJobApplied ? 'secondary' : 'primary'}
3083 stevensc 106
            onClick={isJobApplied ? removeApply : toggleApplyModal}
2806 stevensc 107
            disabled={loading}
108
          >
3086 stevensc 109
            {isJobApplied ? 'Quitar aplicación' : 'Aplicar'}
110
          </Button>
3085 stevensc 111
 
3086 stevensc 112
          <CompanyInfo company={job} />
3082 stevensc 113
        </Grid>
2806 stevensc 114
      </Grid>
115
 
5 stevensc 116
      <ApplyModal
117
        show={showApplyModal}
3085 stevensc 118
        profiles={job?.user_profiles}
119
        onConfirm={apply}
120
        onClose={toggleApplyModal}
5 stevensc 121
      />
122
    </>
123
  )
124
}
125
 
126
export default JobViewPage