Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5266 | Rev 6245 | 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 */
4979 stevensc 2 
import React, { useLayoutEffect, 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 = ({
5266 stevensc 10 
  Icon = null,
11 
  title = '',
12 
  url = '',
13 
  childs = [],
14 
  ajaxRequest = 0,
15 
  isMobile = false,
6244 stevensc 16 
  badgeCount = 0,
4946 stevensc 17 
}) => {
5266 stevensc 18 
  const [displayMenu, setDisplayMenu] = useState(false)
19 
  const menu = useRef(null)
20 
  const outsideClick = useOutsideClick(menu)
4810 stevensc 21 
 
5266 stevensc 22 
  const handleClick = () => {
23 
    setDisplayMenu(!displayMenu)
24 
  }
4946 stevensc 25 
 
5266 stevensc 26 
  const handleAjaxRequest = async () => {
27 
    try {
28 
      const { data } = await axios.get(url)
6244 stevensc 29 
      if (data.success) {
30 
        setTimeout(() => window.open(data.data, '_blank'), 500)
31 
      }
5266 stevensc 32 
    } catch (error) {
33 
      console.log('>>: error > ', error)
4844 stevensc 34 
    }
5266 stevensc 35 
  }
4971 stevensc 36 
 
5266 stevensc 37 
  useLayoutEffect(() => {
38 
    if (outsideClick) setDisplayMenu(false)
39 
  }, [outsideClick])
4971 stevensc 40 
 
5266 stevensc 41 
  return (
6244 stevensc 42 
    <li ref={menu} className={!isMobile && 'd-none d-lg-block'}>
43 
      <a
44 
        href={`/${url}`}
45 
        className={`header__option ${isMobile && 'mobile'} ${
46 
          displayMenu && 'active'
47 
        }`}
48 
        onClick={(e) => {
49 
          if (ajaxRequest) {
50 
            e.preventDefault()
51 
            handleAjaxRequest()
52 
          }
53 
          if (childs.length) {
54 
            e.preventDefault()
55 
            handleClick()
56 
          }
57 
        }}
58 
        target="framename"
59 
      >
60 
        {Icon && <Icon className="header__option-icon" />}
61 
        <span>{title}</span>
62 
        <span
63 
          className={`badge ${badgeCount ? 'd-block' : 'd-none'}`}
64 
          style={{ top: '10px' }}
65 
        >
66 
          {badgeCount}
67 
        </span>
68 
      </a>
69 
      <ListItemDropdown isShow={displayMenu} options={childs} />
70 
    </li>
5266 stevensc 71 
  )
4243 stevensc 72 
}
73 
 
5266 stevensc 74 
export default HeaderOptions