Rev 5461 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useEffect, useState, useRef } from 'react'
import SocialNetworks from '../../../../dashboard/components/home-section/SocialNetworks'
import ProfileInfo from '../../../../dashboard/components/home-section/ProfileInfo'
import SuggestWidget from '../../../../shared/helpers/my-groups-helper/SuggestWidget'
const ResponsiveNavbar = ({ show, navbarVars }) => {
// const { authorization } = props.companyVars
// const {allowProfile, allowFollower, allowUser, allowFeed, allowJob, allowCompany, allowSetting} = authorization
const [shouldRender, setShouldRender] = useState(show)
const responsiveNavbar = useRef()
const handleUnmount = () => !show && setShouldRender(false)
useEffect(() => {
if (show) return setShouldRender(show)
}, [show])
useEffect(() => {
const handleClickOutside = (event) => {
if (responsiveNavbar.current && !responsiveNavbar.current.contains(event.target)) {
setShouldRender(false)
}
}
document.addEventListener('mousedown', handleClickOutside)
return () => {
document.removeEventListener('mousedown', handleClickOutside)
}
}, [responsiveNavbar])
return (
<nav
className={`responsiveNavbar ${shouldRender ? 'slideIn' : 'slideOut'} p-0`}
onAnimationEnd={handleUnmount}
ref={responsiveNavbar}
>
<ProfileInfo {...navbarVars} />
<SuggestWidget title='Mis Grupos:' url='/helpers/my-groups' />
<SuggestWidget title='Grupos:' url='/helpers/groups-suggestion' />
<SocialNetworks />
</nav>
)
}
export default ResponsiveNavbar