Rev 3921 | Rev 4098 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useEffect, useState } from 'react';
import { addNotification } from '../../../redux/notification/notification.actions';
import { axios } from '../../../utils';
export default function HomeNews({
containerClassName = ''
}) {
const [news, setNews] = useState([])
const loadNews = () => {
axios.get('/helpers/posts')
.then(({data : response}) => {
if (!response.success) {
addNotification({
style: "danger",
msg: response.data,
});
}
setNews(response.data)
})
.catch(() => {
addNotification({
style: "danger",
msg: "Disculpe, ha ocurrido un error buscando novedades",
});
})
}
useEffect(() => {
loadNews()
}, [])
return (
<div className={`${containerClassName} peopleYouMayKnow`}>
<div className="sd-title">
<h3>Novedades</h3>
</div>
<div className="suggestions-list">
{
news.map(element => {
return (
<div key={element.title} className='postsList'>
<img
src={element.image}
alt={`${element.title} image`}
/>
<div className="d-flex flex-column" style={{ gap: '.5rem' }}>
<h4>
{element.title}
</h4>
<span>
{element.date}
</span>
</div>
<a
className="btn btn-primary"
href={element.link}
target="_blank"
rel="noreferrer"
>
MÁS INF
</a>
</div>
)
})
}
</div>
</div >
)
}