75 lines
1.7 KiB
JavaScript
75 lines
1.7 KiB
JavaScript
import React from "react";
|
|
import PropTypes from "prop-types";
|
|
import Avatar from "@appserver/components/avatar";
|
|
import DropDown from "@appserver/components/drop-down";
|
|
import {
|
|
AvatarContainer,
|
|
LabelContainer,
|
|
MainLabelContainer,
|
|
MenuContainer,
|
|
StyledProfileMenu,
|
|
TopArrow,
|
|
} from "./StyledProfileMenu";
|
|
|
|
class ProfileMenu extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
avatarRole,
|
|
avatarSource,
|
|
children,
|
|
className,
|
|
displayName,
|
|
email,
|
|
clickOutsideAction,
|
|
open,
|
|
} = this.props;
|
|
|
|
return (
|
|
<DropDown
|
|
className={className}
|
|
directionX="right"
|
|
open={open}
|
|
clickOutsideAction={clickOutsideAction}
|
|
>
|
|
<StyledProfileMenu>
|
|
<MenuContainer>
|
|
<AvatarContainer>
|
|
<Avatar
|
|
size="medium"
|
|
role={avatarRole}
|
|
source={avatarSource}
|
|
userName={displayName}
|
|
/>
|
|
</AvatarContainer>
|
|
<MainLabelContainer>{displayName}</MainLabelContainer>
|
|
<LabelContainer>{email}</LabelContainer>
|
|
</MenuContainer>
|
|
<TopArrow />
|
|
</StyledProfileMenu>
|
|
{children}
|
|
</DropDown>
|
|
);
|
|
}
|
|
}
|
|
|
|
ProfileMenu.displayName = "ProfileMenu";
|
|
|
|
ProfileMenu.propTypes = {
|
|
avatarRole: PropTypes.oneOf(["owner", "admin", "guest", "user"]),
|
|
avatarSource: PropTypes.string,
|
|
children: PropTypes.any,
|
|
className: PropTypes.string,
|
|
displayName: PropTypes.string,
|
|
email: PropTypes.string,
|
|
id: PropTypes.string,
|
|
open: PropTypes.bool,
|
|
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
|
clickOutsideAction: PropTypes.func,
|
|
};
|
|
|
|
export default ProfileMenu;
|