Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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