Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4243 stevensc 1
/* eslint-disable react/prop-types */
4810 stevensc 2
import React, { useEffect, useRef, useState } from 'react'
4946 stevensc 3
import useOutsideClick from '../../../hooks/useOutsideClick'
4
import axios from '../../../utils/axios'
5
import ListItemDropdown from './ListItemDropdown'
4247 stevensc 6
import './HeaderOptions.scss'
4432 stevensc 7
import './Dropdowns.scss'
4243 stevensc 8
 
4946 stevensc 9
const HeaderOptions = ({
10
    Icon = null,
11
    title = '',
12
    url = '',
13
    childs = [],
14
    ajaxRequest = 0,
15
    isMobile = false,
16
    badgeCount = 0
17
}) => {
4809 stevensc 18
    const [displayMenu, setDisplayMenu] = useState(false)
4946 stevensc 19
    const outsideClick = useOutsideClick(menu)
4810 stevensc 20
    const menu = useRef(null)
21
 
4946 stevensc 22
    const handleClick = () => {
4971 stevensc 23
        setDisplayMenu(!displayMenu)
4946 stevensc 24
    }
25
 
4844 stevensc 26
    const handleAjaxRequest = async () => {
27
        try {
28
            const { data } = await axios.get(url)
29
            if (data.success) window.open(data.data, '_backend')
30
        } catch (error) {
31
            console.log('>>: error > ', error)
32
        }
33
    }
4971 stevensc 34
 
4947 stevensc 35
    useEffect(() => {
36
        if (outsideClick) setDisplayMenu(false)
37
    }, [outsideClick])
4971 stevensc 38
 
4243 stevensc 39
    return (
4946 stevensc 40
        <li ref={menu} className={!isMobile && 'd-none d-lg-block'}>
4765 stevensc 41
            <a
4844 stevensc 42
                href={`/${url}`}
4814 stevensc 43
                className={`header__option ${isMobile && 'mobile'} ${displayMenu && 'active'}`}
4809 stevensc 44
                onClick={(e) => {
4844 stevensc 45
                    if (ajaxRequest) {
46
                        e.preventDefault()
47
                        handleAjaxRequest()
48
                    }
4809 stevensc 49
                    if (childs.length) {
50
                        e.preventDefault()
4946 stevensc 51
                        handleClick()
4809 stevensc 52
                    }
53
                }}
4766 stevensc 54
                target='framename'
4763 stevensc 55
            >
4243 stevensc 56
                {Icon && <Icon className="header__option-icon" />}
4253 stevensc 57
                <span>{title}</span>
4946 stevensc 58
                <span className={`badge ${badgeCount ? 'd-block' : 'd-none'}`} style={{ top: '10px' }}>
59
                    {badgeCount}
60
                </span>
4243 stevensc 61
            </a>
4946 stevensc 62
            <ListItemDropdown isShow={displayMenu} options={childs} />
4247 stevensc 63
        </li>
4243 stevensc 64
    )
65
}
66
 
67
export default HeaderOptions