Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4824 | Rev 5376 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3503 stevensc 1
/* eslint-disable react/prop-types */
5104 stevensc 2
import React, { useEffect, useState } from 'react'
3
import { addNotification } from '../../../redux/notification/notification.actions'
4
import EmptySection from '../../../shared/empty-section/EmptySection'
5
import { axios } from '../../../utils'
1386 steven 6
 
5104 stevensc 7
export default function HomeNews ({
8
  classname = 'peopleYouMayKnow',
9
  currentPost = null
3503 stevensc 10
}) {
5104 stevensc 11
  const [news, setNews] = useState([])
12
  const loadNews = () => {
13
    axios.get('/helpers/posts')
14
      .then(({ data: response }) => {
15
        if (!response.success) {
16
          addNotification({
17
            style: 'danger',
18
            msg: response.data
19
          })
20
        }
21
        setNews(response.data)
22
      })
23
      .catch(() => {
24
        addNotification({
25
          style: 'danger',
26
          msg: 'Disculpe, ha ocurrido un error buscando novedades'
27
        })
28
      })
29
  }
4098 stevensc 30
 
5104 stevensc 31
  useEffect(() => {
32
    loadNews()
33
  }, [])
4088 stevensc 34
 
5104 stevensc 35
  return (
4440 stevensc 36
        <div className={classname}>
3921 stevensc 37
            <div className="sd-title">
5104 stevensc 38
                <h3>{LABELS.POSTS}</h3>
3921 stevensc 39
            </div>
40
            <div className="suggestions-list">
4824 stevensc 41
                {!news.length
5104 stevensc 42
                  ? <EmptySection message={LABELS.NOT_AVAILABLE_POSTS} />
43
                  : news.map(element => {
44
                    if (element.link.includes(currentPost)) {
45
                      return null
46
                    }
4098 stevensc 47
 
5104 stevensc 48
                    return (
3921 stevensc 49
                            <div key={element.title} className='postsList'>
4823 stevensc 50
                                <img src={element.image} alt={`${element.title} image`} />
4088 stevensc 51
                                <div className="d-flex flex-column" style={{ gap: '.5rem' }}>
4763 stevensc 52
                                    <a href={element.link} target='secondary'>
4823 stevensc 53
                                        <h4>{element.title}</h4>
4442 stevensc 54
                                    </a>
4823 stevensc 55
                                    <span>{element.date}</span>
1386 steven 56
                                </div>
3921 stevensc 57
                                <a
4088 stevensc 58
                                    className="btn btn-primary"
3921 stevensc 59
                                    href={element.link}
4763 stevensc 60
                                    target="secondary"
3921 stevensc 61
                                >
5104 stevensc 62
                                    {LABELS.VIEW_MORE}
3921 stevensc 63
                                </a>
64
                            </div>
5104 stevensc 65
                    )
66
                  })}
1386 steven 67
            </div>
5104 stevensc 68
        </div>
69
  )
1386 steven 70
}