43 lines
1.2 KiB
JavaScript
43 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
import { useHistory } from 'react-router-dom';
|
|
|
|
import { Nav, Icon, Dropdown, Popover, Whisper } from 'rsuite';
|
|
|
|
export default function MenuDropdown() {
|
|
const history = useHistory();
|
|
const triggerRef = React.createRef();
|
|
|
|
function handleSelectMenu(eventKey, event) {
|
|
history.push(eventKey);
|
|
triggerRef.current.hide();
|
|
}
|
|
|
|
const MenuPopover = ({ onSelect, ...rest }) => (
|
|
<Popover {...rest} full>
|
|
<Dropdown.Menu onSelect={onSelect}>
|
|
<Dropdown.Item eventKey={'login'}>Login</Dropdown.Item>
|
|
<Dropdown.Item eventKey={'register'}>Register</Dropdown.Item>
|
|
<Dropdown.Item eventKey={'/'}>Dashboard</Dropdown.Item>
|
|
<Dropdown.Item eventKey={'schedule'}>Schedule a Meeting</Dropdown.Item>
|
|
<Dropdown.Item eventKey={4}>Account Settings</Dropdown.Item>
|
|
<Dropdown.Item eventKey={5}>Log Out</Dropdown.Item>
|
|
</Dropdown.Menu>
|
|
</Popover>
|
|
);
|
|
|
|
return (
|
|
<Nav pullRight>
|
|
<Nav.Item>
|
|
<Whisper
|
|
placement='bottomEnd'
|
|
trigger='click'
|
|
triggerRef={triggerRef}
|
|
speaker={<MenuPopover onSelect={handleSelectMenu} />}
|
|
>
|
|
<Icon appearance='primary' size='2x' icon='user-circle' />
|
|
</Whisper>
|
|
</Nav.Item>
|
|
</Nav>
|
|
);
|
|
}
|