Proyectos de Subversion LeadersLinked - Backend

import React, { useState } from 'react'
import Datetime from 'react-datetime'
import { useForm } from 'react-hook-form'
import { useDispatch } from 'react-redux'
import { addNotification } from '../../../redux/notification/notification.actions'
import SearchLocationInput from '../../../shared/SearchLocationInput'
import SubmitModal from './SubmitModal'

const jobTypeOptions = [
        { label: 'Tiempo completo', value: 'f' },
        { label: 'Tiempo parcial', value: 'p' },
        { label: 'Contratado', value: 'c' },
        { label: 'Temporal', value: 't' },
]

const AddModal = ({ closeModal, dataLink, googleApiKey, jobCategoryOptions, onComplete }) => {

        const dispatch = useDispatch()
        const { register, watch } = useForm()
        const [year, setYear] = useState(Date.now())
        const [value, setValue] = useState('')
        const [data, setData] = useState({})

        return (
                <SubmitModal
                        closeModal={closeModal}
                        postLink={dataLink}
                        onComplete={onComplete}
                        submitData={{
                                ...data,
                                title: watch('title'),
                                employment_type: watch('employment_type'),
                                last_date_of_application: year,
                                job_category_id: watch('job_category-id'),
                                add_location_search: value
                        }}
                        title="Nuevo empleo"
                >
                        <div className="form-group">
                                <label>Título</label>
                                <input className='form-control' type='text' name='title' ref={register({ required: true })} />
                        </div>
                        <div className="form-group">
                                <label>Tipo de empleo</label>
                                <select
                                        className='form-control'
                                        name="employment_type"
                                        ref={register({ required: true })}
                                >
                                        {
                                                jobTypeOptions.map(({ value, label }) => (
                                                        <option key={value} value={value}>{label}</option>
                                                ))
                                        }
                                </select>
                        </div>
                        <div className="form-group">
                                <label>Último día de aplicación</label>
                                <Datetime
                                        dateFormat="DD-MM-YYYY"
                                        timeFormat={false}
                                        onChange={(e) => {
                                                if (Date.now() > new Date(e.toDate()).getTime()) {
                                                        setYear(new Date(new Intl.DateTimeFormat('en-EN', year).format()))
                                                        return dispatch(addNotification({
                                                                style: 'danger',
                                                                msg: 'La fecha no puede ser igual o anterior a la actual'
                                                        }))
                                                }
                                                setYear(new Intl.DateTimeFormat({ year: 'numeric', month: 'numeric', day: 'numeric' }).format(e.toDate()))
                                        }}
                                        initialValue={new Date(new Intl.DateTimeFormat('en-EN', year).format())}
                                        inputProps={{ className: 'form-control' }}
                                        closeOnSelect
                                />
                        </div>
                        <div className="form-group">
                                <label>Categoría de Empleo</label>
                                <select
                                        className='form-control'
                                        name="job_category-id"
                                        ref={register({ required: true })}
                                >
                                        {
                                                Object.entries(jobCategoryOptions).map(([value, name]) => (
                                                        <option key={value} value={value}>{name}</option>
                                                ))
                                        }
                                </select>
                        </div>
                        <div className="form-group">
                                <label>Ubicación</label>
                                <SearchLocationInput
                                        value={value}
                                        setValue={setValue}
                                        googleApiKey={googleApiKey}
                                        updateData={setData}
                                />
                        </div>
                </SubmitModal >
        )
}

export default AddModal