Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6830 stevensc 1 
/* eslint-disable react/prop-types */
2 
import React, { useState } from 'react'
3 
import parse from 'html-react-parser'
4 
import { Modal } from 'react-bootstrap'
5 
import EastIcon from '@mui/icons-material/East'
6 
 
7 
const AboutCompany = (companyInfo) => {
8 
  const [showModal, setShowModal] = useState(false)
9 
 
10 
  const openModal = (e) => {
11 
    e.preventDefault()
12 
    setShowModal(true)
13 
  }
14 
 
15 
  return (
16 
    <>
17 
      <div className="suggest__widget">
18 
        <div className="linked__widget-header">
19 
          <h3>Acerca de esta empresa</h3>
20 
        </div>
21 
        {companyInfo.overview ? (
22 
          parse(companyInfo.overview)
23 
        ) : (
24 
          <p>Sin descripción</p>
25 
        )}
26 
        <a className="load__suggest" onClick={(e) => openModal(e)}>
27 
          <span>Ver más</span>
28 
          <EastIcon />
29 
        </a>
30 
      </div>
31 
      <AboutCompany.Modal
32 
        show={showModal}
33 
        closeModal={() => setShowModal(false)}
34 
        companyInfo={companyInfo}
35 
      />
36 
    </>
37 
  )
38 
}
39 
 
40 
const AboutModal = ({ show, closeModal, companyInfo }) => {
41 
  const {
42 
    companyName,
43 
    companySize,
44 
    facebook,
45 
    foundationYear,
46 
    industry,
47 
    instagram,
48 
    locations,
49 
    overview,
50 
    twitter,
51 
    website,
52 
  } = companyInfo
53 
  return (
54 
    <Modal show={show} onHide={closeModal}>
55 
      <Modal.Header closeButton>
56 
        <h2>Acerca de esta empresa</h2>
57 
      </Modal.Header>
58 
      <Modal.Body>
59 
        <div className="description__label">
60 
          <label htmlFor="name">Nombre</label>
61 
          <p>{companyName}</p>
62 
        </div>
63 
        <div className="description__label">
64 
          <label htmlFor="name">Descripción</label>
65 
          {overview && parse(overview)}
66 
        </div>
67 
        <div className="description__label">
68 
          <label htmlFor="name">Industria</label>
69 
          <p>{industry}</p>
70 
        </div>
71 
        <div className="description__label">
72 
          <label htmlFor="name">Año de fundación</label>
73 
          <p>{foundationYear}</p>
74 
        </div>
75 
        <div className="description__label">
76 
          <label htmlFor="name">Tamaño de la compañia</label>
77 
          <p>{companySize}</p>
78 
        </div>
79 
        <div className="description__label">
80 
          <label htmlFor="name">Facebook</label>
81 
          <a href={facebook} target="_blank" rel="noreferrer">
82 
            <p>{facebook}</p>
83 
          </a>
84 
        </div>
85 
        <div className="description__label">
86 
          <label htmlFor="name">Instagram</label>
87 
          <a href={instagram} target="_blank" rel="noreferrer">
88 
            <p>{instagram}</p>
89 
          </a>
90 
        </div>
91 
        <div className="description__label">
92 
          <label htmlFor="name">Twitter</label>
93 
          <a href={twitter} target="_blank" rel="noreferrer">
94 
            <p>{twitter}</p>
95 
          </a>
96 
        </div>
97 
        <div className="description__label">
98 
          <label htmlFor="name">Sitio web</label>
99 
          <a href={website} target="_blank" rel="noreferrer">
100 
            <p>{website}</p>
101 
          </a>
102 
        </div>
103 
      </Modal.Body>
104 
    </Modal>
105 
  )
106 
}
107 
 
108 
AboutCompany.Modal = AboutModal
109 
 
110 
export default AboutCompany