Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4904 | Rev 4952 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 4904 Rev 4951
Línea 4... Línea 4...
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'
 7 
import useOutsideClick from '../../../hooks/useOutsideClick'
Línea 8... Línea 8...
8 
 
 8 
 
9 
const NotificationsOption = ({ addNotification, sessionLink, Icon, title, url, }) => {
 9 
const NotificationsOption = ({ addNotification, Icon, title, url, notificationsCount, setNotificationsCount }) => {
10 
    const [notifications, setNotifications] = useState([])
 10 
    const [notifications, setNotifications] = useState([])
11 
    const [displayMenu, setDisplayMenu] = useState(false)
 - 
 
12 
    const [notificationsCount, setNotificationsCount] = useState(0)
 - 
 
13 
    const [loading, setLoading] = useState(false)
 11 
    const [displayMenu, setDisplayMenu] = useState(false)
14 
    const menu = useRef(null)
 12 
    const menu = useRef(null)
Línea 15... Línea -...
15 
    const outsideClick = useOutsideClick(menu)
 - 
 
16 
 
 - 
 
17 
    const checkSession = async () => {
 - 
 
18 
        try {
 - 
 
19 
            setLoading(true)
 - 
 
20 
            const { data: response } = await axios.get(sessionLink)
 - 
 
21 
            const { total_notifications } = response.data
 - 
 
22 
 
 - 
 
23 
            if (response.success) {
 - 
 
24 
                setNotificationsCount(Number(total_notifications))
 - 
 
25 
            }
 - 
 
26 
            setLoading(false)
 - 
 
27 
        } catch (error) {
 - 
 
28 
            console.log(error)
 - 
 
29 
        }
 - 
 
30 
    }
 13 
    const outsideClick = useOutsideClick(menu)
31 
 
 14 
 
32 
    const readNotification = (link_read, link_notification) => {
 15 
    const readNotification = (link_read, link_notification) => {
33 
        axios.post(link_read)
 16 
        axios.post(link_read)
34 
            .then(({ data }) =>
 17 
            .then(({ data }) =>
Línea 39... Línea 22...
39 
 
 22 
 
40 
    const deleteNotification = (link_delete) => {
 23 
    const deleteNotification = (link_delete) => {
41 
        axios.post(link_delete)
 24 
        axios.post(link_delete)
42 
            .then(({ data }) => {
 25 
            .then(({ data }) => {
43 
                !data.success && addNotification({ style: 'danger', msg: data.data })
 26 
                !data.success && addNotification({ style: 'danger', msg: data.data })
44 
                setNotificationsCount(prev => prev - 1)
 27 
                setNotificationsCount(notificationsCount - 1)
45 
                setNotifications(notifications.filter(notification => notification.link_delete !== link_delete))
 28 
                setNotifications(notifications.filter(notification => notification.link_delete !== link_delete))
46 
                addNotification({ style: 'success', msg: data.data })
 29 
                addNotification({ style: 'success', msg: data.data })
47 
            })
 30 
            })
Línea 77... Línea 60...
77 
 
 60 
 
78 
    useEffect(() => {
 61 
    useEffect(() => {
79 
        handleNotifications()
 62 
        handleNotifications()
Línea 80... Línea -...
80 
    }, [notificationsCount])
 - 
 
81 
 
 - 
 
82 
    useEffect(() => {
 - 
 
83 
        let timer
 - 
 
84 
        if (!loading) {
 - 
 
85 
            timer = setTimeout(() => checkSession(), 1000)
 - 
 
86 
        }
 - 
 
87 
        return () => {
 - 
 
88 
            clearTimeout(timer)
 - 
 
89 
        }
 - 
 
90 
    }, [loading])
 63 
    }, [notificationsCount])
91 
 
 64 
 
92 
    return (
 65 
    return (
93 
        <li ref={menu}>
 66 
        <li ref={menu}>
94 
            <a href={url} className={`header__option mobile ${displayMenu && 'active'}`} target='framename' onClick={handleClick}>
 67 
            <a href={url} className={`header__option mobile ${displayMenu && 'active'}`} target='framename' onClick={handleClick}>
95 
                {Icon && <Icon className="header__option-icon" />}
 - 
 
96 
                <span>{title}</span>
 - 
 
97 
                <span className={`badge ${notificationsCount ? 'd-block' : 'd-none'}`} style={{ top: '10px' }}>
 - 
 
- 
 
 68 
                {Icon && <Icon className="header__option-icon" />}
98 
                    {notificationsCount}
 69 
                <span>{title}</span>
99 
                </span>
 70 
 
100 
            </a>
 71 
            </a>
101 
            {!!notifications.length &&
 72 
            {!!notifications.length &&
102 
                <nav className={`nav__options-dropdown d-none d-md-block ${displayMenu && 'show'}`} style={{ maxHeight: '300px', overflow: 'auto' }}>
 73 
                <nav className={`nav__options-dropdown d-none d-md-block ${displayMenu && 'show'}`} style={{ maxHeight: '300px', overflow: 'auto' }}>