Autoría | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useState } from 'react'
import parse from 'html-react-parser'
import { Modal } from 'react-bootstrap'
import EastIcon from '@mui/icons-material/East'
const AboutCompany = (companyInfo) => {
const [showModal, setShowModal] = useState(false)
const openModal = (e) => {
e.preventDefault()
setShowModal(true)
}
return (
<>
<div className="suggest__widget">
<div className="linked__widget-header">
<h3>Acerca de esta empresa</h3>
</div>
{companyInfo.overview ? (
parse(companyInfo.overview)
) : (
<p>Sin descripción</p>
)}
<a className="load__suggest" onClick={(e) => openModal(e)}>
<span>Ver más</span>
<EastIcon />
</a>
</div>
<AboutCompany.Modal
show={showModal}
closeModal={() => setShowModal(false)}
companyInfo={companyInfo}
/>
</>
)
}
const AboutModal = ({ show, closeModal, companyInfo }) => {
const {
companyName,
companySize,
facebook,
foundationYear,
industry,
instagram,
locations,
overview,
twitter,
website,
} = companyInfo
return (
<Modal show={show} onHide={closeModal}>
<Modal.Header closeButton>
<h2>Acerca de esta empresa</h2>
</Modal.Header>
<Modal.Body>
<div className="description__label">
<label htmlFor="name">Nombre</label>
<p>{companyName}</p>
</div>
<div className="description__label">
<label htmlFor="name">Descripción</label>
{overview && parse(overview)}
</div>
<div className="description__label">
<label htmlFor="name">Industria</label>
<p>{industry}</p>
</div>
<div className="description__label">
<label htmlFor="name">Año de fundación</label>
<p>{foundationYear}</p>
</div>
<div className="description__label">
<label htmlFor="name">Tamaño de la compañia</label>
<p>{companySize}</p>
</div>
<div className="description__label">
<label htmlFor="name">Facebook</label>
<a href={facebook} target="_blank" rel="noreferrer">
<p>{facebook}</p>
</a>
</div>
<div className="description__label">
<label htmlFor="name">Instagram</label>
<a href={instagram} target="_blank" rel="noreferrer">
<p>{instagram}</p>
</a>
</div>
<div className="description__label">
<label htmlFor="name">Twitter</label>
<a href={twitter} target="_blank" rel="noreferrer">
<p>{twitter}</p>
</a>
</div>
<div className="description__label">
<label htmlFor="name">Sitio web</label>
<a href={website} target="_blank" rel="noreferrer">
<p>{website}</p>
</a>
</div>
</Modal.Body>
</Modal>
)
}
AboutCompany.Modal = AboutModal
export default AboutCompany