Línea 1... |
Línea 1... |
1 |
/* eslint-disable react/prop-types */
|
1 |
/* eslint-disable react/prop-types */
|
2 |
import React, { useEffect, useState } from 'react'
|
2 |
import React, { useEffect, useRef, useState } from 'react'
|
3 |
import axios from '../../../utils/axios'
|
3 |
import axios from '../../../utils/axios'
|
4 |
import { connect } from 'react-redux'
|
4 |
import { connect } from 'react-redux'
|
5 |
import { addNotification } from '../../../redux/notification/notification.actions'
|
5 |
import { addNotification } from '../../../redux/notification/notification.actions'
|
6 |
import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'
|
6 |
import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'
|
- |
|
7 |
import useOutsideClick from '../../../hooks/useOutsideClick'
|
Línea 7... |
Línea 8... |
7 |
|
8 |
|
8 |
const NotificationsOption = ({ addNotification, sessionLink, Icon, title, url, }) => {
|
9 |
const NotificationsOption = ({ addNotification, sessionLink, Icon, title, url, }) => {
|
9 |
const [notifications, setNotifications] = useState([])
|
10 |
const [notifications, setNotifications] = useState([])
|
10 |
const [displayMenu, setDisplayMenu] = useState(false)
|
11 |
const [displayMenu, setDisplayMenu] = useState(false)
|
11 |
const [notificationsCount, setNotificationsCount] = useState(0)
|
12 |
const [notificationsCount, setNotificationsCount] = useState(0)
|
- |
|
13 |
const [loading, setLoading] = useState(false);
|
- |
|
14 |
const menu = useRef(null)
|
- |
|
15 |
const outsideClick = useOutsideClick(menu)
|
- |
|
16 |
|
- |
|
17 |
useEffect(() => {
|
- |
|
18 |
if (outsideClick) setDisplayMenu(false)
|
Línea 12... |
Línea 19... |
12 |
const [loading, setLoading] = useState(false);
|
19 |
}, [outsideClick])
|
13 |
|
20 |
|
14 |
useEffect(() => {
|
21 |
useEffect(() => {
|
Línea 81... |
Línea 88... |
81 |
setDisplayMenu(!displayMenu)
|
88 |
setDisplayMenu(!displayMenu)
|
82 |
}
|
89 |
}
|
83 |
}
|
90 |
}
|
Línea 84... |
Línea 91... |
84 |
|
91 |
|
85 |
return (
|
92 |
return (
|
86 |
<li>
|
93 |
<li ref={menu}>
|
87 |
<a href={url} className="header__option mobile" target='framename' onClick={handleClick}>
|
94 |
<a href={url} className="header__option mobile" target='framename' onClick={handleClick}>
|
88 |
{Icon && <Icon className="header__option-icon" />}
|
95 |
{Icon && <Icon className="header__option-icon" />}
|
89 |
<span>{title}</span>
|
96 |
<span>{title}</span>
|
90 |
<span className={`badge ${notificationsCount ? 'd-block' : 'd-none'}`} style={{ top: '10px' }}>
|
97 |
<span className={`badge ${notificationsCount ? 'd-block' : 'd-none'}`} style={{ top: '10px' }}>
|