Rev 7110 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
import React from 'react'
import { Avatar } from '@mui/material'
import { useSelector } from 'react-redux'
import parse from 'html-react-parser'
const UserInfo = ({
cover = '',
image = '',
fullname = '',
description = '',
visits = 0,
connections = 0,
}) => {
const labels = useSelector(({ intl }) => intl.labels)
return (
<div className="sidebar__top">
{cover && (
<img
src="./static/profile_2.jpg"
alt="Profile cover"
className="sidebar__cover"
/>
)}
<Avatar
src={image}
alt={`${fullname} profile image`}
sx={{ width: '60px', height: '60px' }}
/>
<h2>{parse(fullname)}</h2>
{parse(description)}
<StatItem
title={labels.who_has_seen_my_profile}
number={visits}
url="/profile/people-viewed-profile"
/>
<StatItem
title={labels.connections}
number={connections}
url="/connection/my-connections"
/>
</div>
)
}
const StatItem = ({ title = '', number = 0, url = '' }) => {
return (
<a
href={url}
className="sidebar__stat"
target="secondary"
onClick={(e) => !url && e.preventDefault()}
>
<span>{title}</span>
<span className="sidebar__stat-number">{number}</span>
</a>
)
}
export default UserInfo