Proyectos de Subversion LeadersLinked - Antes de SPA

import React from 'react';
import { useState } from 'react';
import { useLayoutEffect } from 'react';
import { axios } from '../utils';

export default () => {
  const [notifications, setNotifications] = useState([]);
  const handleNotifications = async () => {
    try {
      console.log('>>: _notifications ', notifications)
      const _notifications = await axios.get('/notifications');
      setNotifications(_notifications.data.data)
    } catch (error) {
      console.log('>>: error > ', error)
    }
  }
  useLayoutEffect(() => {
    handleNotifications();
  }, []);
  return (
    <section className="notifications-page">
      <div className="card">
        <div className="card-body">
          <div className="container">
          <h2 className="card-title" style={{
            fontSize: '1.7rem'
          }}>Notificaciones</h2>
            <div className="messages-sec">
              <table className="table table-striped">
                <tbody>
                  {
                    !!notifications.length && (
                      notifications.map((element, i) => {
                        return(
                          <tr key={i.toString()}>
                            <td>
                              <div
                                className="row w-100"
                              >
                                <div
                                  className="col-md-6 col-sm-12"
                                >
                                  <a href={element.link}>
                                    {element.message}
                                  </a>
                                </div>
                                <div
                                  className="col-md-6 col-sm-12 text-right w-100"
                                >
                                  <span className="w-100 text-right"> {element.time_elapsed} </span>
                                </div>
                              </div>
                            </td>
                          </tr>
                        )
                      })
                    )
                  }
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}