Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 2939 | Rev 3921 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React, { useEffect, useState } from 'react';
import { addNotification } from '../../../redux/notification/notification.actions';
import { axios } from '../../../utils';
import styles from './HomeSection.module.scss';

export default function HomeNews({ containerClassName = '', suggestionsContainerClassName = '' }) {
    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} style={{ paddingBottom: '5%' }}>
            <div className={styles.suggestions}>
                <div className="sd-title">
                    <h3>Novedades</h3>
                </div>
                <div className="suggestions-list">
                    {
                        news.map(element => {
                            return (
                                <div key={element.title} className={styles.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>
        </div >
    )
}