jam-cloud/jam-ui/src/components/navbar/JKProfileDropdown.js

62 lines
1.9 KiB
JavaScript

//import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import React, { useState, useEffect } from 'react';
import { Link, useHistory } from 'react-router-dom';
import { DropdownItem, DropdownMenu, DropdownToggle, Dropdown } from 'reactstrap';
import { useAuth } from '../../context/AuthContext';
import JKProfileAvatar from '../profile/JKProfileAvatar';
const ProfileDropdown = () => {
const [dropdownOpen, setDropdownOpen] = useState(false);
const toggle = () => setDropdownOpen(prevState => !prevState);
const {currentUser, setCurrentUser} = useAuth();
const history = useHistory();
//const [cookies, setCookie, removeCookie] = useCookies(['remember_token']);
const handleLogout = () => {
setCurrentUser(null);
console.log("signout...");
}
return (
<>
<Dropdown
nav
inNavbar
data-testid="navbarTopProfileDropdown"
isOpen={dropdownOpen}
toggle={toggle}
onMouseOver={() => {
let windowWidth = window.innerWidth;
windowWidth > 992 && setDropdownOpen(true);
}}
onMouseLeave={() => {
let windowWidth = window.innerWidth;
windowWidth > 992 && setDropdownOpen(false);
}}
>
<DropdownToggle nav className="pr-0">
<JKProfileAvatar url={currentUser.photo_url} className="d-block d-lg-none d-xl-none" />
<span className="d-none d-lg-block">
{currentUser && currentUser.name}
</span>
</DropdownToggle>
<DropdownMenu right className="dropdown-menu-card">
<div className="bg-white rounded-soft py-2">
<DropdownItem tag={Link} to="/pages/settings">
My Profile
</DropdownItem>
<DropdownItem onClick={handleLogout}>
Sign out
</DropdownItem>
</div>
</DropdownMenu>
</Dropdown>
</>
);
};
export default ProfileDropdown;