Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { useForm } from 'react-hook-form'

import { axios } from '@app/utils'
import { useFetchHelper } from '@hooks'
import { addNotification } from '@app/redux/notification/notification.actions'

import Modal from '@components/UI/modal/Modal'
import Input from '@components/UI/inputs/Input'
import Select from '@components/UI/inputs/Select'

const AddCompanyModal = ({
  show = false,
  onHide = () => null,
  fetchCompanies = () => []
}) => {
  const { data: companySizes } = useFetchHelper('company-sizes')
  const { data: industries } = useFetchHelper('industries')
  const labels = useSelector(({ intl }) => intl.labels)
  const dispatch = useDispatch()

  const {
    control,
    handleSubmit,
    formState: { errors }
  } = useForm()

  const onSubmit = handleSubmit((data) => {
    const formData = new FormData()
    Object.entries(data).map(([key, value]) => formData.append(key, value))

    axios
      .post('/company/my-companies/add', formData)
      .then(({ data: response }) => {
        if (!response.success) {
          const errorMessage =
            typeof response.data === 'string'
              ? response.data
              : Object.entries(response.data).map(
                  ([key, value]) => `${key}: ${value[0]}`
                )

          dispatch(addNotification({ style: 'danger', msg: errorMessage }))
          return
        }

        fetchCompanies()
        onHide()
      })
      .catch((err) => {
        dispatch(addNotification({ style: 'danger', msg: err.message }))
      })
  })

  return (
    <Modal
      title={labels.new_company}
      show={show}
      onClose={onHide}
      onAccept={onSubmit}
    >
      <Input
        name='name'
        placeholder={labels.name_of_company}
        error={errors.name?.message}
        control={control}
        rules={{ required: 'Por favor ingrese el nombre de la Empresa' }}
      />

      <Select
        name='industry_id'
        options={industries}
        control={control}
        rules={{ required: labels.select_industry }}
        error={errors.industry_id?.message}
      />

      <Select
        name='company_size_id'
        options={companySizes}
        control={control}
        rules={{ required: labels.select_company_size }}
        error={errors.company_size_id?.message}
      />
    </Modal>
  )
}

export default AddCompanyModal