Proyectos de Subversion LeadersLinked - SPA

import React, { useEffect, useState } from "react";
import { axios } from "../../../utils";
import { useSelector } from "react-redux";

import { addNotification } from "../../../redux/notification/notification.actions";

import EmptySection from "../../UI/EmptySection";
import { Link } from "react-router-dom";

export default function HomeNews({ currentPost }) {
  const labels = useSelector(({ intl }) => intl.labels);
  const [news, setNews] = useState([]);

  const loadNews = () => {
    axios
      .get("/helpers/posts")
      .then((response) => {
        const { data, success } = response.data;

        if (!success) {
          addNotification({ style: "danger", msg: data });
          return;
        }

        setNews(data);
      })
      .catch(() => {
        addNotification({
          style: "danger",
          msg: "Disculpe, ha ocurrido un error buscando novedades",
        });
      });
  };

  useEffect(() => {
    loadNews();
  }, []);

  return (
    <div className="posts-widget">
      <h3>{labels.posts}</h3>
      <div className="posts-list">
        {!news.length ? (
          <EmptySection message={labels.not_available_posts} />
        ) : (
          news.map((element) => {
            if (element.link.includes(currentPost)) {
              return null;
            }

            return (
              <div key={element.title} className="post-item">
                <Link to={element.link}>
                  <img src={element.image} alt={`${element.title} image`} />
                </Link>
                <div className="post-info">
                  <Link to={element.link}>
                    <h4 title={element.title}>{element.title}</h4>
                  </Link>
                  <span>{element.date}</span>
                </div>
              </div>
            );
          })
        )}
      </div>
    </div>
  );
}