Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4189 stevensc 1 
import React, { useEffect, useState } from 'react'
4191 stevensc 2 
import axios from '../../utils/axios'
3 
import parse from 'html-react-parser'
4189 stevensc 4 
import { useDispatch } from 'react-redux'
5 
import { addNotification } from '../../redux/notification/notification.actions'
4188 stevensc 6 
 
7 
const EventsList = () => {
8 
 
4189 stevensc 9 
    const [events, setEvents] = useState([])
10 
    const dispatch = useDispatch()
11 
 
4188 stevensc 12 
    const getEvents = async () => {
13 
        try {
14 
            const { data: response } = await axios.get('/helpers/next-events')
15 
 
4189 stevensc 16 
            if (!response.success) {
17 
                dispatch(addNotification({ style: 'danger', message: response.data }))
18 
                return
19 
            }
4188 stevensc 20 
 
4189 stevensc 21 
            setEvents(response.data)
4188 stevensc 22 
        } catch (error) {
4189 stevensc 23 
            dispatch(addNotification({ style: 'danger', message: 'Ha ocurrido un error' }))
24 
            console.log(`Error: ${error.message}`)
4188 stevensc 25 
        }
26 
    }
4189 stevensc 27 
 
4188 stevensc 28 
    useEffect(() => {
29 
        getEvents()
30 
    }, [])
31 
 
32 
    return (
4190 stevensc 33 
        <div className='peopleYouMayKnow'>
4189 stevensc 34 
            <div className="sd-title d-flex align-items-center justify-content-between">
35 
                <h3>Proximos eventos</h3>
36 
            </div>
4191 stevensc 37 
            <div className="w-100 d-flex flex-column" style={{ gap: '.5rem' }}>
4189 stevensc 38 
                {events.length
39 
                    ? events.map((event) =>
4191 stevensc 40 
                        <div className='rounded' key={event.id} style={{ background: event.backgroundColor }}>
4190 stevensc 41 
                            <div className="d-flex align-items-center flex-column" style={{ gap: '.5rem' }}>
4189 stevensc 42 
                                <h4 className='break-ellipsis'>{event.title}</h4>
43 
                                <span>{new Date(event.start).toLocaleString()}</span>
44 
                                <span>{new Date(event.end).toLocaleString()}</span>
45 
                            </div>
4190 stevensc 46 
                            <div className="d-flex align-items-center flex-column" style={{ gap: '.5rem' }}>
47 
                                <a
48 
                                    className="btn btn-primary"
49 
                                    href={event.url}
50 
                                >
51 
                                    Ingresar
52 
                                </a>
4191 stevensc 53 
                                {parse(event.agenda)}
4190 stevensc 54 
                            </div>
4189 stevensc 55 
                        </div>
56 
                    )
57 
                    : <div className="view-more">No hay eventos</div>
58 
                }
59 
            </div>
60 
        </div>
4188 stevensc 61 
    )
62 
}
63 
 
64 
export default EventsList