Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7004 | Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
7002 stevensc 1 
import React from 'react'
2 
import parse from 'html-react-parser'
3 
import { styled } from 'styled-components'
4 
import { Avatar } from '@mui/material'
5 
import { Link } from 'react-router-dom'
6 
 
7 
const StyledEntity = styled.article`
8 
  display: flex;
9 
  flex-direction: column;
10 
  padding: 1rem;
11 
  width: 100%;
12 
  border-radius: var(--border-radius);
13 
  border-bottom: solid 1px var(--border-primary);
14 
  border-top: solid 1px var(--border-primary);
15 
  box-shadow: var(--light-shadow);
16 
  background-color: var(--bg-color);
17 
  gap: 0.5rem;
18 
`
19 
 
20 
const SearchItem = ({
21 
  name,
22 
  industry,
23 
  description,
24 
  skills,
25 
  common_connection,
26 
  views,
27 
  image,
28 
  company_name,
29 
  title,
30 
  url,
31 
  followers,
32 
  company_size,
33 
  view_common_connection,
34 
}) => {
35 
  return (
36 
    <StyledEntity>
37 
      <Avatar src={image} sx={{ width: '90px' }} />
38 
      <Link to={url}>
39 
        <h3>{title || name}</h3>
40 
        {company_name && <h4>{company_name}</h4>}
41 
        {company_size && <p>Empresa {company_size} </p>}
42 
        {industry && <p>{industry}</p>}
43 
      </Link>
44 
 
45 
      <div className="d-flex">
46 
        <ul>
47 
          {!company_name && common_connection && (
48 
            <li>
49 
              <p className="com text-gray">
50 
                <i className="fas fa-share-alt" />
51 
                {view_common_connection && (
52 
                  <small className="ml-2">{common_connection} comunes</small>
53 
                )}
54 
              </p>
55 
            </li>
56 
          )}
57 
          {followers && (
58 
            <li>
59 
              <p className="com text-gray">
60 
                <i className="fas fa-users"></i>
61 
                <small className="ml-2">{followers}</small>
62 
              </p>
63 
            </li>
64 
          )}
65 
          {views && (
66 
            <li>
67 
              <p className="com text-gray">
68 
                <i className="fas fa-eye"></i>
69 
                <small className="ml-2">{views}</small>
70 
              </p>
71 
            </li>
72 
          )}
73 
        </ul>
74 
      </div>
75 
 
76 
      <div className="job_descp">
77 
        {industry && <button className="btn btn-secondary">{industry}</button>}
78 
        {description && (
79 
          <div className="show-read-more">{parse(description)}</div>
80 
        )}
81 
        {skills && (
82 
          <ul className="skill-tags">
83 
            {Object.values(skills).map((skill, id) => (
84 
              <li key={id}>
85 
                <button title={skill} className="btn btn-tertiary">
86 
                  {skill}
87 
                </button>
88 
              </li>
89 
            ))}
90 
          </ul>
91 
        )}
92 
      </div>
93 
    </StyledEntity>
94 
  )
95 
}
96 
 
97 
export default SearchItem