Proyectos de Subversion LeadersLinked - SPA

import React from 'react'

import { Link } from 'react-router-dom'

import { Avatar, Box } from '@mui/material'

import { Visibility, Group, Share } from '@mui/icons-material'

import parse from 'html-react-parser'

import TagsList from '../UI/TagsList'

import StyledContainer from '../widgets/WidgetLayout'

const SearchItem = ({

  name,

  industry,

  description,

  skills,

  common_connection,

  views,

  image,

  company_name,

  title,

  url,

  followers,

  company_size,

  view_common_connection

}) => {

  return (

    <StyledContainer>

      <StyledContainer.Body>

        <Box display='flex' justifyContent='space-between'>

          <Box display='inline-flex' alignItems='center' gap={2}>

            <Avatar src={image} sx={{ width: 60, height: 60 }} />

            <Box display='flex' flexDirection='column'>

              <Link to={url}>

                <h2>{title || name}</h2>

              </Link>

              {company_name && <h4>{company_name}</h4>}

              {company_size && <p>Empresa {company_size}</p>}

              {industry && <p>{industry}</p>}

            </Box>

          </Box>

          <Box display='inline-flex' alignItems='center' gap={2}>

            {!company_name && view_common_connection && (

              <span>

                <Share />

                {common_connection} comunes

              </span>

            )}

            {followers ? (

              <span>

                <Group />

                {followers}

              </span>

            ) : null}

            {views ? (

              <span>

                <Visibility />

                {views}

              </span>

            ) : null}

          </Box>

        </Box>

        {description && parse(description)}

        <TagsList tags={Object.values(skills)} />

      </StyledContainer.Body>

    </StyledContainer>

  )

}

export default SearchItem