Rev 3899 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useState, useEffect } from 'react'
import { Modal } from 'react-bootstrap'
import { axios } from '../../../utils'
const FollowersModal = ({
isShow = false,
companyId = '',
handleClose = function () { }
}) => {
const [followers, setFollowers] = useState([])
useEffect(() => {
const getFollowers = () => {
axios.get(`/helpers/company-follower/${companyId}`)
.then(({ data: response }) => {
const { success, data } = response
if (success) setFollowers(data)
})
}
getFollowers()
}, [])
return (
<Modal show={isShow} onHide={handleClose}>
<Modal.Header closeButton>
<h3>Seguidores</h3>
</Modal.Header>
<Modal.Body>
{followers.map((follower) =>
<FollowersModal.Item
key={follower.id}
follower={follower}
/>
)}
</Modal.Body>
</Modal>
)
}
const Item = ({ follower }) => {
const { name, image, profile } = follower
return (
<div className='user'>
<div className="w-100 d-flex align-items-center" style={{ gap: '.5rem' }}>
<a href={profile} target="_blank" rel="noreferrer">
<img src={image} alt={`${name} profile image`} />
</a>
<h4>{name}</h4>
</div>
<a
href={profile}
className="btn btn-primary"
target='_blank'
rel="noreferrer"
>
Ver perfil
</a>
</div>
)
}
FollowersModal.Item = Item
export default FollowersModal