Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
3198 stevensc 1
/* eslint-disable react/prop-types */
1309 steven 2
import React from 'react';
3
import { useState } from 'react';
4
import { useLayoutEffect } from 'react';
3197 stevensc 5
import { useDispatch } from 'react-redux';
2468 stevensc 6
import ProfileInfo from '../dashboard/components/home-section/ProfileInfo';
7
import SocialNetworks from '../dashboard/components/home-section/SocialNetworks';
3197 stevensc 8
import { addNotification } from '../redux/notification/notification.actions';
1309 steven 9
import { axios } from '../utils';
1307 steven 10
 
2470 stevensc 11
const Notifications = ({ backendVars }) => {
2468 stevensc 12
 
2470 stevensc 13
  const { image, fullName, country, visits, connections, description } = backendVars
1309 steven 14
  const [notifications, setNotifications] = useState([]);
3197 stevensc 15
  const dispatch = useDispatch()
2468 stevensc 16
 
1309 steven 17
  const handleNotifications = async () => {
1310 steven 18
    try {
19
      const _notifications = await axios.get('/notifications');
20
      setNotifications(_notifications.data.data)
2468 stevensc 21
      console.log('>>: _notifications ', notifications)
1310 steven 22
    } catch (error) {
23
      console.log('>>: error > ', error)
24
    }
1309 steven 25
  }
2468 stevensc 26
 
3197 stevensc 27
  const markReadNotifications = () => {
3274 stevensc 28
    axios.post('/notifications/mark-all-read')
3197 stevensc 29
      .then(({ data }) => data.success)
30
      .catch(err => {
31
        dispatch(addNotification({
32
          style: "error",
33
          msg: 'Disculpe, ha ocurrido un error marcando notificaciones como leidas',
34
        }))
35
        console.log('>>: err > ', err)
36
      })
37
  }
38
 
1309 steven 39
  useLayoutEffect(() => {
40
    handleNotifications();
3198 stevensc 41
    markReadNotifications()
1309 steven 42
  }, []);
2468 stevensc 43
 
1307 steven 44
  return (
1309 steven 45
    <section className="notifications-page">
2468 stevensc 46
      <div className="card notifications-grid">
2478 stevensc 47
        <div className='main-left-sidebar' style={{ marginTop: '1.25rem' }}>
2468 stevensc 48
          <ProfileInfo
49
            image={image}
50
            fullName={fullName}
51
            description={description}
52
            visits={visits}
53
            country={country}
54
            connections={connections}
55
          />
56
          <SocialNetworks />
57
        </div>
1311 steven 58
        <div className="card-body">
59
          <div className="container">
2471 stevensc 60
            <h2
61
              className="card-title"
62
              style={{ fontSize: '1.7rem', fontWeight: '700' }}
63
            >
64
              Notificaciones
65
            </h2>
2476 stevensc 66
            <div className="messages-sec border-gray px-5 py-4">
2471 stevensc 67
              <ul>
68
                {
69
                  notifications.length
2611 stevensc 70
                    ? notifications.reverse().map((element, i) => (
2471 stevensc 71
                      <li key={i}>
2478 stevensc 72
                        <div className="notification-item">
2473 stevensc 73
                          <a href={element.link}>
74
                            {element.message}
75
                          </a>
76
                          <span>
77
                            {element.time_elapsed}
78
                          </span>
2471 stevensc 79
                        </div>
80
                      </li>
1310 steven 81
                    )
2471 stevensc 82
                    )
83
                    :
84
                    <div
85
                      className="section_admin_title_buttons w-100"
86
                      style={{ display: 'grid', placeItems: 'center' }}
87
                    >
2472 stevensc 88
                      <h1 className="title">No hay notificaciones</h1>
2471 stevensc 89
                    </div>
90
                }
91
              </ul>
1311 steven 92
            </div>
93
          </div>
1309 steven 94
        </div>
95
      </div>
2468 stevensc 96
    </section >
1307 steven 97
  )
98
}
2469 stevensc 99
export default Notifications