Proyectos de Subversion LeadersLinked - Antes de SPA

/* 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(res => {
                if (res.data.success) {
                    setNews(res.data.data)
                }
            })
            .catch(() => {
                addNotification({
                    style: "error",
                    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 ml-3" style={{ gap: '5px' }}>
                                    <h4>
                                        {element.title}
                                    </h4>
                                    <span>
                                        {element.date}
                                    </span>
                                </div>
                                <a
                                    className="btn btn-primary ml-3"
                                    href={element.link}
                                    target="_blank"
                                    rel="noreferrer"
                                    style={{ fontSize: '.9rem', borderRadius: '4px' }}
                                >
                                    MÁS INF
                                </a>
                            </div>
                        )
                    })
                }
            </div>
        </div >
    )
}